<template>
|
<el-dialog
|
title="服务详情"
|
:visible="value"
|
width="50%"
|
:modal="false"
|
:show-close="false"
|
:before-close="onCancel"
|
>
|
<el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="100px" class="demo-ruleForm">
|
<el-form-item label="用户昵称:" >{{item.userName}}</el-form-item>
|
<el-form-item label="真实姓名:" >{{item.realName}}</el-form-item>
|
<el-form-item label="联系电话:" >{{item.phone}}</el-form-item>
|
<el-form-item label="申请服务内容:" >
|
<p>{{item.serviceContent}}</p>
|
<el-image
|
v-for="(i, ix) in item.serviceImage"
|
:key="ix"
|
style="width: 60px; height: 60px;margin-right:10px"
|
:src="i"
|
:preview-src-list="item.serviceImage">
|
</el-image>
|
</el-form-item>
|
<el-form-item label="服务状态:" >
|
{{serviceStat[item.serviceStatus]}}
|
</el-form-item>
|
<el-form-item label="服务进度" prop="remark">
|
<div v-for="(list , index) in item.serviceRecords" :key="index">
|
<p>{{list.createdAt}} {{list.stage}}</p>
|
<!-- <p>{{list.content}}</p>
|
<div v-if="list.image">
|
<el-image
|
v-for="(i2, index) in list.image"
|
:key="index"
|
style="width: 60px; height: 60px;margin-right:10px"
|
:src="i2"
|
:preview-src-list="list.image">
|
</el-image>
|
</div> -->
|
</div>
|
</el-form-item>
|
</el-form>
|
<!-- 底部按钮 -->
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="onCancel">取 消</el-button>
|
<el-button type="primary" @click="onOk('ruleForm')">确 定</el-button>
|
</span>
|
</el-dialog>
|
</template>
|
|
<script>
|
export default {
|
props: {
|
value: { type: Boolean },
|
chooseId2:{type:Number}
|
},
|
data() {
|
return {
|
ruleForm: {
|
status: '1',
|
name: '',
|
id: ''
|
},
|
serviceStat:['',"待核实","进行中","待评价","已完成","未通过"],
|
rules: {
|
name: [
|
{ required: true, message: '请输入话题', trigger: 'blur' }
|
]
|
},
|
title: '',
|
url: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
|
srcList: [
|
'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg',
|
'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg'
|
],
|
item:[],
|
serviceId:''
|
}
|
},
|
watch: {
|
chooseId2 (val) {
|
this.serviceId = val;
|
},
|
value(val) {
|
if(val) {
|
this.details(val)
|
}
|
}
|
|
},
|
|
methods: {
|
details(d) {
|
this.$api.get('fms/service/detail',{serviceId:this.serviceId},res=>{
|
if (res.serviceRecords) {
|
res.serviceRecords.forEach(e => {
|
e.image = e.image ? e.image.split(",") : [];
|
});
|
}
|
|
if (res.serviceImage) {
|
res.serviceImage = res.serviceImage.split(",");
|
}
|
this.item = res;
|
|
})
|
},
|
/** 取消 */
|
onCancel () {
|
this.$emit('change', false);
|
},
|
|
/** 确认 */
|
onOk(formName) {
|
this.$refs[formName].validate((valid) => {
|
if (valid) {
|
if (this.ruleForm.id) {
|
this.edit()
|
} else {
|
this.save()
|
}
|
} else {
|
return false;
|
}
|
});
|
},
|
|
save() {
|
this.$emit('success');
|
},
|
edit() {
|
this.$emit('success');
|
}
|
|
}
|
|
}
|
</script>
|
|
<style lang="less" scoped>
|
.el-form-item--small.el-form-item {
|
margin-bottom: 8px !important;
|
}
|
</style>
|
