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