From 2ca94de8ede18ac07ccfd8dec7b6f6a707adde9b Mon Sep 17 00:00:00 2001
From: 张含笑 <zhx18749296735@163.com>
Date: Mon, 01 Sep 2025 11:20:24 +0800
Subject: [PATCH] Merge branch 'refs/heads/feature/v5.0/5.0.5' into patch_management

---
 src/views/tickets/ticket.vue |  422 ++++++++++++++++++++++++++++++++++++++++-----------
 1 files changed, 327 insertions(+), 95 deletions(-)

diff --git a/src/views/tickets/ticket.vue b/src/views/tickets/ticket.vue
index c88e6e7..486563c 100644
--- a/src/views/tickets/ticket.vue
+++ b/src/views/tickets/ticket.vue
@@ -18,7 +18,7 @@
               @clear="handleKeyWords"
               @keyup.enter="handleSearch"
             />
-            <el-select
+            <!-- <el-select
               v-model="filters.department"
               placeholder="请选择所属单位"
               class="filter-item"
@@ -30,12 +30,13 @@
                 :label="item.label"
                 :value="item.value"
               />
-            </el-select>
-            <el-select
+            </el-select> -->
+            <!-- <el-select
               v-model="filters.type"
               placeholder="请选择工单类型"
               class="filter-item"
               clearable
+              @change="handleSearch"
             >
               <el-option
                 v-for="item in types"
@@ -43,7 +44,7 @@
                 :label="item.label"
                 :value="item.value"
               />
-            </el-select>
+            </el-select> -->
             <el-date-picker
               v-model="filters.dateRange"
               type="daterange"
@@ -59,6 +60,7 @@
               placeholder="请选择状态"
               class="filter-item"
               clearable
+              @change="handleSearch"
             >
               <el-option
                 v-for="item in statuses"
@@ -67,11 +69,12 @@
                 :value="item.value"
               />
             </el-select>
-            <el-select
+            <!-- <el-select
               v-model="filters.algorithm"
               placeholder="请选择关联算法"
               class="filter-item"
               clearable
+              @change="handleSearch"
             >
               <el-option
                 v-for="item in algorithms"
@@ -79,12 +82,48 @@
                 :label="item.dict_value"
                 :value="item.dict_key"
               />
-            </el-select>
+            </el-select> -->
+            <!-- <el-tree-select
+              popper-class="custom-tree-select"
+              :style="{ width: pxToRem(186) }"
+              placeholder="请选择关联算法"
+              v-model="dictKey"
+              :data="dataList"
+              :default-expanded-keys="[dictKey]"
+              check-strictly
+              node-key="id"
+              :props="treePropsSF"
+              @node-click="handleSFNodeClick"
+              clearable
+              @clear="handleClear"
+            /> -->
+            <el-tree-select
+              style="z-index: 1000"
+              :teleported="false"
+              class="custom-tree-select"
+              :style="{ width: pxToRem(186) }"
+              v-model="dictKey"
+              :data="dataList"
+              :default-expanded-keys="[dictKey]"
+              :props="treePropsSF"
+              :render-after-expand="false"
+              :default-checked-keys="checkedKeys"
+              node-key="id"
+              multiple
+              show-checkbox
+              collapse-tags
+              collapse-tags-tooltip
+              clearable
+              @check="handleCheck"
+              @node-click="handleSFNodeClick"
+              @clear="handleClear"
+            />
             <el-select
               v-model="filters.isReview"
               placeholder="请选择复核状态"
               class="filter-item"
               clearable
+              @change="handleSearch"
             >
               <el-option
                 v-for="item in reviewStatuses"
@@ -208,7 +247,8 @@
             </el-col>
             <el-col :span="12">
               <el-form-item label="工单类型" prop="type">
-                <el-select v-model="form.type" placeholder="请选择工单类型" class="full-width">
+
+                <el-select  @change="handleTypeChange" v-model="form.type" placeholder="请选择工单类型" class="full-width" >
                   <el-option
                     v-for="item in types"
                     :key="item.value"
@@ -265,9 +305,10 @@
                   multiple
                   placeholder="请选择关联算法"
                   class="full-width"
+                  :disabled="!form.type"
                 >
                   <el-option
-                    v-for="item in algorithms"
+                    v-for="item in algorithms2"
                     :key="item.value"
                     :label="item.label"
                     :value="item.value"
@@ -359,17 +400,20 @@
       </el-form>
       <template #footer>
         <div class="dialog-footer">
+
           <el-button type="danger" :loading="submitLoading" @click="submitForm">发布</el-button>
           <el-button type="infoprimary" plain :loading="draftLoading" @click="saveDraft"
             >存草稿</el-button
           >
-          <el-button @click="dialogVisible = false">取 消</el-button>
+
+
+          <el-button  @click="handleCancel">取 消</el-button>
         </div>
       </template>
     </el-dialog>
 
     <!-- 工单详情对话框 -->
-    <el-dialog v-model="detailVisible" title="工单详情" width="80%" append-to-body>
+    <el-dialog   class="custom-dialog" align-center v-model="detailVisible" title="工单详情" width="80%"  append-to-body>
       <div class="detail-container">
         <div class="detail-top-title">
           <div class="event-title-center event-orderNumber">
@@ -412,13 +456,14 @@
           </el-steps>
         </div>
 
-        <!-- 基本信息表格 -->
+      <div class="PopUpTableScrolls">
+          <!-- 基本信息表格 -->
         <el-table :show-header="false" :data="formattedDetailFields" border class="tableCss">
           <el-table-column prop="label1" label="基本信息" width="150">
             <template #default="{ row }">
               <!-- 添加必填星号的标签 -->
               <span
-                v-if="currentDetail.status === 0 && row.label1 === '工单名称'"
+                v-if="currentDetail.status === 0 &&(row.label1 === '关联算法' ||  row.label1 === '工单名称')"
                 class="required-label"
               >
                 <span class="required-star">*</span>{{ row.label1 }}
@@ -441,16 +486,37 @@
                   class="required-input"
                 />
               </template>
+               <template
+                v-else-if="
+                  currentDetail.status === 0 &&
+                  row.label1 === '关联算法' &&
+                  hasProcessingBtnPermission()
+                "
+              >
+                <el-select
+                  v-model="currentDetail.aiType"
+                  placeholder="请选择关联算法"
+                  class="required-input"
+                >
+                  <el-option
+                    v-for="item in algorithms2"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </template>
               <template v-else>{{ row.value1 }}</template>
             </template>
           </el-table-column>
           <el-table-column prop="label2" label="基本信息" width="150">
             <template #default="{ row }">
               <!-- 添加必填星号的标签 -->
+
               <span
                 v-if="
                   currentDetail.status === 0 &&
-                  (row.label2 === '工单类型' || row.label2 === '工单内容')
+                   row.label2 === '工单内容'
                 "
                 class="required-label"
               >
@@ -462,28 +528,10 @@
           <el-table-column>
             <template #default="{ row }">
               <!-- 修改工单类型和工单内容的显示 -->
+
+
               <template
                 v-if="
-                  currentDetail.status === 0 &&
-                  row.label2 === '工单类型' &&
-                  hasProcessingBtnPermission()
-                "
-              >
-                <el-select
-                  v-model="currentDetail.type"
-                  placeholder="请选择工单类型"
-                  class="required-input"
-                >
-                  <el-option
-                    v-for="item in types"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value"
-                  />
-                </el-select>
-              </template>
-              <template
-                v-else-if="
                   currentDetail.status === 0 &&
                   row.label2 === '工单内容' &&
                   hasProcessingBtnPermission()
@@ -566,16 +614,8 @@
         <!-- 图片和地图部分 -->
         <div class="media-section">
           <el-row :gutter="20">
-            <el-col :span="1">
-              <div
-                class="leftBtn"
-                :class="currentIndex === 0 ? 'disableds' : ''"
-                @click="leftClick"
-              >
-                <
-              </div>
-            </el-col>
-            <el-col :span="11">
+
+            <el-col :span="12">
               <div class="media-box">
                 <div class="media-title">事件图片</div>
                 <div class="media-content">
@@ -603,7 +643,7 @@
                 </div>
               </div>
             </el-col>
-            <el-col :span="11">
+            <el-col :span="12">
               <div class="media-box">
                 <!-- 根据状态显示不同的标题和内容 -->
 
@@ -633,28 +673,47 @@
                   </div>
                 </template>
                 <template v-else>
-                  <div class="media-title">地图标记事件点</div>
+                  <div class="media-title">地图标记事件点
+                    <el-popover   v-if="currentDetail.status === 3 || currentDetail.status === 0"
+								popper-class="custom-qrcode-popover"
+								:width="120"
+								:visible="currentDetail.showQR && detailVisible"
+								placement="top"
+								title=""
+								trigger="click"
+
+							>
+								<template #reference>
+									<img @click.stop="handleQRCode(currentDetail)"  class="QRCodeImg" src="@/assets/images/dataCenter/qrCode.svg" alt="" title="事件导航" />
+								</template>
+								<div class="qrcode-content">
+									<CreateQRcode v-if="currentDetail.showQR && detailVisible" :latAndLon="currentDetail.location"></CreateQRcode>
+								</div>
+							</el-popover>
+                  </div>
                   <div class="media-content">
                     <map-container v-if="detailVisible" ref="MapContainer"></map-container>
                   </div>
                 </template>
               </div>
             </el-col>
-            <el-col :span="1">
-              <div
-                :class="currentIndex === tableData.length - 1 ? 'disableds' : ''"
-                class="leftBtn"
-                @click="rightClick"
-              >
-                >
-              </div>
-            </el-col>
+
+
           </el-row>
         </div>
+      </div>
 
         <!-- 操作按钮 -->
-        <div class="dialog-footer">
-          <template v-if="currentDetail.status === 2">
+        <div class="dialog-footer1">
+            <div
+                class="leftBtn"
+                :class="currentIndex === 0 ? 'disableds' : ''"
+                @click="leftClick"
+              >
+               上一页
+              </div>
+       <div class="btngroups">
+           <template v-if="currentDetail.status === 2">
             <!-- 待审核 -->
             <el-button
               v-if="hasReviewBtnPermission()"
@@ -706,6 +765,14 @@
               @click="finalizeTicket">完结工单</el-button> -->
             <el-button @click="detailVisible = false">取消</el-button>
           </template>
+       </div>
+            <div
+                :class="currentIndex === tableData.length - 1 ? 'disableds' : ''"
+                class="leftBtn"
+                @click="rightClick"
+              >
+              下一页
+              </div>
         </div>
       </div>
     </el-dialog>
@@ -720,6 +787,7 @@
       <el-form :model="dispatchForm" :rules="dispatchRules" ref="dispatchForm" label-width="100px">
         <el-form-item label="选择部门" prop="department">
           <el-select
+
             v-model="dispatchForm.department"
             placeholder="请选择部门"
             @change="handleDispatchDepartmentChange"
@@ -734,6 +802,7 @@
         </el-form-item>
         <el-form-item label="选择处理人" prop="handler">
           <el-select
+          filterable
             v-model="dispatchForm.handler"
             placeholder="请选择处理人"
             :disabled="!dispatchForm.department"
@@ -865,18 +934,22 @@
   getReviewById,
   getCreateEventJob,
 } from '@/api/tickets/ticket'
+import { getSFDictionaryTree  } from '@/api/job/task';
 import { export_json_to_excel } from '@/utils/exportExcel'
 import geoJson from '@/assets/geoJson.json'
 import { mapGetters } from 'vuex'
 import { getAdcodeObj } from '@/utils/disposeData'
 import elTooltipCopy from '@/components/ElTooltipCopy.vue'
+import getBaseConfig from '@/buildConfig/config'
+import CreateQRcode from '@/components/CreateQRcode/CreateQRcode.vue'
+const { envName } = getBaseConfig()
 function regExp (label, name) {
   var reg = new RegExp(label + '=([^&]*)(&|$)', 'g')
   return name.match(reg)[0].split('=')[1]
 }
 
 export default {
-  components: { elTooltipCopy },
+  components: { elTooltipCopy,CreateQRcode },
   name: 'TicketPage',
   data() {
     return {
@@ -911,12 +984,14 @@
       },
       departments: [],
       types: [],
+      allAlgorithms: [],
       handlers: [
         { label: '处理人A', value: 'handlerA' },
         { label: '处理人B', value: 'handlerB' },
       ],
 
       algorithms: [],
+      algorithms2: [],
       statuses: [
         { label: '待审核', value: '2' },
         { label: '待处理', value: '0' },
@@ -951,9 +1026,9 @@
           // { label: "序号", prop: "id", width: 70 },
           { label: '工单编号', prop: 'orderNumber', width: 170 },
           { label: '工单名称', prop: 'orderName', width: 150, overHidden: true, tooltip: true },
-          { label: '所属单位', prop: 'department',width: 150, overHidden: true, tooltip: true },
+          { label: '所属单位', prop: 'department', overHidden: true, tooltip: true },
           { label: '发起时间', prop: 'startTime', width: 160 },
-          { label: '关联算法', prop: 'aiType', width: 150, overHidden: true, tooltip: true },
+          { label: '关联算法', prop: 'aiType', overHidden: true, tooltip: true },
           {
             label: '工单类型',
             prop: 'type',
@@ -974,7 +1049,7 @@
           { label: '处理人', prop: 'handler', width: 70 },
           {
             slot: true,
-            hide: false,
+            hide: envName === 'jiangwu'? true : false,
             label: '复核状态',
             prop: 'isReview',
             width: 90,
@@ -1072,6 +1147,14 @@
 
       // 复核弹窗
       reCheckDialog: false,
+      treePropsSF: {
+        label: 'dictValue',
+        value: 'id',
+        children: 'children',
+      },
+      dictKey: '',
+      dataList: [],
+      checkedKeys: [],
     };
   },
   created() {
@@ -1084,6 +1167,9 @@
   },
 
   mounted() {
+
+    this.getAlgorithmList()
+
     const href = this.$route.href;
     if (this.$route?.query?.status !== undefined && this.$route?.query?.status !== null) {
       this.filters.status = this.$route?.query?.status + '';
@@ -1127,12 +1213,12 @@
 
       if (orderNumber) {
         this.filters.keyword = orderNumber;
-
         this.$nextTick(() => {
           this.isShowInfo = true;
+          const find = this.$store.state.tags.bsTagList.find(i => i.path === '/tickets/ticket')
+          find && (find.query = {})
         });
 
-        console.log('orderNumber', orderNumber);
       }
     }
 
@@ -1254,7 +1340,13 @@
         { label: '任务发起人', value: this.currentDetail.creator },
         { label: '当前状态', value: this.mapStatus(this.currentDetail.status) },
         { label: '事件地址', value: this.currentDetail.address || this.currentDetail.latAndLon }, // 包含经纬度信息
-        { label: '关联算法', value: this.currentDetail.aiType },
+        { label: '关联算法',
+         value:
+            this.algorithms.find(t => t.value === this.currentDetail.aiType)?.label ||
+            this.currentDetail.aiType ||
+            '/',
+
+        },
         { label: '发起单位', value: this.currentDetail.department },
         { label: '发起任务时间', value: this.currentDetail.startTime },
         { label: '工单内容', value: this.currentDetail.content },
@@ -1272,7 +1364,9 @@
           value2: filteredFields[i + 1]?.value || (filteredFields[i + 1]?.label ? '暂无数据' : ''),
         });
       }
+
       return formattedFields;
+
     },
     dynamicFixedStatuses() {
       // 直接使用接口返回的 stepInfos
@@ -1344,6 +1438,49 @@
   },
 
   methods: {
+    handleCheck(data, { checkedKeys, checkedNodes }) {
+      this.checkedKeys = checkedKeys
+      // 获取所有选中节点的 dictKey
+      const selectedDictKeys = checkedNodes.map(node => node.dictKey).filter(Boolean)
+      this.filters.type = selectedDictKeys
+      this.fetchTableData();
+    },
+    // 算法
+    getAlgorithmList() {
+      getSFDictionaryTree({code:'SF'}).then((res) => {
+          if (res.data.code === 200) {
+              const result = res.data.data[0].children
+              // 过滤第一层数据
+              const filteredData = result.map(item => {
+                  // 过滤第二层数据
+                  const children = item.children?.map(child => ({
+                      ...child,
+                      children: [] // 清空第三层数据
+                  }))
+                  return {
+                      ...item,
+                      children: children || []
+                  }
+              })
+              this.dataList = filteredData
+          }
+      })
+    },
+
+    handleSFNodeClick(data) {
+      console.log(data.dictKey, '666666666')
+      this.filters.type = ''
+      this.filters.algorithm = ''
+      this.filters.type = data.dictKey
+      // 更新列表请求
+      this.fetchTableData();
+    },
+    handleClear() {
+        this.dictKey = ''
+        this.filters.algorithm = ''
+         this.filters.type = ''
+        this.fetchTableData();
+    },
     handleCellClick(row, column) {
       console.log(row, column.no);
       if (column.no === 2) {
@@ -1380,6 +1517,7 @@
       this.currentDetail.processingDetail = this.currentDetail.content;
       this.handleViewDetail(this.currentDetail);
 
+
       // 如果使用地图组件,需要更新地图标记
       this.$nextTick(() => {
         if (this.$refs.MapContainer && this.currentDetail.location) {
@@ -1387,13 +1525,16 @@
         }
       });
     },
+    async handleQRCode (val){
+    val.showQR = !val.showQR
+    },
     async loadAMapScripts() {
       try {
         const areaCode = this.userInfo.detail.areaCode;
         const subAreaCode = areaCode ? areaCode.substring(0, 6) : '';
         const adcodeObj = getAdcodeObj(geoJson, 'adcode', subAreaCode);
 
-        console.log('区域代码:', subAreaCode);
+       // console.log('区域代码:', subAreaCode);
 
         // 直接从返回对象中获取正确的路径
         const center = adcodeObj?.payload?.objects?.collection?.geometries?.[0]?.properties?.center;
@@ -1479,7 +1620,8 @@
     async fetchDropdownData() {
       try {
         const response = await getTicketInfo();
-        const { dept_data, event_type, ai_type } = response.data.data;
+
+        const { dept_data, event_type, ai_type,info } = response.data.data;
 
         this.departments = dept_data.map(item => ({
           label: item.dept_name,
@@ -1498,7 +1640,10 @@
 
         const columnType = this.findObject(this.option.column, 'type');
         columnType.dicData = this.types;
+        this.allAlgorithms  = info
 
+        console.log('工单类型',this.types);
+        console.log('关联算法',this.allAlgorithms );
         // 确保算法数据的映射一致
         this.algorithms =
           ai_type?.map(item => ({
@@ -1508,6 +1653,8 @@
             label: item.dict_value,
             value: item.dict_key,
           })) || [];
+
+        this.algorithms2 = _.cloneDeep(this.algorithms)
 
         // 构建用户ID和名称的映射关系
         this.userNameToIdMap = {};
@@ -1520,6 +1667,33 @@
         this.$message.error('加载下拉框数据失败');
       }
     },
+    // 工单类型变化时触发
+    handleTypeChange(typeValue) {
+      this.form.algorithm = []
+      if (!typeValue) {
+        // 未选择类型时清空算法列表
+        this.algorithms2 = [];
+        return;
+      }
+
+      const matchedCategory = this.allAlgorithms.find(
+        category => category.dict_key === typeValue
+      );
+
+      if (!matchedCategory || !matchedCategory.algorithms || matchedCategory.algorithms.length === 0) {
+        // 无匹配的算法时清空
+        this.algorithms2 = [];
+        this.$message.info('该工单类型暂无关联算法');
+        return;
+      }
+      this.algorithms2 = matchedCategory.algorithms.map(algo => ({
+        label: algo.dict_value,
+        value: algo.dict_key,
+        dict_key: algo.dict_key,
+        dict_value: algo.dict_value
+      }));
+
+    },
 
     async fetchTableData() {
       if (this.isFetching) return;
@@ -1528,7 +1702,7 @@
       try {
         const currentTab = this.tabs.find(tab => tab.name === this.activeTab);
         const params = {
-          word_order_type: this.filters.type || undefined,
+          word_order_types: this.filters.type || undefined,
           status:
             currentTab?.name === 'myTickets'
               ? undefined
@@ -1773,7 +1947,10 @@
         this.draftLoading = false;
       }
     },
-
+    handleCancel (){
+      this.resetForm();
+       this.dialogVisible = false;
+},
     handleLocationChange(val) {
       let locationValue = val.value;
       if (locationValue && locationValue.length >= 2) {
@@ -1862,6 +2039,7 @@
     },
 
     handleReset() {
+      this.dictKey = '';
       this.filters = {
         keyword: '',
         department: '',
@@ -1874,8 +2052,6 @@
       this.page.currentPage = 1;
       this.$router.replace({});  //清除url参数
       this.fetchTableData();
-      console.log('handleSearch', this.$router);
-
     },
     handleKeyWords(){
       this.$router.replace({});  //清除url参数
@@ -1994,11 +2170,15 @@
       this.currentDetail = {
         ...detailData,
         // address: null,
+        showQR: false,
         latAndLon: _.round(detailData.location[0], 6) + ',' + _.round(detailData.location[1], 6),
       };
 
       console.log('this.currentDetail', this.currentDetail);
       this.detailVisible = true;
+      this.handleTypeChange(this.currentDetail.type)
+      console.log('this.currentDetail.location',this.currentDetail.location);
+
       this.$nextTick(() => {
         if (this.$refs.MapContainer && this.$refs.MapContainer.initAddEntity) {
           this.$refs.MapContainer.initAddEntity('point', this.currentDetail.location);
@@ -2290,8 +2470,8 @@
         this.$message.warning('请填写工单名称');
         return;
       }
-      if (!this.currentDetail.type) {
-        this.$message.warning('请选择工单类型');
+      if (!this.currentDetail.aiType) {
+        this.$message.warning('请选择关联算法');
         return;
       }
       if (!this.currentDetail.content || !this.currentDetail.content.trim()) {
@@ -2301,10 +2481,13 @@
 
       // 通过验证后,打开派发对话框
       this.dispatchDialogVisible = true;
+
+      console.log('受理',this.currentDetail);
+
     },
     hasProcessingBtnPermission() {
       // undefined 或 false 都返回 false,只有 true 返回 true
-      // console.log('权限检查:', this.permission)
+      //  console.log('权限检查:', this.permission.tickets_processing_btn)
       return this.permission && this.permission.tickets_processing_btn === true;
     },
     hasProcessedAndOverBtnPermission() {
@@ -2340,6 +2523,8 @@
         return;
       }
       this.dispatchLoading = true;
+      console.log('派发成功',this.currentDetail);
+
       this.$refs.dispatchForm.validate(async valid => {
         if (valid) {
           try {
@@ -2353,7 +2538,9 @@
               content: this.currentDetail.content, // 使用 content 替代原来的 remark
               createDept: this.dispatchForm.department, // 派发部门 ID
               updateUser: this.dispatchForm.handler, // 处理人 ID
+              aiType:this.currentDetail.aiType
             };
+           console.log('派发',data);
 
             const file = this.currentDetail.file || null; // 如果没有文件,则为 null
 
@@ -2434,8 +2621,7 @@
 
       // 获取工单类型值 - 从types中找到匹配的值
       const typeValue =
-        this.types.find(t => t.label === row.type)?.value || row.work_order_type_dict_key;
-
+        this.types.find(t => t.value === row.type)?.value || row.work_order_type_dict_key;
       // 获取处理人ID - 使用userNameToIdMap映射
       const handlerId = this.userNameToIdMap[row.handler] || row.handler;
 
@@ -2893,11 +3079,18 @@
   },
   activated() {
     this.handleReset();
-  }
+  },
+
 };
 </script>
-
+<style lang="scss">
+.custom-dialog {  max-height: 96vh; }
+.custom-qrcode-popover {
+min-width: 120px !important;
+}
+</style>
 <style lang="scss" scoped>
+
 ::v-deep(.el-tabs) {
   height: 100%;
   display: flex;
@@ -2934,11 +3127,11 @@
   gap: 8px; // 使用 gap 统一设置间距
 
   .filter-item {
-    width: 160px; // 减小宽度
+    width: 280px; // 减小宽度
   }
 
   .date-picker {
-    width: 240px; // 日期选择器宽度适当调整
+    // width: 240px; // 日期选择器宽度适当调整
   }
 
   .el-button {
@@ -2952,7 +3145,7 @@
 
 .tableCss {
   width: 100%;
-  margin-bottom: 20px;
+  margin-bottom: 10px;
 }
 
 .step-timer {
@@ -3118,7 +3311,33 @@
     }
   }
 }
+.dialog-footer1 {
+  position: sticky;
+    bottom: 28px;
+    left: 0;
+    right: 0;
+    background: white;
+    z-index: 10;
+    padding: 16px 20px;
+    border-top: 1px solid #ebeef5;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  .el-button + .el-button {
+    margin-left: 12px;
+  }
+.btngroups {
+margin-left: 12px;
+}
+  .el-button {
+    padding: 9px 20px;
 
+    &:last-child {
+      margin-left: 12px;
+      margin-right: 12px;
+    }
+  }
+}
 .map-container {
   width: 100%;
   height: 400px;
@@ -3193,7 +3412,7 @@
 }
 
 .detail-container {
-  padding: 20px;
+  padding:0 20px;
 
   .detail-top-title {
     display: flex;
@@ -3271,7 +3490,7 @@
 }
 
 .media-section {
-  margin-bottom: 20px;
+  // margin-bottom: 20px;
 
   .el-row {
     display: flex;
@@ -3280,15 +3499,16 @@
 }
 
 .leftBtn {
-  width: 36px;
-  height: 36px;
+  width: 70px;
+  height: 32px;
   background-color: #999;
-  border-radius: 50%;
+  border-radius: 5px;
   text-align: center;
-  line-height: 36px;
+line-height: 32px;
   color: #fff;
   cursor: pointer;
   opacity: 0.8;
+
 }
 
 .disableds {
@@ -3297,7 +3517,11 @@
   pointer-events: none;
   opacity: 0.3 !important;
 }
-
+.PopUpTableScrolls{
+height: 600px;
+overflow-y: scroll;
+overflow-x: hidden;
+}
 .media-box {
   width: 100%;
   border: 1px solid #dcdfe6;
@@ -3308,7 +3532,15 @@
 
   .media-title {
     font-weight: bold;
-    margin-bottom: 10px;
+    margin-bottom: 5px;
+    display: flex;
+    align-items: center;
+    .QRCodeImg{
+    width: 18px;
+    height: 18px;
+    cursor: pointer;
+    padding-bottom: 1px;
+    }
   }
 
   .media-content {
@@ -3323,7 +3555,7 @@
       .el-image__inner {
         width: 100%;
         height: 100%;
-        object-fit: contain;
+        object-fit: cover !important;
       }
     }
   }
@@ -3376,12 +3608,12 @@
   background-color: #f5f7fa;
   padding: 12px;
   border-radius: 4px;
-  min-height: 40px;
+  min-height: 30px;
   color: #606266;
   line-height: 1.5;
   display: block;
   text-align: left;
-
+margin-bottom: 5px;
   &:first-child {
     font-weight: bold;
     margin-bottom: 4px;
@@ -3399,23 +3631,23 @@
 
 .custom-steps-container {
   width: 100%;
-  margin: 20px 0;
+  margin: 10px 0;
 }
 
 .steps-titles {
   display: flex;
   justify-content: space-between;
-  margin-bottom: 16px;
+  margin-bottom: 14px;
   position: relative;
 }
 
 .step-title {
   text-align: center;
   flex: 1;
-  font-size: 16px;
+  font-size: 14px;
   color: #999;
   position: relative;
-  padding-bottom: 10px;
+  padding-bottom: 5px;
 }
 
 .step-title.active {
@@ -3427,7 +3659,7 @@
   text-align: center;
   font-size: 20px;
   font-weight: bold;
-  margin-bottom: 12px;
+  margin-bottom: 5px;
   color: #333;
 }
 

--
Gitblit v1.9.3