|
|
@@ -23,6 +23,34 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
+ <template v-if="module === 8">
|
|
|
+ <div class="maintain-result" v-if="dataDetail && dataDetail.module_info.feedback_status == 1">
|
|
|
+ <div class="m__header">
|
|
|
+ 维修结果
|
|
|
+ </div>
|
|
|
+ <p class="m__msg">
|
|
|
+ {{ dataDetail && dataDetail.module_info.feedback }}
|
|
|
+ </p>
|
|
|
+ <div class="m__imgs flex flex-row flex-row-aic" v-if="dataDetail && dataDetail.module_info.feedback_images">
|
|
|
+ <template v-for="(imgUrl, idx) in dataDetail.module_info.feedback_images.split(',')">
|
|
|
+ <img :src="imgUrl" :key="idx"
|
|
|
+ @click="handleReviewImages(dataDetail.module_info.feedback_images.split(','), idx)">
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 维修满意度调查 -->
|
|
|
+ <div class="maintain-form" v-if="dataDetail && dataDetail.module_info.comment_status == 1">
|
|
|
+ <layout title="满意度评价">
|
|
|
+ <van-rate :size="28" readonly :value="dataDetail.module_info.comment_score" />
|
|
|
+ </layout>
|
|
|
+ <c-input title="评价" :readonly="true" :value="dataDetail.module_info.comment" />
|
|
|
+ </div>
|
|
|
+ <div v-else class="evaluate">
|
|
|
+ 请对维修结果做出评价，<span @click="showInputResd = true" class="evaluate__event">点击评价</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
<!-- 各种审批内容组件 -->
|
|
|
<div class="examine-detail__main">
|
|
|
<detail-rows class="detail-row" v-for="(row, idx) in datalist" :key="idx" v-bind="row" />
|
|
|
@@ -42,10 +70,26 @@
|
|
|
<approve-control :edit-data="dataDetail" :id="id" :module="module" :flag="pageType"
|
|
|
:flag-state="dataDetailStatusComputed" />
|
|
|
</div>
|
|
|
+
|
|
|
+ <!-- NOTE: 添加 Popup 提交评价 -->
|
|
|
+ <van-popup v-model="showInputResd" style="background-color: transparent;" position="center">
|
|
|
+ <div class="popup-content">
|
|
|
+ <layout title="满意度评价" :required="true">
|
|
|
+ <van-rate :size="28" v-model="resdScore" />
|
|
|
+ </layout>
|
|
|
+
|
|
|
+ <c-input title="评价" :required="true" input-type="textarea" v-model="resd" />
|
|
|
+
|
|
|
+ <div class="btn-container">
|
|
|
+ <div class="btn-span" @click="handleSubmitEvaluate">提交</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </van-popup>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+
|
|
|
import * as dd from 'dingtalk-jsapi'
|
|
|
|
|
|
import setLeft from 'dingtalk-jsapi/api/biz/navigation/setLeft'
|
|
|
@@ -64,12 +108,18 @@ import { mapState } from 'vuex'
|
|
|
|
|
|
import { formatApplyforRows } from '@/utils/applyfor-item'
|
|
|
|
|
|
+import { ImagePreview } from 'vant'
|
|
|
+import Layout from '../applyfor/components/Layout.vue'
|
|
|
+import CInput from '../applyfor/components/CInput.vue'
|
|
|
+
|
|
|
export default {
|
|
|
name: 'ExamineDetail',
|
|
|
components: {
|
|
|
DetailRows,
|
|
|
ApproveFlowPath,
|
|
|
- ApproveControl
|
|
|
+ ApproveControl,
|
|
|
+ CInput,
|
|
|
+ Layout
|
|
|
},
|
|
|
computed: {
|
|
|
dataDetailStatusComputed() {
|
|
|
@@ -125,95 +175,6 @@ export default {
|
|
|
isiOS: checkPlatform() === 'iOS',
|
|
|
|
|
|
datalist: [],
|
|
|
- // datalist: [
|
|
|
- // {
|
|
|
- // title: '审批编号',
|
|
|
- // value: '20222110741458005442684',
|
|
|
- // },
|
|
|
- // {
|
|
|
- // title: '合同编号',
|
|
|
- // value: '20222110741458005442684',
|
|
|
- // type: 'link' // 代表它是一个链接
|
|
|
- // },
|
|
|
- // {
|
|
|
- // title: '所在部门',
|
|
|
- // value: '深圳市第二特殊教育学校-教师部'
|
|
|
- // },
|
|
|
- // {
|
|
|
- // title: '申请日期',
|
|
|
- // value: '2022-11-07',
|
|
|
- // type: 'date' // 代表返回的是unixtime 时间戳需要自己转义`dayjs`
|
|
|
- // },
|
|
|
- // {
|
|
|
- // title: '申请人',
|
|
|
- // value: '刘辉'
|
|
|
- // },
|
|
|
- // {
|
|
|
- // title: '申请事由',
|
|
|
- // value: '学生生活用品购买'
|
|
|
- // },
|
|
|
- // {
|
|
|
- // title: '申购类型',
|
|
|
- // value: '货物申购',
|
|
|
- // type: 'type' // 类型字段意味着这是枚举需要自己配置
|
|
|
- // },
|
|
|
- // {
|
|
|
- // type: 'projects',
|
|
|
- // title: '申购明细',
|
|
|
- // value: [
|
|
|
- // {
|
|
|
- // projectName: '学生冬季校服',
|
|
|
- // count: 20,
|
|
|
- // tags: ['蓝色', '165cm'],
|
|
|
- // money: 56025
|
|
|
- // },
|
|
|
- // {
|
|
|
- // projectName: '学生冬季校服',
|
|
|
- // count: 30,
|
|
|
- // tags: ['蓝色', '175cm'],
|
|
|
- // money: 65025
|
|
|
- // }
|
|
|
- // ]
|
|
|
- // },
|
|
|
- // {
|
|
|
- // title: '总金额',
|
|
|
- // value: '100000'
|
|
|
- // },
|
|
|
- // {
|
|
|
- // title: '预计申购完成日期',
|
|
|
- // value: '2022-11-08'
|
|
|
- // },
|
|
|
- // {
|
|
|
- // type: 'files', // 代表当前是 上传的文件
|
|
|
- // title: '附件材料',
|
|
|
- // value: [
|
|
|
- // {
|
|
|
- // type: 'pdf',
|
|
|
- // name: '采购说明.pdf',
|
|
|
- // size: '264.45KB'
|
|
|
- // }
|
|
|
- // ]
|
|
|
- // },
|
|
|
- // {
|
|
|
- // type: 'images', // 代表当前是图片组
|
|
|
- // title: '图片',
|
|
|
- // value: [
|
|
|
- // {
|
|
|
- // url: 'http://xxxxx'
|
|
|
- // },
|
|
|
- // {
|
|
|
- // url: 'http://xxxxx'
|
|
|
- // },
|
|
|
- // {
|
|
|
- // url: 'http://xxxxx'
|
|
|
- // }
|
|
|
- // ]
|
|
|
- // },
|
|
|
- // {
|
|
|
- // title: '支付方式',
|
|
|
- // value: '银行转账'
|
|
|
- // }
|
|
|
- // ],
|
|
|
|
|
|
pageType: '', // 页面类型 info and approve
|
|
|
pageFrom: '',
|
|
|
@@ -225,6 +186,11 @@ export default {
|
|
|
approveCopyList: [],
|
|
|
dataDetailStatus: -1,
|
|
|
module: undefined,
|
|
|
+
|
|
|
+
|
|
|
+ showInputResd: false,
|
|
|
+ resd: '', // 评价
|
|
|
+ resdScore: 3, // 评价分
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
@@ -273,6 +239,7 @@ export default {
|
|
|
const params = {
|
|
|
[paramsId]: this.id
|
|
|
}
|
|
|
+
|
|
|
const res = await this.apiFunc(params)
|
|
|
if (res.code === 1) {
|
|
|
this.dataDetail = res.data
|
|
|
@@ -291,12 +258,43 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
|
|
|
+ // NOTE: 预览图片
|
|
|
+ handleReviewImages(list, idx) {
|
|
|
+ ImagePreview({
|
|
|
+ images: list,
|
|
|
+ startPosition: idx
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
handleBackEvent() {
|
|
|
console.log('press back btn');
|
|
|
// NOTE: 通过路由返回
|
|
|
this.$router.push('/approve')
|
|
|
},
|
|
|
|
|
|
+ handleSubmitEvaluate() {
|
|
|
+ let comment_score = this.resdScore
|
|
|
+ let comment = this.resd
|
|
|
+ if (!comment) {
|
|
|
+ return this.$store('请填写维修评价')
|
|
|
+ }
|
|
|
+
|
|
|
+ approveInfoApi.postEvaluate({
|
|
|
+ comment,
|
|
|
+ comment_score,
|
|
|
+ id: this.dataDetail.id
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code === 1) {
|
|
|
+ this.$toast(res.msg)
|
|
|
+
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.showInputResd = false
|
|
|
+ this.__detail__()
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
// NOTE: 渲染`module_info`字段函数； 让其更好的渲染
|
|
|
async formatModuleInfoData(data) {
|
|
|
const { module, order_no, module_info, department_data } = data
|
|
|
@@ -375,7 +373,7 @@ export default {
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style lang="less">
|
|
|
+<style lang="less" scoped>
|
|
|
@import url('@/styles/variables.less');
|
|
|
|
|
|
.examine-detail {
|
|
|
@@ -383,13 +381,50 @@ export default {
|
|
|
.detail-row {
|
|
|
margin-bottom: 10px;
|
|
|
}
|
|
|
+
|
|
|
+ .maintain-result {
|
|
|
+ background-color: #fff;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ padding: 10px 12px;
|
|
|
+
|
|
|
+ .m {
|
|
|
+ &__header {
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #191A1E;
|
|
|
+ line-height: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__msg {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #9A9A9A;
|
|
|
+ line-height: 20px;
|
|
|
+ margin: 4px 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__imgs {
|
|
|
+ font-size: 0;
|
|
|
+ gap: 6px;
|
|
|
+ flex-wrap: wrap;
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 48px;
|
|
|
+ height: 48px;
|
|
|
+ border-radius: 6px;
|
|
|
+ vertical-align: middle;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
&__header {
|
|
|
position: relative;
|
|
|
padding: 10px 12px;
|
|
|
background-color: @white;
|
|
|
- margin-bottom: 6px;
|
|
|
+ margin-bottom: 10px;
|
|
|
|
|
|
.float-status {
|
|
|
position: absolute;
|
|
|
@@ -450,4 +485,43 @@ export default {
|
|
|
background-color: @white;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+.popup-content {
|
|
|
+ width: 80vw;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 6px;
|
|
|
+ overflow: hidden;
|
|
|
+
|
|
|
+ .layout-container {
|
|
|
+ border-bottom: 1px solid #eee;
|
|
|
+
|
|
|
+ &:nth-last-child(2) {
|
|
|
+ border-bottom: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .btn-container {
|
|
|
+ border-top: 10px solid #f2f1f6;
|
|
|
+ padding-bottom: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .btn-span {
|
|
|
+ margin: 0 auto;
|
|
|
+ width: 40%;
|
|
|
+ height: initial !important;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.maintain-form {
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.evaluate {
|
|
|
+ padding: 0 10px 10px;
|
|
|
+ font-size: 14px;
|
|
|
+
|
|
|
+ &__event {
|
|
|
+ color: @link-color;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
