From d7dca690cedd12e271f0ee0b9050679d73796f5c Mon Sep 17 00:00:00 2001 From: MrShi <1878285526@qq.com> Date: 星期一, 06 一月 2025 09:28:10 +0800 Subject: [PATCH] 1 --- admin/src/views/workorder/components/detail.vue | 94 +++++++++++++++++++++++++++++++++-------------- 1 files changed, 66 insertions(+), 28 deletions(-) diff --git a/admin/src/views/workorder/components/detail.vue b/admin/src/views/workorder/components/detail.vue index 55f1e8d..f2e7d5f 100644 --- a/admin/src/views/workorder/components/detail.vue +++ b/admin/src/views/workorder/components/detail.vue @@ -1,12 +1,12 @@ <template> - <GlobalWindow width="920px" title="宸ュ崟璇︽儏" :visible.sync="visible" :confirm-working="isWorking" @close="close" + <GlobalWindow width="960px" title="宸ュ崟璇︽儏" :visible.sync="visible" :confirm-working="isWorking" @close="close" @confirm="confirm"> <div class="main"> <div class="title"> <span>宸ュ崟璇︽儏</span> <div> <div class="status primaryColor" v-if="info.dealStatus == 0 || info.dealStatus == null">寰呮寚娲�</div> - <div class="status" v-if="info.dealStatus == 1">宸叉寚娲�</div> + <div class="status green" v-if="info.dealStatus == 1">宸叉寚娲�</div> <div class="status gray" v-if="info.dealStatus == 2">宸插鐞�</div> </div> </div> @@ -49,11 +49,21 @@ <div class="value" v-if="info.fileList == null || !info.fileList.length">鏃�</div> <div class="value" v-if="info.fileList != null && info.fileList.length"> <div v-for="item in info.fileList" :key="item.id" style="display: inline;margin-right: 20px"> - <video v-if="item.fileurlFull && item.fileurlFull.endsWith('.mp4')" ref="videoRef" controls - preload="auto" style="width: 80px;height: 80px;object-fit: contain;" :src="item.fileurlFull" /> - <el-image v-else-if="item.fileurlFull" style="width:80px; height: 80px" :src="item.fileurlFull" + <!-- <video v-if="item.fileurlFull && item.fileurlFull.endsWith('.mp4')" ref="videoRef" controls + preload="auto" style="width: 80px;height: 80px;object-fit: contain;" :src="item.fileurlFull" /> --> + <el-image v-if="item.type == 0" style="width:80px; height: 80px" :src="item.fileurlFull" :preview-src-list="[item.fileurlFull]"> </el-image> + </div> + </div> + </div> + <div v-if="info.fileList && info.fileList.length > 0 && info.fileList.filter(i => i.type == 1).length > 0" + class="item max"> + <div class="la">闂瑙嗛</div> + <div class="value"> + <div v-for="item in info.fileList" :key="item.id" style="display: inline;margin-right: 20px"> + <video v-if="item.type == 1" ref="videoRef" controls preload="auto" + style="width: 240px;height: 160px;object-fit: contain;" :src="item.fileurlFull" /> </div> </div> </div> @@ -61,7 +71,7 @@ <div class="side"> <div class="title">宸ュ崟娴佽浆璁板綍</div> <div class="flow_list"> - <div class="item" v-for="item,i in info.logList"> + <div class="item" v-for="item, i in info.logList"> <div class="icon"> <div class="dian"></div> <div v-if="i < info.logList.length - 1" class="line"></div> @@ -70,12 +80,15 @@ <div class="name">{{ item.title }}</div> <div class="time">鎿嶄綔鏃堕棿锛歿{ item.createDate }}</div> <div class="creator">鎿嶄綔浜猴細{{ item.param1 }}</div> + <div class="creator" v-if="item.param2">鎸囨淳缁欙細{{ item.param2 }}</div> </div> </div> </div> </div> </div> - <div class="title">{{ info.dealStatus == 0 || info.dealStatus == 1 ? '宸ュ崟澶勭悊' : '澶勭悊缁撴灉' }}</div> + <div class="title" + v-if="info.dealStatus == 2 || info.dealStatus == 0 || (info.dealStatus == 1 && info.dealUserId === userInfo.id)"> + {{ info.dealStatus == 0 || info.dealStatus == 1 ? '宸ュ崟澶勭悊' : '澶勭悊缁撴灉' }}</div> <el-form :model="param" ref="form" :rules="rules"> <template v-if="info.dealStatus == 0 || info.dealStatus == null"> <el-form-item label="澶勭悊鏂瑰紡" prop="dealType"> @@ -83,7 +96,7 @@ <el-radio v-model="param.dealType" :label="0">鎸囨淳</el-radio> <el-radio v-model="param.dealType" :label="1">鐩存帴鍥炲</el-radio> </div> - </el-form-item> + </el-form-item> <el-form-item v-if="param.dealType == 0" label="鎸囨淳缁�" prop="dealUserId"> <el-select v-model="param.dealUserId" clearable filterable class="w400"> <el-option v-for="item in staffList" :label="item.realname" :value="item.id"></el-option> @@ -103,8 +116,8 @@ </el-form-item> <el-form-item label="鐜板満鍥剧墖"> <div class="file_list"> - <el-upload class="avatar-uploader" :data="uploadData" :auto-upload="true" - :action="uploadImgUrl" :show-file-list="false" :on-success="uploadAvatarSuccess" :on-error="uploadError" + <el-upload class="avatar-uploader" :data="uploadData" :auto-upload="true" :action="uploadImgUrl" + :show-file-list="false" :on-success="uploadAvatarSuccess" :on-error="uploadError" :before-upload="beforeUpload"> <div class="upload_wrap"> <i class="el-icon-plus avatar-uploader-icon"></i> @@ -160,6 +173,7 @@ import { detailById, dispatchOrder, dealOrder } from '@/api/workorder/ywWorkorder' import { getUserList } from '@/api/system/user' import { Message, Loading } from 'element-ui' +import dayjs from 'dayjs' export default { components: { GlobalWindow @@ -221,6 +235,9 @@ const { id } = this detailById(id).then(res => { this.info = res + if (this.info.dealStatus == 1) { + this.$set(this.param, 'getDate', dayjs().format('YYYY-MM-DD HH:mm:ss')) + } }) }, getStaff() { @@ -299,9 +316,9 @@ align-items: center; .status { - padding: 0 6px; - height: 22px; - line-height: 22px; + padding: 0 12px; + height: 24px; + line-height: 24px; border-radius: 2px; border: 1px solid #00BA92; color: #00BA92; @@ -311,12 +328,19 @@ } .primaryColor { - border: 1px solid $primary-color; + border: 1px solid rgba(63, 126, 239, .2); + background-color: rgba(63, 126, 239, .2); + } + + .green { + background-color: rgba(83, 183, 148, .2); + border: 1px solid rgba(83, 183, 148, .2); } .gray { - color: gray; - border: 1px solid gray; + color: #333333; + background-color: rgba(128, 128, 128, .2); + border: 1px solid rgba(128, 128, 128, .2); } } @@ -330,11 +354,11 @@ .item { width: 33.3%; - margin-bottom: 12px; + margin-bottom: 14px; .la { color: #7f7f7f; - margin-top: 2px; + margin-bottom: 6px; } } @@ -342,44 +366,58 @@ width: 100%; display: flex; align-items: center; + + .la { + margin-bottom: 0; + width: 72px; + } } .max { width: 100%; } } - .main_content{ + + .main_content { display: flex; - .side{ + + .side { width: 370px; - .title{ + + .title { font-size: 14px; } - .flow_list{ - .item{ + + .flow_list { + .item { display: flex; - .icon{ + + .icon { width: 28px; display: flex; flex-direction: column; align-items: center; - .dian{ + + .dian { width: 12px; height: 12px; border-radius: 50%; background-color: #e89e42; } - .line{ + + .line { width: 1px; height: 100%; background-color: #e89e42; } } - .content{ + + .content { font-size: 12px; color: #999999; padding-bottom: 12px; - .name{ + + .name { font-size: 13px; color: #333333; } -- Gitblit v1.9.3