From 3afbfae3004450dbd7ac8e4466cb104d67f81a44 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Fri, 29 Dec 2023 09:50:34 +0800
Subject: [PATCH] 报事报修相关更改

---
 src/views/task/reportForRepairs.vue |  449 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 444 insertions(+), 5 deletions(-)

diff --git a/src/views/task/reportForRepairs.vue b/src/views/task/reportForRepairs.vue
index e5d974c..e9cb515 100644
--- a/src/views/task/reportForRepairs.vue
+++ b/src/views/task/reportForRepairs.vue
@@ -1,3 +1,13 @@
+<!--
+ * @Author: shuishen 1109946754@qq.com
+ * @Date: 2023-12-14 17:10:00
+ * @LastEditors: shuishen 1109946754@qq.com
+ * @LastEditTime: 2023-12-29 09:45:23
+ * @FilePath: \jczz_web\src\views\task\reportForRepairs.vue
+ * @Description: 
+ * 
+ * Copyright (c) 2023 by shuishen, All Rights Reserved. 
+-->
 <!-- 走访日志 -->
 <template>
     <basic-container>
@@ -6,23 +16,108 @@
             :before-open="beforeOpen" @search-change="searchChange" @search-reset="searchReset"
             @selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"
             @refresh-change="refreshChange" @on-load="onLoad">
+            <template slot="expand" slot-scope="{row}">
+                <el-timeline>
+                    <el-timeline-item v-for="(item, index) in timeLineData(row)" :key="index" :timestamp="item.createTime"
+                        :icon="item.icon" :color="item.color" :hide-timestamp="item.contentType == 3" placement="top">
+                        <el-card v-show="item.contentType == 1" :body-style="{ padding: '10px', background: '#f8f8f8' }">
+                            <div>
+                                评价:{{ item.content }}
+                            </div>
+                            <el-rate v-model="item.point" disabled :colors="colors">
+                            </el-rate>
+                        </el-card>
+
+                        <el-card v-show="item.peopleType != 1 && item.contentType == 0"
+                            :body-style="{ padding: '10px', background: '#f8f8f8' }">
+                            <div>
+                                {{ item.name }} {{ item.mobile }}
+                            </div>
+                            <div>
+                                {{ item.content }}
+                            </div>
+                            <div v-show="item.imageList != '' && item.imageList != null">
+                                <el-image style="width: 100px; height: 100px" :src="showCurImage(item.imageList)"
+                                    :preview-src-list="showImageListData(item.imageList)">
+                                </el-image>
+                            </div>
+                        </el-card>
+
+                        <el-card v-show="item.peopleType == 1 && item.contentType == 0"
+                            :body-style="{ padding: '10px', background: '#f8f8f8' }">
+                            <span style="color: rgb(204, 204, 204);">系统:{{ item.content || '959999' }}</span>
+                        </el-card>
+
+                        <span v-show="item.contentType == 3">结束</span>
+                    </el-timeline-item>
+
+
+                    <!-- <el-timeline-item timestamp="2018/4/12" placement="top">
+                        <el-card>
+                            <h4>更新 Github 模板</h4>
+                            <p>王小虎 提交于 2018/4/12 20:46</p>
+                        </el-card>
+                    </el-timeline-item> -->
+                </el-timeline>
+            </template>
+
+            <template slot-scope="scope" slot="menu">
+                <el-button type="text" icon="el-icon-chat-dot-square" @click="replyBtnClick(scope.row)">
+                    回复
+                </el-button>
+
+                <el-button type="text" icon="el-icon-document-copy" @click="turnOverBtnClick(scope.row)">
+                    移交
+                </el-button>
+            </template>
+
             <template slot="menuLeft">
                 <el-button size="small" icon="el-icon-delete" plain v-if="permission.article_delete" @click="handleDelete">删
                     除
                 </el-button>
             </template>
         </avue-crud>
+
+        <el-dialog title="回复" append-to-body :visible.sync="replyPopup" center @close="popupClose">
+            <avue-form ref="replyForm" :option="replyOption" v-model="replyForm" @submit="handleSubmit"
+                @reset-change="handleReset">
+                <template slot-scope="{row}" slot="videoList">
+                    <el-upload class="video-uploader" action="/api/blade-resource/oss/endpoint/put-file"
+                        :file-list="fileList" :headers="updateHeader" :show-file-list="true" :limit="1" :on-change="getFile"
+                        :on-exceed="handleExceed" :on-success="uploadVideoProcess" :before-upload="beforeUploadVideo"
+                        :before-remove="beforeRemove">
+                        <el-button size="small" type="primary">点击上传</el-button>
+                        <div slot="tip" class="el-upload__tip">上传视频只能是 mp4 格式,且大小不能超过 50MB</div>
+                    </el-upload>
+                </template>
+            </avue-form>
+        </el-dialog>
+
+        <el-dialog title="转交" append-to-body :visible.sync="turnOverPopup" center @close="popupClose">
+            <avue-form ref="turnOverForm" :option="turnOverOption" v-model="turnOverForm" @submit="turnOverHandleSubmit"
+                @reset-change="turnOverHandleReset"></avue-form>
+        </el-dialog>
     </basic-container>
 </template>
 
 <script>
-import { getList, remove, update, add, getReportForRepairs } from "@/api/task/reportForRepairs"
+import {
+    getList,
+    remove,
+    update,
+    add,
+    getReportForRepairs,
+    saveReply
+} from "@/api/task/reportForRepairs"
 import { mapGetters } from "vuex"
 import website from '@/config/website'
+import { Base64 } from 'js-base64'
+import { getToken } from '@/util/auth'
 
 export default {
     data () {
         return {
+            colors: ['#99A9BF', '#F7BA2A', '#FF9900'],
             form: {},
             query: {},
             loading: true,
@@ -34,6 +129,9 @@
             datetime: "",
             selectionList: [],
             option: {
+                index: false,
+                selection: false,
+                expand: true,
                 height: "auto",
                 calcHeight: 54,
                 dialogWidth: 950,
@@ -43,9 +141,7 @@
                 menuWidth: 350,
                 border: true,
                 //stripe:true,
-                index: true,
                 viewBtn: true,
-                selection: true,
                 // excelBtn: true,
                 dialogClickModal: false,
                 column: [
@@ -112,7 +208,7 @@
                         valueFormat: "yyyy-MM-dd HH:mm:ss",
                     },
                     {
-                        label: "备注",
+                        label: "描述",
                         prop: "remark",
                         type: "textarea",
                         hide: true,
@@ -121,6 +217,156 @@
                 ],
             },
             data: [],
+
+            replyPopup: false,
+            replyForm: {},
+            replyOption: {
+                submitBtn: true,
+                submitText: '确定',
+                emptyBtn: true,
+                emptyText: '取消',
+
+                column: [
+                    {
+                        span: 24,
+                        label: "说明",
+                        prop: "content",
+                        type: 'textarea',
+                        minRows: 3,
+                        maxRows: 5,
+                        rules: [{
+                            required: true,
+                            message: "请输入说明",
+                            trigger: "blur",
+                        }],
+                    },
+
+                    {
+                        label: '处理状态',
+                        prop: 'confirmFlag',
+                        type: 'select',
+                        dicData: [
+                            {
+                                label: '待处理',
+                                value: 1
+                            }, {
+                                label: '处理中',
+                                value: 2
+                            }, {
+                                label: '已处理',
+                                value: 3
+                            }
+                        ],
+                        rules: [{
+                            required: true,
+                            message: "请选择处理状态",
+                            trigger: "blur",
+                        }],
+                    },
+
+                    {
+                        fileType: 'img',
+                        label: "图片",
+                        prop: "imageList",
+                        width: 80,
+                        type: "upload",
+                        listType: "picture-card",
+                        dataType: "string",
+                        multiple: true,
+                        action: "/api/blade-resource/oss/endpoint/put-file",
+                        propsHttp: {
+                            res: "data",
+                            name: 'name',
+                            url: "link",
+                        },
+                        span: 24,
+                    },
+
+                    {
+                        slot: true,
+                        label: "视频",
+                        prop: "videoList",
+                        span: 24,
+                    }
+                ]
+            },
+
+            turnOverPopup: false,
+            turnOverForm: {},
+            turnOverOption: {
+                submitBtn: true,
+                submitText: '确定',
+                emptyBtn: true,
+                emptyText: '取消',
+
+                column: [
+                    // {
+                    //     hide: true,
+                    //     span: 14,
+                    //     label: "地址",
+                    //     prop: "addressCode",
+                    // },
+
+                    {
+                        span: 14,
+                        label: "人员类型",
+                        prop: "peopleType",
+                        type: 'select',
+                        dicData: [
+                            {
+                                label: '网格员',
+                                value: 0
+                            }, {
+                                label: '物业公司人员',
+                                value: 2
+                            }
+                        ],
+                        cascader: ["transferUserld"],
+                        rules: [{
+                            required: true,
+                            message: "请选择人员类型",
+                            trigger: "blur",
+                        }],
+                    },
+
+                    {
+                        span: 14,
+                        label: "指定人员",
+                        prop: "transferUserld",
+                        type: 'select',
+                        dicUrl: `/api/blade-system/user/getUserInfoByCode?houseCode={{addressCode}}&type={{peopleType}}`,
+                        props: {
+                            label: "name",
+                            value: "id",
+                        },
+                        change: ({ value, column, item, dic }) => {
+                            this.curPeopleDetails = {}
+
+                            if (value) {
+                                this.curPeopleDetails = item
+                            }
+                        },
+                        rules: [{
+                            required: true,
+                            message: "请选择指定人员",
+                            trigger: "blur",
+                        }],
+                    },
+                ]
+            },
+
+            curRow: {},
+
+            fileList: [],
+            updateHeader: {
+                Authorization: `Basic ${Base64.encode(`${website.clientId}:${website.clientSecret}`)}`,
+                'Blade-Auth': getToken()
+            },
+
+            curPeopleDetails: {},
+
+            videoFlag: false,
+            videoUploadPercent: ''
         }
     },
     watch: {
@@ -142,8 +388,201 @@
             })
             return ids.join(",")
         },
+
+        timeLineData () {
+            return (row) => {
+                let imageList = row.imageUrls
+
+                if (row.taskRepairAppraiseList.length) {
+                    return [
+                        {
+                            createTime: row.createTime,
+                            mobile: row.phone,
+                            name: row.realName,
+                            imageList,
+                            content: row.remark,
+                            color: '#1890ff',
+                            contentType: 0,
+                        },
+                        ...row.taskRepairStepList.map((item, index) => {
+                            if (index == 0) {
+                                return {
+                                    ...item,
+                                    contentType: 0,
+                                }
+                            }
+                            return {
+                                ...item,
+                                contentType: 0
+                            }
+                        }),
+                        ...row.taskRepairAppraiseList.map(item => {
+                            return {
+                                ...item,
+                                contentType: 1
+                            }
+                        }),
+                        {
+                            contentType: 3,
+                            createTime: '',
+                            icon: 'el-icon-check',
+                            color: '#0bbd87'
+                        }
+                    ]
+                } else {
+                    return [
+                        {
+                            createTime: row.createTime,
+                            mobile: row.phone,
+                            name: row.realName,
+                            imageUrls,
+                            content: row.remark,
+                            color: '#1890ff',
+                            contentType: 0,
+                        },
+                        ...row.taskRepairStepList.map((item, index) => {
+                            if (index == 0) {
+                                return {
+                                    ...item,
+                                    contentType: 0,
+                                }
+                            }
+                            return {
+                                ...item,
+                                contentType: 0
+                            }
+                        })
+                    ]
+                }
+            }
+        },
+
+        showCurImage () {
+            return (data) => {
+                if (data != null && data.length > 0) {
+                    return data.split(',').filter(item => item != '')[0]
+                }
+                return ''
+            }
+        },
+
+        showImageListData () {
+            return (data) => {
+                if (data != null && data.length > 0) {
+                    return data.split(',').filter(item => item != '')
+                }
+                return []
+            }
+        }
     },
     methods: {
+        popupClose () {
+            this.$refs.replyForm && this.$refs.replyForm.resetForm()
+            this.$refs.turnOverForm && this.$refs.turnOverForm.resetForm()
+        },
+
+        saveReply (data, done) {
+            saveReply(data).then(
+                () => {
+                    this.replyPopup = false
+                    this.turnOverPopup = false
+                    this.onLoad(this.page)
+                    this.$message({
+                        type: "success",
+                        message: "操作成功!",
+                    })
+                    done()
+                },
+                (error) => {
+                    window.console.log(error)
+                }
+            )
+        },
+
+        handleSubmit (form, done) {
+            this.saveReply({
+                ...form,
+                videoList: this.fileList.map(item => item.response.data.link).join(','),
+                repairId: this.curRow.id,
+                peopleType: 0,
+                mobile: this.userInfo.phone
+            }, done)
+        },
+
+        handleReset () {
+            this.fileList = []
+            this.replyPopup = false
+        },
+
+        turnOverHandleSubmit (form, done) {
+            let content = ''
+
+            if (form.peopleType == 0) {
+                content = `事件已移交至 网格员 李伟`
+            } else if (form.peopleType == 2) {
+                content = `事件已移交至 物业公司人员 ${this.curPeopleDetails.distictName || ''}${this.curPeopleDetails.name}`
+            }
+
+            this.saveReply({
+                ...form,
+                confirmFlag: 1,
+                content,
+                peopleType: 1,
+                repairId: this.curRow.id,
+            }, done)
+        },
+
+        turnOverHandleReset () {
+            this.turnOverPopup = false
+        },
+
+        //移除
+        beforeRemove (file, fileList) {
+            return this.$confirm(`确定移除 ${file.name}?`).then(() => {
+                this.fileList = fileList
+            })
+        },
+
+        //上传
+        getFile (file, fileList) {
+            this.fileList = fileList
+        },
+
+        beforeUploadVideo (file) {
+            const isLt50M = file.size / 1024 / 1024 < 50
+            if (['video/mp4'].indexOf(file.type) == -1) {
+                this.$message.error('上传视频只能是 mp4 格式!')
+                return false
+            }
+            if (!isLt50M) {
+                this.$message.error('上传视频大小不能超过 50MB!')
+                return false
+            }
+            return true
+        },
+
+        handleExceed (files, fileList) {
+            this.$message.warning("目前只能上传一个视频文件")
+        },
+
+        uploadVideoProcess (event, file, fileList) {
+            console.log(event, file, fileList, this.fileList)
+        },
+
+        replyBtnClick (row) {
+            this.curRow = row
+            this.replyForm = {}
+            this.replyPopup = true
+        },
+
+        turnOverBtnClick (row) {
+            this.curRow = row
+            this.turnOverForm = {
+                addressCode: row.addressCode
+            }
+            this.turnOverPopup = true
+        },
+
         rowSave (row, done, loading) {
             if (row.imageUrls.length > 0) {
                 var urls = []
@@ -266,7 +705,7 @@
                     }
                 })
             }
-            // con
+            
             done()
         },
         currentChange (currentPage) {

--
Gitblit v1.9.3