update 审批记录v2改为v3

src/components/Process/approvalRecord.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-dialog v-model="visible" draggable title="审批记录" :width="width" :height="height" append-to-body :close-on-click-modal="false">
+  <el-dialog v-model="visible" draggable title="审批记录" :width="props.width" :height="props.height" append-to-body :close-on-click-modal="false">
     <div v-loading="loading">
       <div style="width: 100%;height: 300px;overflow: auto;position: relative;">
         <div
@@ -46,7 +46,7 @@
             <el-table-column prop="nickName" label="办理人" sortable align="center"></el-table-column>
             <el-table-column label="状态" sortable align="center">
               <template #default="scope">
-                <el-tag type="success">{{scope.row.statusName}}</el-tag>
+                <el-tag type="success">{{ scope.row.statusName }}</el-tag>
               </template>
             </el-table-column>
             <el-table-column prop="comment" label="审批意见" sortable align="center"></el-table-column>
@@ -59,10 +59,10 @@
     </div>
   </el-dialog>
 </template>
-<script>
+<script lang="ts" setup>
 import { getHistoryProcessImage, getHistoryRecord } from '@/api/workflow/processInstance';
-export default {
+import { ref } from 'vue';
-  props: {
+const props = defineProps({
     width: {
         type: String,
         default: '70%'
@@ -71,60 +71,62 @@ export default {
         type: String,
         default: '100%'
     }
-  },
+});
-  data() {
+const loading = ref(false);
-    return {
+const src = ref('');
-      loading: false,
+const visible = ref(false);
-      src: '',
+const historyList = ref<Array<any>>([]);
-      visible: false,
+const deleteReason = ref<string>('');
-      historyList: [],
+const graphicInfoVos = ref<Array<any>>([]);
-      deleteReason: '',
+const nodeListInfo = ref<Array<any>>([]);
-      graphicInfoVos: [],
+const popupVisible = ref(false);
-      nodeListInfo: [],
+const nodeInfo = ref<any>({});
-      popupVisible: false,
+const graphicX = ref<number | string>(0);
-      nodeInfo: {},
+const graphicY = ref<number | string>(0);
-      graphicX: '',
+//初始化查询审批记录
-      graphicY: ''
+const init = async (processInstanceId: string) => {
-    };
+    visible.value = true;
-  },
+    loading.value = true;
-  methods: {
+    historyList.value = [];
-    init(processInstanceId) {
+    graphicInfoVos.value = [];
-      this.visible = true;
+    src.value = getHistoryProcessImage(processInstanceId);
-      this.loading = true;
-      this.historyList = [];
-      this.graphicInfoVos = [];
-      this.src = getHistoryProcessImage(processInstanceId);
     getHistoryRecord(processInstanceId).then((response) => {
-        this.historyList = response.data.historyRecordList;
+        historyList.value = response.data.historyRecordList;
-        this.graphicInfoVos = response.data.graphicInfoVos;
+        graphicInfoVos.value = response.data.graphicInfoVos;
-        this.nodeListInfo = response.data.nodeListInfo;
+        nodeListInfo.value = response.data.nodeListInfo;
-        this.deleteReason = response.data.deleteReason;
+        deleteReason.value = response.data.deleteReason;
-        this.loading = false;
+        loading.value = false;
     });
-    },
+}
-    handleMouseOver(graphic) {
+//悬浮事件
-      this.graphicX = graphic.x + graphic.width + 10;
+const handleMouseOver = async (graphic: any) => {
-      this.graphicY = graphic.y - graphic.height + -10;
+    graphicX.value = graphic.x + graphic.width + 10;
-      this.nodeInfo = {};
+    graphicY.value = graphic.y - graphic.height + -10;
-      if (this.nodeListInfo && this.nodeListInfo.length > 0) {
+    nodeInfo.value = {};
-        let info = this.nodeListInfo.find((e) => e.taskDefinitionKey == graphic.nodeId);
+    if (nodeListInfo.value && nodeListInfo.value.length > 0) {
+        let info = nodeListInfo.value.find((e: any) => e.taskDefinitionKey == graphic.nodeId);
         if (info) {
-          this.nodeInfo = {
+            nodeInfo.value = {
                 nickName: info.nickName,
                 status: info.status,
                 startTime: info.startTime,
                 endTime: info.endTime,
                 runDuration: info.runDuration
             };
-          this.popupVisible = true;
+            popupVisible.value = true;
         }
     }
-    },
+}
-    handleMouseLeave() {
+//关闭
-      this.popupVisible = false;
+const handleMouseLeave = async () => {
-    }
+    popupVisible.value = false;
-  }
+}
-};
+/**
+ * 对外暴露子组建方法
+ */
+ defineExpose({
+  init
+});
 </script>
 <style scoped>
 .triangle {

src/components/Process/submitVerify.vue

@@ -32,9 +32,9 @@ const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 //遮罩层
 const loading = ref(true);
 //流程状态
-const businessStatus = ref('');
+const businessStatus = ref<string>('');
 //任务id
-const taskId = ref('');
+const taskId = ref<string>('');
 
 const dialog = reactive<DialogOption>({
   visible: false,
@@ -93,4 +93,3 @@ defineExpose({
   openDialog
 });
 </script>
-  

src/views/workflow/category/index.vue

@@ -57,7 +57,7 @@
     </el-card>
     <!-- 添加或修改流程分类对话框 -->
     <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
-      <el-form ref="categoryFormRef" :model="form" :rules="rules" label-width="80px">
+      <el-form ref="categoryFormRef" :model="form" :rules="rules" label-width="80px" v-loading="loading">
         <el-form-item label="父级分类" prop="parentId">
           <el-tree-select
             v-model="form.parentId"
@@ -75,7 +75,7 @@
           <el-input v-model="form.categoryCode" placeholder="请输入分类编码" />
         </el-form-item>
         <el-form-item label="排序" prop="sortNum">
-          <el-input-number v-model="form.sortNum" placeholder="请输入排序" controls-position="right" :min="0"/>
+          <el-input-number v-model="form.sortNum" placeholder="请输入排序" controls-position="right" :min="0" />
         </el-form-item>
       </el-form>
       <template #footer>