jiangyy
3 years ago
11 changed files with 1284 additions and 55 deletions
@ -0,0 +1,962 @@ |
|||
<template> |
|||
<el-dialog |
|||
title="需求信息" |
|||
width="50%" |
|||
top="5vh" |
|||
append-to-body |
|||
class="dialog-h" |
|||
:visible="true" |
|||
:close-on-click-modal="false" |
|||
:before-close="handlerClose" |
|||
> |
|||
<el-form |
|||
label-width="120px" |
|||
:model="form" |
|||
:rules="rules" |
|||
ref="ruleForm" |
|||
class="form-wr dialog-h-content scroll-h" |
|||
> |
|||
<el-form-item label="操作方式" prop="addType"> |
|||
<el-radio-group v-model="addType"> |
|||
<el-radio label="look">查看</el-radio> |
|||
<template v-if="form.reportType != 'self_help'"> |
|||
<el-radio label="edit" v-if="form.status === 'pending'" |
|||
>修改</el-radio |
|||
> |
|||
<el-radio |
|||
label="cancel" |
|||
v-if="form.status !== 'finished' && form.status !== 'canceled'" |
|||
>取消</el-radio |
|||
> |
|||
</template> |
|||
<el-radio |
|||
label="appoint" |
|||
v-if="form.status === 'pending' || form.status === 'assigned'" |
|||
>指派</el-radio |
|||
> |
|||
<el-radio |
|||
label="finish" |
|||
v-if=" |
|||
(form.reportType == 'self_help' && |
|||
form.serviceShowFlag && |
|||
form.serviceType !== 'volunteer' && |
|||
form.status !== 'finished') || |
|||
form.status === 'assigned' || |
|||
form.status === 'have_order' || |
|||
(form.status == 'finished' && !form.evaluateFlag) |
|||
" |
|||
>完成</el-radio |
|||
> |
|||
</el-radio-group> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="所属网格" prop="gridId"> |
|||
<el-input |
|||
v-if="disabled" |
|||
v-model="form.gridName" |
|||
:disabled="disabled" |
|||
class="input-width" |
|||
></el-input> |
|||
<!-- <span >{{ form.gridName }}</span> --> |
|||
<el-select |
|||
v-else |
|||
v-model="form.gridId" |
|||
filterable |
|||
placeholder="请选择" |
|||
class="input-width" |
|||
clearable |
|||
:disabled="disabled" |
|||
@change="handleGridChange" |
|||
> |
|||
<el-option |
|||
v-for="item in disabled ? optionsG : optionsEditG" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="需求类型" prop="categoryCode"> |
|||
<el-input |
|||
v-if="disabled" |
|||
v-model="form.categoryName" |
|||
:disabled="disabled" |
|||
class="input-width" |
|||
clearable |
|||
></el-input> |
|||
<el-cascader |
|||
v-else |
|||
v-model="form.categoryCodeArr" |
|||
:options="demandOptions" |
|||
:disabled="disabled" |
|||
clearable |
|||
class="input-width" |
|||
@change="handleCateSlect" |
|||
></el-cascader> |
|||
</el-form-item> |
|||
<el-form-item label="上报类型" prop="reportType"> |
|||
<el-input |
|||
v-if="disabled" |
|||
v-model="form.reportTypeName" |
|||
:disabled="disabled" |
|||
class="input-width" |
|||
></el-input> |
|||
<el-select |
|||
v-else |
|||
v-model="form.reportType" |
|||
filterable |
|||
class="input-width" |
|||
placeholder="请选择" |
|||
clearable |
|||
:disabled="disabled" |
|||
> |
|||
<el-option |
|||
v-for="item in reportOptions" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="上报人" prop="reportUserName"> |
|||
<el-input |
|||
v-model="form.reportUserName" |
|||
:disabled="disabled" |
|||
placeholder="请输入" |
|||
class="input-width" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="上报人手机号" prop="reportUserMobile"> |
|||
<el-input |
|||
v-model="form.reportUserMobile" |
|||
:disabled="disabled" |
|||
placeholder="请输入" |
|||
class="input-width" |
|||
maxlength="11" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="上报时间" prop="reportTime"> |
|||
<el-date-picker |
|||
v-model="form.reportTime" |
|||
type="datetime" |
|||
class="input-width" |
|||
clearable |
|||
:disabled="disabled" |
|||
value-format="yyyy-MM-dd HH:mm:ss" |
|||
placeholder="选择日期时间" |
|||
> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
<el-form-item label="需求人" prop="demandUserId"> |
|||
<el-input |
|||
v-if="disabled" |
|||
v-model="form.demandUserName" |
|||
:disabled="disabled" |
|||
class="input-width" |
|||
></el-input> |
|||
<el-select |
|||
v-else |
|||
v-model="selectDemandUser" |
|||
class="input-width" |
|||
filterable |
|||
:disabled="disabled" |
|||
placeholder="请选择" |
|||
clearable |
|||
@change="handleDemandChange" |
|||
> |
|||
<el-option |
|||
v-for="item in demandUserList" |
|||
:key="item.demandUserId" |
|||
:label="item.label" |
|||
:value="item" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="服务时间" prop="wantServiceTime"> |
|||
<el-date-picker |
|||
v-model="form.wantServiceTime" |
|||
type="datetime" |
|||
class="input-width" |
|||
clearable |
|||
:disabled="disabled" |
|||
value-format="yyyy-MM-dd HH:mm:ss" |
|||
placeholder="选择日期时间" |
|||
> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
<el-form-item label="需求内容" prop="content"> |
|||
<el-input |
|||
v-model="form.content" |
|||
:autosize="{ minRows: 2, maxRows: 10 }" |
|||
:disabled="disabled" |
|||
type="textarea" |
|||
clearable |
|||
class="input-width-textarea" |
|||
placeholder="请输入内容" |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item |
|||
v-if=" |
|||
addType === 'appoint' || |
|||
addType == 'finish' || |
|||
(addType == 'look' && form.serviceShowFlag) |
|||
" |
|||
label="服务方" |
|||
prop="serviceType" |
|||
> |
|||
<template v-if="disabled && addType !== 'appoint'"> |
|||
<el-input |
|||
v-model="form.serviceShowName" |
|||
:disabled="disabled" |
|||
class="input-width" |
|||
></el-input> |
|||
</template> |
|||
<template v-else> |
|||
<el-select |
|||
v-model="form.serviceType" |
|||
class="input-width-small" |
|||
placeholder="请选择" |
|||
clearable |
|||
:disabled="disabled && addType !== 'appoint'" |
|||
@change="handleServiceChange('add', $event)" |
|||
> |
|||
<el-option |
|||
v-for="item in serviceOptions" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
- |
|||
<el-select |
|||
v-model="form.serverId" |
|||
class="input-width-middle" |
|||
filterable |
|||
placeholder="请选择" |
|||
clearable |
|||
:disabled="disabled && addType !== 'appoint'" |
|||
> |
|||
<el-option |
|||
v-for="item in serviceOptiondList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</template> |
|||
</el-form-item> |
|||
<el-form-item |
|||
v-if="addType == 'look' && form.status == 'canceled'" |
|||
label="取消时间" |
|||
prop="cancelTime" |
|||
> |
|||
<span>{{ form.cancelTime }}</span> |
|||
</el-form-item> |
|||
<template |
|||
v-if=" |
|||
(addType == 'finish' && form.reportType != 'self_help') || |
|||
(addType == 'look' && form.status == 'finished') |
|||
" |
|||
> |
|||
<el-form-item label="实际服务时间" prop="serviceStartTime"> |
|||
<el-date-picker |
|||
v-model="finishServiceTime" |
|||
class="input-width-min" |
|||
clearable |
|||
:disabled="disabled && addType != 'finish'" |
|||
type="datetimerange" |
|||
range-separator="至" |
|||
start-placeholder="开始日期" |
|||
end-placeholder="结束日期" |
|||
value-format="yyyy-MM-dd HH:mm:ss" |
|||
@change="handelBlurServiceTime" |
|||
> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
<el-form-item label="完成情况" prop="finishResult"> |
|||
<el-radio |
|||
v-model="form.finishResult" |
|||
label="resolved" |
|||
:disabled="disabled && addType != 'finish'" |
|||
>已解决</el-radio |
|||
> |
|||
<el-radio |
|||
v-model="form.finishResult" |
|||
label="unresolved" |
|||
:disabled="disabled && addType != 'finish'" |
|||
>未解决</el-radio |
|||
> |
|||
</el-form-item> |
|||
<el-form-item label="评价" prop="score" class="form-score"> |
|||
<el-rate |
|||
v-model="form.score" |
|||
:allow-half="true" |
|||
:disabled="disabled && addType != 'finish'" |
|||
></el-rate> |
|||
</el-form-item> |
|||
<el-form-item label="备注" prop="finishDesc"> |
|||
<el-input |
|||
v-model="form.finishDesc" |
|||
:autosize="{ minRows: 2, maxRows: 10 }" |
|||
:disabled="disabled && addType != 'finish'" |
|||
type="textarea" |
|||
clearable |
|||
class="input-width-textarea" |
|||
placeholder="请输入内容" |
|||
></el-input> |
|||
</el-form-item> |
|||
</template> |
|||
<template v-if="addType == 'finish' && form.reportType == 'self_help'"> |
|||
<el-form-item label="实际服务时间" prop="serviceStartTime"> |
|||
<el-date-picker |
|||
v-model="finishServiceTime" |
|||
class="input-width-min" |
|||
clearable |
|||
:disabled="disabled && addType != 'finish'" |
|||
type="datetimerange" |
|||
range-separator="至" |
|||
start-placeholder="开始日期" |
|||
end-placeholder="结束日期" |
|||
value-format="yyyy-MM-dd HH:mm:ss" |
|||
@change="handelBlurServiceTime" |
|||
> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
</template> |
|||
</el-form> |
|||
<div class="resi-btns"> |
|||
<el-button size="small" @click="handlerClose">关闭</el-button> |
|||
<el-button |
|||
v-if="addType != 'look'" |
|||
type="primary" |
|||
size="small" |
|||
:loading="btnLoading" |
|||
@click="handleSubmit" |
|||
>提交</el-button |
|||
> |
|||
</div> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapGetters } from "vuex"; |
|||
|
|||
export default { |
|||
props: { |
|||
demandRecId: { |
|||
type: String, |
|||
default: "", |
|||
}, |
|||
}, |
|||
|
|||
data() { |
|||
return { |
|||
addType: "look", |
|||
|
|||
btnLoading: false, |
|||
disabled: true, |
|||
pageLoading: false, |
|||
|
|||
form: { |
|||
gridId: "", |
|||
categoryCodeArr: [], |
|||
categoryCode: "", |
|||
parentCode: "", |
|||
content: "", |
|||
reportType: "", |
|||
reportUserName: "", |
|||
reportUserMobile: "", |
|||
reportTime: "", |
|||
wantServiceTime: "", |
|||
demandUserId: "", |
|||
demandUserName: "", |
|||
demandUserMobile: "", |
|||
}, |
|||
|
|||
serviceOptions: [ |
|||
{ |
|||
label: "志愿者", |
|||
value: "volunteer", |
|||
}, |
|||
// { |
|||
// label: '社会组织', |
|||
// value: 'social_org' |
|||
// }, |
|||
{ |
|||
label: "社区自组织", |
|||
value: "community_org", |
|||
}, |
|||
{ |
|||
label: "区域党建单位", |
|||
value: "party_unit", |
|||
}, |
|||
], |
|||
serviceOptiondList: [], |
|||
demandUserList: [], |
|||
optionsEditG: [], |
|||
reportOptions: [], |
|||
demandOptions: [], |
|||
selectDemandUser: "", |
|||
finishServiceTime: "", |
|||
|
|||
options: [ |
|||
{ |
|||
label: "是", |
|||
value: 1, |
|||
}, |
|||
{ |
|||
label: "否", |
|||
value: 2, |
|||
}, |
|||
], |
|||
|
|||
rules: { |
|||
serviceStartTime: [ |
|||
{ required: true, message: "实际服务时间不能为空", trigger: "blur" }, |
|||
], |
|||
score: [{ required: true, message: "评分不能为空", trigger: "blur" }], |
|||
finishResult: [ |
|||
{ required: true, message: "完成情况不能为空", trigger: "blur" }, |
|||
], |
|||
}, |
|||
}; |
|||
}, |
|||
|
|||
computed: { |
|||
...mapGetters(["clientHeight", "iframeHeight"]), |
|||
}, |
|||
|
|||
watch: { |
|||
addType(val) { |
|||
this.formatRowForm(val); |
|||
}, |
|||
}, |
|||
|
|||
async created() { |
|||
this.customerId = localStorage.getItem("customerId"); |
|||
|
|||
this.getInfo(); |
|||
|
|||
this.pageLoading = true; |
|||
}, |
|||
|
|||
methods: { |
|||
filterEdit(id) { |
|||
const { user } = this.$store.state; |
|||
return id === user.agencyId; |
|||
}, |
|||
handleCateSlect(val) { |
|||
console.log("val", val); |
|||
if (val.length === 1) { |
|||
this.demandOptions.forEach((item) => { |
|||
if (item.value == val[0]) this.form.parentCode = item.pvalue; |
|||
}); |
|||
this.form.categoryCode = val[0]; |
|||
} else { |
|||
this.form.parentCode = val[0]; |
|||
this.form.categoryCode = val[1]; |
|||
} |
|||
}, |
|||
handleDemandChange(val) { |
|||
console.log("val", val, this.selectDemandUser); |
|||
this.selectDemandUser = val.label; |
|||
this.form.demandUserName = val.demandUserName; |
|||
this.form.demandUserMobile = val.demandUserMobile; |
|||
this.form.demandUserId = val.demandUserId; |
|||
}, |
|||
handelBlurServiceTime(val) { |
|||
console.log("val", val); |
|||
if (val.length > 0) { |
|||
this.form.serviceStartTime = val[0]; |
|||
this.form.serviceEndTime = val[1]; |
|||
} |
|||
}, |
|||
handleServiceChange(type, val) { |
|||
if (val === "social_org") { |
|||
if (type === "add") this.getServiceuserList(val, "add_demand"); |
|||
else this.getServiceuserList(val, "query_demand"); |
|||
} else this.getServiceuserList(val, ""); |
|||
}, |
|||
handleGridChange(val) { |
|||
this.getDemandUserList(); |
|||
}, |
|||
|
|||
handelBlurServiceTime(val) { |
|||
console.log("val", val); |
|||
if (val.length > 0) { |
|||
this.form.serviceStartTime = val[0]; |
|||
this.form.serviceEndTime = val[1]; |
|||
} |
|||
}, |
|||
|
|||
handleServiceChange(type, val) { |
|||
if (val === "social_org") { |
|||
if (type === "add") this.getServiceuserList(val, "add_demand"); |
|||
else this.getServiceuserList(val, "query_demand"); |
|||
} else this.getServiceuserList(val, ""); |
|||
}, |
|||
|
|||
handleAdd(addType) { |
|||
this.addType = addType; |
|||
this.dialogVisible = true; |
|||
}, |
|||
|
|||
handlerClose() { |
|||
this.$emit("close"); |
|||
}, |
|||
|
|||
async formatRowForm(addType) { |
|||
this.addType = addType; |
|||
const { form: row } = this; |
|||
|
|||
this.disabled = addType != "edit"; |
|||
|
|||
if (addType == "look") { |
|||
this.finishServiceTime = |
|||
(row.serviceStartTime && [ |
|||
row.serviceStartTime, |
|||
row.serviceEndTime, |
|||
]) || |
|||
""; |
|||
} |
|||
if (addType == "finish") { |
|||
if (row.serviceStartTime) |
|||
this.finishServiceTime = [row.serviceStartTime, row.serviceEndTime]; |
|||
|
|||
this.form.finishResult = "resolved"; |
|||
this.form.score = 5; |
|||
} |
|||
if (addType == "appoint" && row.serviceType) { |
|||
const type = row.serviceType == "social_org" ? "add_demand" : ""; |
|||
await this.getServiceuserList(row.serviceType, type); |
|||
} |
|||
if (addType == "edit") { |
|||
await this.getDemandUserList(); |
|||
this.demandOptions.forEach((item) => { |
|||
if (item.value === row.categoryCode) |
|||
this.form.categoryCode = [row.categoryCode]; |
|||
}); |
|||
this.demandUserList.forEach((item) => { |
|||
if (item.demandUserId == row.demandUserId) |
|||
this.selectDemandUser = item.label; |
|||
}); |
|||
} |
|||
|
|||
this.dialogVisible = true; |
|||
}, |
|||
|
|||
async appointAjax() { |
|||
const _form = { |
|||
demandRecId: this.form.demandRecId, |
|||
serviceType: this.form.serviceType, |
|||
serverId: this.form.serverId, |
|||
}; |
|||
await this.$http |
|||
.post("/heart/userdemand/assign", _form) |
|||
.then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error(res.msg); |
|||
} else { |
|||
this.handlerClose(); |
|||
this.getInfo(); |
|||
return this.$message.success("指派成功"); |
|||
} |
|||
}) |
|||
.catch(() => { |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
this.btnLoading = false; |
|||
}, |
|||
|
|||
async finishAjax() { |
|||
const { reportType, serviceShowFlag, serviceType } = this.form; |
|||
const _form = { |
|||
demandRecId: this.form.demandRecId, |
|||
serviceStartTime: this.form.serviceStartTime, |
|||
serviceEndTime: this.form.serviceEndTime, |
|||
finishResult: reportType == "self_help" ? "" : this.form.finishResult, |
|||
finishDesc: reportType == "self_help" ? "" : this.form.finishDesc, |
|||
serviceId: this.form.serviceId, |
|||
score: reportType == "self_help" ? 0 : this.form.score, |
|||
}; |
|||
await this.$http |
|||
.post("/heart/userdemand/finish", _form) |
|||
.then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error(res.msg); |
|||
} else { |
|||
this.handlerClose(); |
|||
this.getInfo(); |
|||
return this.$message.success("操作成功"); |
|||
} |
|||
}) |
|||
.catch(() => { |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
this.btnLoading = false; |
|||
}, |
|||
|
|||
async editCate() { |
|||
const categoryCode = this.form.categoryCode; |
|||
if (Array.isArray(categoryCode)) { |
|||
if (categoryCode.length === 1) { |
|||
this.demandOptions.forEach((item) => { |
|||
if (item.value == categoryCode[0]) |
|||
this.form.parentCode = item.pvalue; |
|||
}); |
|||
this.form.categoryCode = categoryCode[0]; |
|||
} else { |
|||
this.form.parentCode = categoryCode[0]; |
|||
this.form.categoryCode = categoryCode[1]; |
|||
} |
|||
} |
|||
|
|||
const _form = { |
|||
...this.form, |
|||
}; |
|||
await this.$http |
|||
.post("/heart/userdemand/update", _form) |
|||
.then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error(res.msg); |
|||
} else { |
|||
this.handlerClose(); |
|||
this.getInfo(); |
|||
return this.$message.success("修改成功"); |
|||
} |
|||
}) |
|||
.catch(() => { |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
this.btnLoading = false; |
|||
}, |
|||
|
|||
handleSubmit() { |
|||
this.$refs.ruleForm.validate(async (valid) => { |
|||
if (valid) { |
|||
this.btnLoading = true; |
|||
if (this.addType == "add") this.addNew(); |
|||
else if (this.addType == "edit") this.editCate(); |
|||
else if (this.addType == "appoint") this.appointAjax(); |
|||
else if (this.addType == "finish") this.finishAjax(); |
|||
else if (this.addType == "cancel") this.handleDel(); |
|||
} else { |
|||
console.log("error submit!!"); |
|||
return false; |
|||
} |
|||
}); |
|||
}, |
|||
|
|||
handleDel() { |
|||
let params = { |
|||
demandRecId: this.demandRecId, |
|||
}; |
|||
this.$http |
|||
.post("/heart/userdemand/cancel", params) |
|||
.then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error(res.msg); |
|||
} else { |
|||
this.$message.success("取消成功"); |
|||
this.getInfo(); |
|||
} |
|||
}) |
|||
.catch((err) => { |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
|
|||
getTreeData(data) { |
|||
if (!Array.isArray(data)) return []; |
|||
let arr = data.map((item) => { |
|||
let _item = {}; |
|||
if (item.children) { |
|||
if (item.children.length === 0) |
|||
_item = { ...item, children: undefined }; |
|||
else _item = { ...item, children: this.getTreeData(item.children) }; |
|||
} else { |
|||
_item = { ...item }; |
|||
} |
|||
return _item; |
|||
}); |
|||
return arr; |
|||
}, |
|||
|
|||
getFlagData(data, flag) { |
|||
if (!Array.isArray(data)) return []; |
|||
let arr1 = data.filter((item) => item[flag]); |
|||
let arr2 = arr1.map((item) => { |
|||
if (item.children) |
|||
return { ...item, children: this.getFlagData(item.children, flag) }; |
|||
else return item; |
|||
}); |
|||
// console.log('arrr-oppp', arr2) |
|||
return arr2; |
|||
}, |
|||
|
|||
async getGridList(type, agencyId) { |
|||
const { user } = await this.$store.state; |
|||
console.log("user---ppp", user); |
|||
// addorupdate query |
|||
await this.$http |
|||
.post("/gov/org/customergrid/gridoption", { |
|||
agencyId: agencyId || user.agencyId, |
|||
purpose: type, |
|||
}) |
|||
.then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error(res.msg); |
|||
} else { |
|||
console.log("获取查询详情成功", res.data); |
|||
|
|||
if (type === "query") this.optionsG = res.data; |
|||
else this.optionsEditG = res.data; |
|||
} |
|||
}) |
|||
.catch(() => { |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
|
|||
async getDemandUserList() { |
|||
const { user } = await this.$store.state; |
|||
console.log("user---ppp", user); |
|||
const params = { |
|||
agencyId: user.agencyId, |
|||
gridId: this.form.gridId, |
|||
name: "", |
|||
}; |
|||
// addorupdate |
|||
await this.$http |
|||
.post("/epmetuser/icresiuser/demandusers", params) |
|||
.then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error(res.msg); |
|||
} else { |
|||
console.log("获取查询详情成功", res.data); |
|||
this.demandUserList = res.data; |
|||
} |
|||
}) |
|||
.catch(() => { |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
|
|||
async getDemandOptions() { |
|||
this.$http |
|||
.post("/heart/icresidemanddict/demandoption") |
|||
.then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error(res.msg); |
|||
} else { |
|||
this.searchdemandOptions = this.getTreeData(res.data); |
|||
this.demandOptions = this.getFlagData( |
|||
this.getTreeData(res.data), |
|||
"usableFlag" |
|||
); |
|||
} |
|||
}) |
|||
.catch(() => { |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
|
|||
async getServiceuserList(serviceType, query) { |
|||
if (!serviceType) return false; |
|||
const { demandUserId } = this.form; |
|||
const params = { |
|||
serviceName: "", |
|||
serviceType: serviceType, |
|||
queryPurpose: query, |
|||
}; |
|||
await this.$http |
|||
.post("/heart/userdemand/servicelist", params) |
|||
.then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error(res.msg); |
|||
} else { |
|||
this.serviceOptiondList = res.data.filter( |
|||
(item) => item.value != demandUserId |
|||
); |
|||
} |
|||
}) |
|||
.catch(() => { |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
|
|||
async getDictOptions() { |
|||
this.$http |
|||
.post("/sys/dict/data/dictlist", { dictType: "user_demand_status" }) |
|||
.then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error(res.msg); |
|||
} else { |
|||
this.statusOptions = res.data; |
|||
} |
|||
}) |
|||
.catch(() => { |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
|
|||
this.$http |
|||
.post("/sys/dict/data/dictlist", { |
|||
dictType: "user_demand_report_type", |
|||
}) |
|||
.then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error(res.msg); |
|||
} else { |
|||
this.reportOptions = |
|||
res.data && res.data.filter((item) => item.value != "self_help"); |
|||
} |
|||
}) |
|||
.catch(() => { |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
|
|||
this.$http |
|||
.post("/sys/dict/data/dictlist", { |
|||
dictType: "user_demand_service_type", |
|||
}) |
|||
.then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error(res.msg); |
|||
} else { |
|||
this.serviceOptions = res.data; |
|||
} |
|||
}) |
|||
.catch(() => { |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
|
|||
async getInfo() { |
|||
let params = { |
|||
demandRecId: this.demandRecId, |
|||
}; |
|||
await this.$http |
|||
.post("/heart/userdemand/demandDetail", params) |
|||
.then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error(res.msg); |
|||
} else { |
|||
this.form = { |
|||
...this.form, |
|||
...res.data, |
|||
categoryCodeArr: [ |
|||
res.data.parentCode, |
|||
res.data.parentCode + res.data.categoryCode, |
|||
], |
|||
}; |
|||
this.getGridList(); |
|||
this.getDemandOptions(); |
|||
this.getDemandUserList(); |
|||
this.getServiceuserList(); |
|||
} |
|||
}) |
|||
.catch(() => { |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/buttonstyle.scss"; |
|||
|
|||
.resi-container .resi-card-table { |
|||
::v-deep .el-table th { |
|||
color: #fff; |
|||
background-color: rgba(33, 149, 254, 1); |
|||
// border-right: 1px solid rgba(33, 149, 254, 1); |
|||
} |
|||
} |
|||
.resi-table { |
|||
::v-deep .el-button--text { |
|||
text-decoration: underline; |
|||
} |
|||
::v-deep .btn-color-del { |
|||
margin: 0 10px; |
|||
color: rgba(213, 16, 16, 1); |
|||
} |
|||
::v-deep .btn-color-edit { |
|||
color: rgba(0, 167, 169, 1); |
|||
} |
|||
} |
|||
.form-wr { |
|||
.input-width { |
|||
width: 260px; |
|||
&-small { |
|||
width: 160px; |
|||
} |
|||
&-middle { |
|||
width: 200px; |
|||
} |
|||
&-min { |
|||
min-width: 260px; |
|||
} |
|||
} |
|||
.input-width-textarea { |
|||
width: 400px; |
|||
} |
|||
.form-score { |
|||
::v-deep .el-rate { |
|||
margin-top: 8px; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.resi-row-btn { |
|||
display: flex; |
|||
margin-bottom: 13px; |
|||
::v-deep .el-button { |
|||
// margin-left: 10px; |
|||
border: 0; |
|||
} |
|||
::v-deep .el-select { |
|||
margin-right: 10px; |
|||
} |
|||
.el-button--success { |
|||
background: rgba(34, 193, 195, 1); |
|||
} |
|||
} |
|||
.avatar-uploader { |
|||
::v-deep .el-upload { |
|||
cursor: pointer; |
|||
position: relative; |
|||
overflow: hidden; |
|||
} |
|||
.el-upload:hover { |
|||
border-color: #409eff; |
|||
} |
|||
.avatar { |
|||
width: 70px; |
|||
height: 70px; |
|||
display: block; |
|||
} |
|||
.avatar-uploader-icon { |
|||
border: 1px dashed #d9d9d9; |
|||
border-radius: 6px; |
|||
font-size: 28px; |
|||
color: #8c939d; |
|||
width: 70px; |
|||
height: 70px; |
|||
line-height: 70px; |
|||
text-align: center; |
|||
} |
|||
} |
|||
|
|||
.resi-btns { |
|||
margin-top: 20px; |
|||
text-align: center; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,269 @@ |
|||
<template> |
|||
<div class=""> |
|||
<div class="g-page" v-show="pageType == 'info'"> |
|||
<div class="g-left"> |
|||
<el-card> |
|||
<div class="m-row"> |
|||
<div class="m-info"> |
|||
<div class="info-title">需求内容</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">所属网格：</span> |
|||
<span>{{ info.gridName }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">需求类型：</span> |
|||
<span>{{ info.categoryName || "--" }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">上报类型：</span> |
|||
<span>{{ info.reportTypeName }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">上报人：</span> |
|||
<span>{{ info.reportUserName }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">上报人手机号：</span> |
|||
<span>{{ info.reportUserMobile }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">上报时间：</span> |
|||
<span>{{ info.reportTime }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">需求人：</span> |
|||
<span>{{ info.demandUserName }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">服务时间：</span> |
|||
<span>{{ info.wantServiceTime }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">需求内容：</span> |
|||
<span>{{ info.content }}</span> |
|||
</div> |
|||
<div class="info-prop" v-if="info.serviceShowName"> |
|||
<span class="info-title-2">服务方：</span> |
|||
<span>{{ info.serviceShowName }}</span> |
|||
</div> |
|||
<div class="info-prop" v-if="info.serviceStartTime"> |
|||
<span class="info-title-2">实际服务时间：</span> |
|||
<span |
|||
>{{ info.serviceStartTime }} - {{ info.serviceEndTime }}</span |
|||
> |
|||
</div> |
|||
<div class="info-prop" v-if="info.finishDesc"> |
|||
<span class="info-title-2">完成情况：</span> |
|||
<span>{{ info.finishDesc }}</span> |
|||
</div> |
|||
<div class="info-prop" v-if="info.score"> |
|||
<span class="info-title-2">评价：</span> |
|||
<span>{{ info.score }}</span> |
|||
</div> |
|||
<div class="info-prop" v-if="info.remark"> |
|||
<span class="info-title-2">备注：</span> |
|||
<span>{{ info.remark }}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="m-btns" v-if="type == 'info'"> |
|||
<el-button size="" @click="handleClose">关闭</el-button> |
|||
</div> |
|||
</el-card> |
|||
|
|||
<el-card |
|||
style="overflow: auto" |
|||
v-if="type == 'edit' && projectInfo.projectStatus == 'pending'" |
|||
> |
|||
<h3>处理</h3> |
|||
<div class="m-fm"> |
|||
<el-form |
|||
ref="fm" |
|||
:inline="false" |
|||
:model="fmData" |
|||
:rules="dataRule" |
|||
label-position="left" |
|||
label-width="100px" |
|||
> |
|||
<el-form-item label="处理方式：" prop="operateType"> |
|||
<el-radio-group v-model="fmData.operateType"> |
|||
<el-radio label="dispose">指派</el-radio> |
|||
<el-radio label="close">完成情况</el-radio> |
|||
</el-radio-group> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="您的身份：" prop="projectStaffId"> |
|||
<el-select |
|||
v-model.trim="fmData.projectStaffId" |
|||
placeholder="请选择" |
|||
class="resi-cell-select" |
|||
> |
|||
<el-option |
|||
v-for="item in myDepartmentList" |
|||
:key="item.projectStaffId" |
|||
:label="item.departmentName" |
|||
:value="item.projectStaffId" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
|
|||
<el-form-item |
|||
v-if="fmData.operateType == 'close'" |
|||
label="结案状态：" |
|||
prop="closedStatus" |
|||
> |
|||
<el-select |
|||
v-model.trim="fmData.closedStatus" |
|||
placeholder="请选择" |
|||
class="resi-cell-select" |
|||
> |
|||
<el-option |
|||
v-for="item in resolveTypeList" |
|||
:key="item.closedStatus" |
|||
:label="item.name" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
|
|||
<el-form-item |
|||
v-if="fmData.operateType == 'close'" |
|||
label="结案说明：" |
|||
prop="publicReply" |
|||
> |
|||
<el-input |
|||
type="textarea" |
|||
:rows="2" |
|||
placeholder="您输入的结案说明会向居民公开展示" |
|||
v-model="fmData.publicReply" |
|||
> |
|||
</el-input> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
<div class="m-btns"> |
|||
<el-button size="" style="margin-right: 50px" @click="handleClose" |
|||
>关闭</el-button |
|||
> |
|||
<el-button size="" type="danger" @click="handleSubmit" |
|||
>确定</el-button |
|||
> |
|||
</div> |
|||
</el-card> |
|||
</div> |
|||
<div class="g-right"></div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost } from "@/js/dai/request"; |
|||
import foldText from "@/views/components/foldText"; |
|||
import dateFormat from "dai-js/tools/dateFormat"; |
|||
|
|||
function iniData() { |
|||
return { |
|||
pageType: "info", |
|||
|
|||
info: { |
|||
demandRecId: "", |
|||
gridId: "", |
|||
gridName: "", |
|||
agencyId: "", |
|||
categoryCode: "", |
|||
parentCode: "", |
|||
categoryName: "", |
|||
firstCategoryCode: "", |
|||
firstCategoryName: "", |
|||
reportType: "", |
|||
reportTypeName: "", |
|||
content: "", |
|||
reportUserName: "", |
|||
reportUserMobile: "", |
|||
reportTime: "", |
|||
demandUserId: "", |
|||
demandUser: "", |
|||
demandUserName: "", |
|||
demandUserMobile: "", |
|||
wantServiceTime: "", |
|||
status: "", |
|||
statusName: "", |
|||
finishResult: "", |
|||
cancelTime: "", |
|||
evaluateFlag: true, |
|||
score: 5.0, |
|||
serviceId: "", |
|||
serviceName: "", |
|||
serviceShowName: "", |
|||
serviceType: "", |
|||
serverId: "", |
|||
serviceStartTime: "", |
|||
serviceEndTime: "", |
|||
finishDesc: "", |
|||
}, |
|||
|
|||
fmData: {}, |
|||
}; |
|||
} |
|||
|
|||
export default { |
|||
name: "demandInfo", |
|||
props: { |
|||
demandRecId: { |
|||
type: String, |
|||
default: "", |
|||
}, |
|||
}, |
|||
|
|||
components: { |
|||
foldText, |
|||
}, |
|||
|
|||
data: iniData, |
|||
|
|||
computed: {}, |
|||
|
|||
watch: {}, |
|||
|
|||
mounted() { |
|||
this.getApiData(); |
|||
}, |
|||
|
|||
methods: { |
|||
watchImg(src) { |
|||
window.open(src); |
|||
}, |
|||
|
|||
handleClose() { |
|||
this.$emit("close"); |
|||
}, |
|||
|
|||
async getApiData() { |
|||
this.getInfo(); |
|||
}, |
|||
//加载组织数据 |
|||
async getInfo() { |
|||
const url = "/heart/userdemand/demandDetail"; |
|||
|
|||
const { data, code, msg } = await requestPost(url, { |
|||
demandRecId: this.demandRecId, |
|||
}); |
|||
|
|||
if (code === 0) { |
|||
this.info = { ...this.info, ...data }; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style |
|||
lang="scss" |
|||
src="@/assets/scss/modules/shequzhili/project-info.scss" |
|||
scoped |
|||
></style> |
|||
Loading…
Reference in new issue