Pārlūkot izejas kodu

Merge branch 'question-alert' into 'dev'

Question alert

See merge request skyeye/skyeye_frontend/skyeye-admin!30
航飞 楼 1 gadu atpakaļ
vecāks
revīzija
95355b7486

+ 1 - 1
src/api/datamanagement/alert-default.ts

@@ -38,7 +38,7 @@ export const deleteDefaultTableData = (ids: number[]) => {
 // 更新默认问题单列表状态(加急/隐藏)
 export interface UpdateList {
   id: Number[],       // 问题单id,可批量操作
-  hide?: Boolean,     // 是否隐藏
+  isHide?: Boolean,     // 是否隐藏
   priority?: Number,  // 0-未加急,1-加急
 };
 export const updateDefaultTableData = (body: UpdateList) => {

+ 11 - 3
src/views/datamanager/alertformdata/components/common/AlertTable.vue

@@ -13,9 +13,9 @@
           {{ getNameByType(row.source, row.issueType, [aiOptions, manualOptions]) }}
         </template>
       </el-table-column>
-      <el-table-column label="问题描述" prop="description" width="350">
+      <el-table-column label="问题描述" prop="description" width="500" show-overflow-tooltip>
         <template #default="{ row }">
-          <span>{{ row.description }}</span>
+          <span>{{ getSplicedDes(row.description) }}</span>
           <span class="detail-text" @click="handleDetailClick(row)"> 详情</span>
         </template>
       </el-table-column>
@@ -104,6 +104,14 @@ const handleDelete = (row) => {
   props.onDelete(row);
 };
 
+const getSplicedDes = (val) => {
+  if (val.length < 40) return val;
+  else {
+    const temp = val.substring(0, 40);
+    return temp + '…';
+  }
+};
+
 const colorOfState = ({ row, columnIndex }) => {
   if (columnIndex === 7) {
     if (row.issueState === 4) return { color: "#FF4D4F" };
@@ -136,7 +144,7 @@ onBeforeMount(() => {
 
 .detail-text {
   color: #1890FF;
-  font-weight: 600;
+  font-weight: 500;
   cursor: pointer;
 }
 

+ 46 - 1
src/views/datamanager/alertformdata/components/common/DetailDialog.vue

@@ -9,16 +9,26 @@
         <div class="title">问题图片/视频</div>
         <div class="media-box">
           <div class="img-box" v-for="(imagePath, index) in imagePaths" :key="index">
-            <img :src="imagePath" alt="" style="object-fit:contain;width:200px;height:200px;border: solid 1px #CCC">
+            <img :src="imagePath" alt="" style="object-fit:contain; width:200px; height:200px; border: solid 1px #CCC"
+              @mouseenter="handleOpenPre(imagePath, index)">
+            <div class="cover-box" v-if="isCoverVisible(index)" @mouseleave="handleClosePre(index)">
+              <el-icon :size="40" color="#e6e6e6" style="cursor: pointer;" @click="handlePreview">
+                <ZoomIn />
+              </el-icon>
+            </div>
           </div>
         </div>
       </div>
     </el-dialog>
+    <el-dialog v-model="dialogVisible">
+      <img w-full :src="dialogImageUrl" alt="" />
+    </el-dialog>
   </div>
 </template>
 
 <script setup lang="ts">
 import { ref, toRefs, watch } from 'vue';
+import { ZoomIn } from '@element-plus/icons-vue';
 
 const props = defineProps({
   showDrawer: Boolean,
@@ -48,6 +58,28 @@ watch(
   }
 );
 
+const showPreview = ref<boolean[]>(new Array(props.imagePaths?.values.length).fill(false));
+const dialogVisible = ref(false);
+const dialogImageUrl = ref('');
+
+const handleOpenPre = (val, index) => {
+  dialogImageUrl.value = val;
+  showPreview.value[index] = true;
+};
+
+const handleClosePre = (index) => {
+  showPreview.value[index] = false;
+};
+
+const isCoverVisible = (index) => {
+  return showPreview.value[index];
+};
+
+const handlePreview = () => {
+  dialogVisible.value = true;
+};
+
+
 </script>
 
 <style scoped>
@@ -107,9 +139,22 @@ watch(
   display: flex;
 
   .img-box {
+    position: relative;
     width: 200px;
     height: 200px;
     margin-right: 10px;
   }
+
+  .cover-box {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    position: absolute;
+    top: 0;
+    width: 200px;
+    height: 200px;
+    background-color: rgba(0, 0, 0, 0.5);
+  }
+
 }
 </style>

+ 3 - 3
src/views/datamanager/alertformdata/components/common/QuestionFormBase.vue

@@ -127,9 +127,9 @@ const handleCascaderChange = () => {
     formData.workshopId = workLocation.value[0];
     formData.workspaceId = workLocation.value[1];
     const tempString = getNameByWorkid(formData.workshopId, formData.workspaceId, locationOptions.value);
-    const strFlag = tempString.indexOf('-');
-    formData.workshopName = tempString.slice(0, strFlag);
-    formData.workspaceName = tempString.slice(strFlag + 1);
+    const strFlag = tempString?.indexOf('-');
+    formData.workshopName = tempString?.slice(0, strFlag);
+    formData.workspaceName = tempString?.slice(strFlag! + 1);
   } else {
     Reflect.deleteProperty(formData, "workshopId");
     Reflect.deleteProperty(formData, "workspaceId");

+ 3 - 2
src/views/datamanager/alertformdata/components/default/Default.vue

@@ -97,7 +97,7 @@ const handleHideAll = () => {
   if (showActionBar.value) isActiveHide.value = !isActiveHide.value;
   const updateList = {
     id: chooseId.value,
-    hide: true,
+    isHide: true,
   };
   updateDefaultTableData(updateList).then(() => {
     getTableData();
@@ -174,6 +174,7 @@ const handleCopyToShow = () => {
     setTimeout(function () {
       isActiveCopy.value = !isActiveCopy.value;
     }, 1000);
+    handleSelectNone();
   })
 };
 
@@ -204,7 +205,7 @@ const handleShow = (row) => {
   const tempHide = row.isHide === false ? true : false;
   const updateList = {
     id: [row.id],
-    hide: tempHide,
+    isHide: tempHide,
   };
   updateDefaultTableData(updateList).then(() => {
     getTableData();