@lambo-design-mobile/workflow-approve 1.0.0-beta.1

package/src/WorkflowDiagram.vue

@@ -0,0 +1,412 @@
+<template>
+  <div>
+    <div style="padding: 0 10px">
+
+      <!--流程追踪图-->
+      <div class="title-info">
+        <van-icon class="info-icon" style="background-color: #0d88ff" name="cluster-o"/>
+        流程追踪图
+      </div>
+      <div class="containers">
+        <div ref="canvas" class="canvas"></div>
+      </div>
+
+      <!--审批流程追踪-->
+      <div class="title-info">
+        <van-icon class="info-icon" style="background-color: #ff7f02" name="orders-o"/>
+        审批流程跟踪
+      </div>
+      <div v-if="auditData.length > 0">
+        <div v-for="(item,index) in auditData" :key="index" class="record-item">
+          <van-cell center>
+            <template v-slot:icon>
+              <div
+                  v-if="['通过', '跳转指定节点'].includes(getAuditStatus(item.auditResult).text)"
+                  class="completed-icon">
+                <van-icon class="iconfont" class-prefix='icon' :name=getAuditStatus(item.auditResult).icon
+                          size="30px" color="#fff"/>
+              </div>
+              <div v-else class="pending-icon">
+                <van-icon class="iconfont" class-prefix='icon' :name=getAuditStatus(item.auditResult).icon
+                          size="30px" color="#fff"/>
+              </div>
+            </template>
+            <template v-slot:title>
+              <div :style="{ color: getAuditStatus(item.auditResult).color }"
+                   style="font-size: 16px;font-weight: bold;padding:5px 0;">
+                {{ item.auditName }}
+              </div>
+              <div>{{ item.taskName }}
+                <span v-if="item.auditComment" @click="showAuditDetail(item.auditComment)">
+               | 审批意见 <van-icon name="comment-circle-o"/>
+              </span>
+              </div>
+            </template>
+            <template v-slot:label>
+              <div>{{ item.auditDate }}</div>
+            </template>
+            <template v-slot:default>
+                        <span :style="{ color: getAuditStatus(item.auditResult).color }">{{
+                            getAuditStatus(item.auditResult).text
+                          }}</span>
+            </template>
+          </van-cell>
+        </div>
+      </div>
+      <div v-else>
+        <van-empty description="暂无审批记录"/>
+      </div>
+
+      <!--审批详情弹出框-->
+      <van-dialog v-model="showTaskNodeDetail" title="审批详情">
+        <van-cell-group>
+          <van-cell class="custom-cell" :border="false" title="审批节点："
+                    :value="nodeDetail.taskName"></van-cell>
+          <van-cell class="custom-cell" :border="false" title="审批人："
+                    :value="nodeDetail.auditName"></van-cell>
+          <van-cell class="custom-cell" :border="false" title="申请人："
+                    :value="nodeDetail.applyUser ? nodeDetail.applyUser.split(':')[1] : '未定义'"></van-cell>
+          <van-cell class="custom-cell"
+                    :title="nodeDetail.startDate ? '发起时间：':'审批时间：' "
+                    :value="nodeDetail.startDate ? nodeDetail.startDate : nodeDetail.auditDate">
+          </van-cell>
+          <van-cell title="审批结果：" class="custom-cell" :border="false">
+            <template v-slot:default>
+              <van-tag :type="getAuditStatus(nodeDetail.auditResult).type">
+                {{ getAuditStatus(nodeDetail.auditResult).text }}
+              </van-tag>
+            </template>
+          </van-cell>
+          <van-cell v-if="nodeDetail.auditComment" class="custom-cell"
+                    :border="false" title="审批意见："
+                    :value="nodeDetail.auditComment"></van-cell>
+        </van-cell-group>
+      </van-dialog>
+    </div>
+  </div>
+</template>
+<script>
+import Viewer from "bpmn-js/lib/Viewer";
+import {getHisAudit, getPrintData, printData} from "../api";
+import {Dialog} from "vant";
+
+export default {
+  props: {
+    procId: {
+      type: String,
+      required: true,
+    },
+    instanceId: {
+      type: String,
+      required: false,
+    },
+    taskNode: {
+      type: String,
+      required: false,
+    },
+    applyId: {
+      type: String,
+      required: true,
+    },
+  },
+  mounted() {
+    this.getPrintData()
+    this.getHisAudit()
+    this.onTrack()
+  },
+  data() {
+    return {
+      showTaskNodeDetail: false,
+      nodeDetail: {},
+      auditData: [],
+    }
+  },
+  methods: {
+    getPrintData() {
+      getPrintData(this.applyId, this.procId).then(resp => {
+        if (resp.data.code === '200') {
+          this.tableData = resp.data.data
+        }
+      })
+    },
+    getHisAudit() {
+      getHisAudit(this.applyId, this.procId).then(resp => {
+        if (resp.data.code === '200') {
+          this.auditData = resp.data.data
+        }
+      })
+    },
+    onTrack() {
+      // 初始化 Viewer
+      this.bpmnViewer = new Viewer({
+        container: this.$refs.canvas
+      });
+
+      // 获取并加载流程数据
+      printData(this.applyId, this.instanceId, this.procId).then(async resp => {
+        let result = resp.data
+        if (result.code === '200') {
+          const bpmnXmlStr = result.data.processXml;
+          await this.bpmnViewer.importXML(bpmnXmlStr);
+
+          const canvas = this.bpmnViewer.get('canvas');
+          canvas.zoom('fit-viewport', 'auto');
+          canvas.zoom(0.6); // 放大视图
+
+          //给流程节点添加固定样式
+          this.doPrint(result.data.historicData);
+
+          // 添加手势缩放和移动功能
+          this.addTouchGesture();
+          // 监听元素点击事件
+          this.addElementClickListener();
+
+        }
+      }).catch(err => {
+        console.error("Error fetching BPMN data:", err);
+      });
+
+    },
+    doPrint(printData) {
+      const {doneLightSet, donePointSet, doneTaskSet, todoPointSet} =
+          printData;
+      const canvas = this.bpmnViewer.get("canvas");
+      const elementRegistry = this.bpmnViewer.get('elementRegistry');
+      elementRegistry.filter((item) => item.type === 'bpmn:UserTask');
+      for (let k in doneLightSet) {
+        if (doneLightSet[k]) {
+          canvas.addMarker(doneLightSet[k], "done-line");
+        }
+      }
+      for (let k in donePointSet) {
+        if (donePointSet[k]) {
+          canvas.addMarker(donePointSet[k], "done-point");
+        }
+      }
+      for (let k in doneTaskSet) {
+        if (doneTaskSet[k]) {
+          canvas.addMarker(doneTaskSet[k], "done-task");
+        }
+      }
+      for (let k in todoPointSet) {
+        if (todoPointSet[k]) {
+          canvas.addMarker(todoPointSet[k], "todo-point");
+        }
+      }
+    },
+    addTouchGesture() {
+      const canvas = this.bpmnViewer.get('canvas');
+      const container = this.$refs.canvas;
+      let initialDistance = null;
+      let initialPanPosition = null;
+      let isPanning = false;
+
+      const calculateDistance = (touch1, touch2) => {
+        const dx = touch2.clientX - touch1.clientX;
+        const dy = touch2.clientY - touch1.clientY;
+        return Math.sqrt(dx * dx + dy * dy);
+      };
+
+      container.addEventListener('touchstart', (event) => {
+        if (event.touches.length === 2) {
+          initialDistance = calculateDistance(event.touches[0], event.touches[1]);
+        } else if (event.touches.length === 1) {
+          initialPanPosition = {
+            x: event.touches[0].clientX,
+            y: event.touches[0].clientY
+          };
+          isPanning = true;
+        }
+      });
+
+      container.addEventListener('touchmove', (event) => {
+        if (event.touches.length === 2 && initialDistance !== null) {
+          const currentDistance = calculateDistance(event.touches[0], event.touches[1]);
+          const zoomFactor = currentDistance / initialDistance;
+
+          if (zoomFactor !== 1) {
+            canvas.zoom(canvas.zoom() * zoomFactor);
+            initialDistance = currentDistance; // 更新初始距离
+          }
+
+          event.preventDefault(); // 阻止默认的触摸事件
+        } else if (event.touches.length === 1 && isPanning) {
+          const currentPanPosition = {
+            x: event.touches[0].clientX,
+            y: event.touches[0].clientY
+          };
+          const deltaX = currentPanPosition.x - initialPanPosition.x;
+          const deltaY = currentPanPosition.y - initialPanPosition.y;
+
+          // 平移画布
+          canvas.scroll({
+            dx: deltaX,
+            dy: deltaY
+          });
+
+          // 更新初始位置
+          initialPanPosition = currentPanPosition;
+
+          event.preventDefault(); // 阻止默认的触摸事件
+        }
+      });
+
+      container.addEventListener('touchend', () => {
+        initialDistance = null; // 重置初始距离
+        isPanning = false; // 停止平移
+      });
+    },
+    addElementClickListener() {
+      const eventBus = this.bpmnViewer.get('eventBus');
+      eventBus.on('element.click', (event) => {
+        const elementId = event.element.id;
+        // 假设 this.tableData 包含了所有节点的详细信息
+        for (const item of this.tableData) {
+          if (item.taskNode === elementId) {
+            console.log(item);
+            this.showTaskNodeDetail = true;
+            this.nodeDetail = item;
+            break;
+          }
+        }
+      });
+
+    },
+    getAuditStatus(auditResult) {
+      const statusMap = {
+        '30': {text: '通过', icon: "tongguo", color: '#0d88ff', type: 'success'},
+        '40': {text: '驳回上一节点', icon: "bohui", color: '#ed4014', type: 'danger'},
+        '50': {text: '驳回到原点', icon: "bohui", color: '#ed4014', type: 'danger'},
+        '51': {text: '流程作废', icon: "liuchengzuofei", color: '#ed4014', type: 'danger'},
+        '60': {text: '撤回', icon: "chehui", color: '#ed4014', type: 'warning'},
+        '80': {text: '跳转指定节点', icon: "tiaozhuan", color: '#0d88ff', type: 'primary'},
+        '90': {text: '驳回指定节点', icon: "bohui", color: '#ed4014', type: 'primary'},
+      };
+      return {
+        text: (statusMap[auditResult] && statusMap[auditResult].text) || '待审批',
+        icon: (statusMap[auditResult] && statusMap[auditResult].icon) || 'daishenpi',
+        color: (statusMap[auditResult] && statusMap[auditResult].color) || '#ff9900',
+        type: (statusMap[auditResult] && statusMap[auditResult].type) || 'warning',
+      };
+    },
+    showAuditDetail(auditComment) {
+      Dialog.alert({
+        title: '审批意见',
+        message: auditComment,
+      }).then(() => {
+        // on close
+      });
+    }
+  }
+}
+</script>
+<style scoped>
+@import 'styles/global.css';
+
+.canvas {
+  width: 100%;
+  height: 250px;
+}
+
+.containers {
+  /*position: absolute;*/
+  background-color: #ffffff;
+  width: 100%;
+
+  ::v-deep .done-line .djs-visual > :nth-child(1) {
+    stroke: rgb(218, 246, 209) !important;
+  }
+
+  ::v-deep .done-point .djs-visual > :nth-child(1) {
+    fill: rgb(218, 246, 209) !important;
+  }
+
+  ::v-deep .done-task .djs-visual > :nth-child(1) {
+    fill: rgb(218, 246, 209) !important;
+  }
+
+  ::v-deep .todo-point .djs-visual > :nth-child(1) {
+    fill: rgb(258, 227, 180) !important;
+  }
+
+  /* custom.css */
+
+  ::v-deep .bjs-powered-by {
+    display: none !important;
+  }
+
+
+}
+
+.record-item {
+  position: relative;
+  margin-bottom: 20px;
+}
+
+.record-item:not(:last-child)::before {
+  content: '';
+  position: absolute;
+  left: 40px; /* 线条在图标的左侧 */
+  top: 100px;
+  bottom: -20px;
+  width: 2px; /* 线条宽度 */
+  background-color: #0d88ff; /* 线条颜色 */
+}
+
+.completed-icon {
+  width: 45px; /* 自定义宽度 */
+  height: 45px; /* 自定义高度 */
+  background-clip: padding-box; /* 使背景不填充边框 */
+
+  border-radius: 50%;
+  margin-right: 15px;
+
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  background: linear-gradient(90deg, #0096FF, #1677FF);
+  border: 5px solid rgb(229, 244, 255); /* 半透明边框，颜色和背景色相同 */
+}
+
+.pending-icon {
+  width: 45px; /* 自定义宽度 */
+  height: 45px; /* 自定义高度 */
+  background-clip: padding-box; /* 使背景不填充边框 */
+
+  border-radius: 50%;
+  margin-right: 15px;
+
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  background: linear-gradient(90deg, #FF7E00, #FFA200);
+  border: 5px solid rgb(255, 245, 229); /* 半透明边框，颜色和背景色相同 */
+}
+
+
+.title-info {
+  font-weight: bold;
+  font-size: 14px;
+  padding: 20px 10px;
+}
+
+.info-icon {
+  display: inline-block;
+  color: white; /* 自定义文字颜色 */
+  padding: 3px 3px; /* 标签内边距 */
+  border-radius: 4px; /* 标签圆角 */
+  font-size: 13px; /* 字体大小 */
+  margin-right: 5px;
+}
+
+.van-cell__title {
+  flex: 1 0 auto;
+}
+
+.van-cell__value {
+  flex: 0 1 auto;
+}
+
+</style>

package/src/assets/icon/iconfont.css

@@ -0,0 +1,51 @@
+@font-face {
+  font-family: "iconfont"; /* Project id 4700118 */
+  src: url('iconfont.woff2?t=1727660658475') format('woff2'),
+       url('iconfont.woff?t=1727660658475') format('woff'),
+       url('iconfont.ttf?t=1727660658475') format('truetype');
+}
+
+.icon{
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-daiban:before {
+  content: "\e629";
+}
+
+.icon-cloud-download:before {
+  content: "\e829";
+}
+
+.icon-tiaozhuan:before {
+  content: "\e639";
+}
+
+.icon-bohui:before {
+  content: "\e633";
+}
+
+.icon-daishenpi:before {
+  content: "\e631";
+}
+
+.icon-chehui:before {
+  content: "\e76d";
+}
+
+.icon-tongguo:before {
+  content: "\e60f";
+}
+
+.icon-liuchengzuofei:before {
+  content: "\e72f";
+}
+
+.icon-tqm-search:before {
+  content: "\e602";
+}
+

package/src/assets/icon/iconfont.js

@@ -0,0 +1 @@
+window._iconfont_svg_string_4700118='<svg><symbol id="icon-daiban" viewBox="0 0 1024 1024"><path d="M120.759083 892.5321V127.647783c0-4.252196 3.447422-7.713952 7.699618-7.713952h643.527285c4.252196 0 7.713952 3.461756 7.713952 7.713952V436.239653h55.82018V127.647783c0-35.024045-28.495752-63.534132-63.534132-63.534132H128.458701c-35.024045 0-63.519798 28.510087-63.519798 63.534132v764.884317c0 35.024045 28.495752 63.534132 63.519798 63.534133h360.269409v-55.820181H128.458701c-4.252196 0-7.699618-3.461756-7.699618-7.713952z" fill="#3E3A39" ></path><path d="M287.660582 552.786472c-15.41357 0-27.91009 12.48321-27.91009 27.91009s12.49652 27.91009 27.91009 27.91009h111.449918c15.41357 0 27.91009-12.48321 27.91009-27.91009s-12.49652-27.91009-27.91009-27.91009h-111.449918zM636.53722 429.699074c0-15.42688-12.49652-27.91009-27.91009-27.91009H287.660582c-15.41357 0-27.91009 12.48321-27.91009 27.91009s12.49652 27.91009 27.91009 27.91009h320.966548c15.41357 0 27.91009-12.48321 27.91009-27.91009zM608.62713 256.295903H287.660582c-15.41357 0-27.91009 12.48321-27.91009 27.91009s12.49652 27.91009 27.91009 27.91009h320.966548c15.41357 0 27.91009-12.48321 27.91009-27.91009s-12.49652-27.91009-27.91009-27.91009zM820.392212 718.748044h-55.643048v-90.271873c0-15.42688-12.49652-27.91009-27.91009-27.91009s-27.91009 12.48321-27.91009 27.91009v118.181963c0 15.42688 12.49652 27.91009 27.91009 27.91009H820.393236c15.41357 0 27.91009-12.48321 27.91009-27.91009-0.001024-15.42688-12.497544-27.91009-27.911114-27.91009z" fill="#3E3A39" ></path><path d="M738.670805 515.125922c-121.258739 0-219.559921 98.300158-219.559921 219.559921 0 121.259763 98.300158 219.560945 219.559921 219.560945 121.259763 0 219.560945-98.300158 219.560945-219.560945 0-121.259763-98.301182-219.559921-219.560945-219.559921z m0 383.299662c-90.286208 0-163.739741-73.453533-163.739741-163.740765 0-90.286208 73.453533-163.739741 163.739741-163.739741 90.286208 0 163.739741 73.453533 163.739741 163.739741 0.001024 90.287232-73.452509 163.740765-163.739741 163.740765z" fill="#3E3A39" ></path></symbol><symbol id="icon-cloud-download" viewBox="0 0 1024 1024"><path d="M624 706.3h-74.1V464c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v242.3H400c-6.7 0-10.4 7.7-6.3 12.9l112 141.7c3.2 4.1 9.4 4.1 12.6 0l112-141.7c4.1-5.2 0.4-12.9-6.3-12.9z"  ></path><path d="M811.4 366.7C765.6 245.9 648.9 160 512.2 160S258.8 245.8 213 366.6C127.3 389.1 64 467.2 64 560c0 110.5 89.5 200 199.9 200H304c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8h-40.1c-33.7 0-65.4-13.4-89-37.7-23.5-24.2-36-56.8-34.9-90.6 0.9-26.4 9.9-51.2 26.2-72.1 16.7-21.3 40.1-36.8 66.1-43.7l37.9-9.9 13.9-36.6c8.6-22.8 20.6-44.1 35.7-63.4 14.9-19.2 32.6-35.9 52.4-49.9 41.1-28.9 89.5-44.2 140-44.2s98.9 15.3 140 44.2c19.9 14 37.5 30.8 52.4 49.9 15.1 19.3 27.1 40.7 35.7 63.4l13.8 36.5 37.8 10C846.1 454.5 884 503.8 884 560c0 33.1-12.9 64.3-36.3 87.7-23.4 23.4-54.5 36.3-87.6 36.3H720c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h40.1C870.5 760 960 670.5 960 560c0-92.7-63.1-170.7-148.6-193.3z"  ></path></symbol><symbol id="icon-tiaozhuan" viewBox="0 0 1024 1024"><path d="M435.712 334.848H200.704c-22.528 0-40.448 14.848-40.448 33.28s18.432 33.28 40.448 33.28h235.008c22.528 0 40.448-14.848 40.448-33.28s-17.92-33.28-40.448-33.28z m-126.464 122.88H200.704c-22.528 0-40.448 14.848-40.448 33.28s18.432 33.28 40.448 33.28h108.544c22.528 0 40.448-14.848 40.448-33.28s-18.432-33.28-40.448-33.28z m251.904-9.728c2.048 0.512 4.096 0.512 6.656 0.512h201.728c15.36 0 28.16-10.24 28.16-23.04s-12.288-23.04-28.16-23.04h-201.728c-3.072 0-6.144 0.512-8.704 1.024l-1.024-16.896v-1.536c-0.512-6.656-6.656-11.264-14.848-11.264-4.608 0-8.192 2.048-10.752 4.608 0 0-0.512 0-0.512 0.512l-46.592 39.424c-5.12 4.608-4.608 11.776 0.512 15.872l50.176 36.352c0.512 0.512 1.536 1.024 2.048 1.536 2.56 1.536 5.632 2.56 9.216 2.56 7.68 0 13.824-5.632 13.824-12.288v-14.336z" fill="" ></path><path d="M894.464 257.536h-114.176V193.536c0-42.496-27.648-77.312-86.528-77.312H129.536c-58.88 0-86.528 34.304-86.528 77.312v470.016c0 42.496 27.648 77.312 86.528 77.312h114.176V819.2c0 42.496 27.648 77.312 86.528 77.312h564.224c58.88 0 86.528-34.304 86.528-77.312V334.336c0.512-42.496-27.136-76.8-86.528-76.8z m20.48 177.152h-1.024V563.2h1.024v231.424c0 3.584-0.512 6.656-1.536 10.24-2.048 13.824-13.824 24.064-28.16 24.064H335.872c-15.872 0-28.672-12.288-28.672-28.16v-56.832-3.584h386.56c58.88 0 86.528-34.304 86.528-77.312v-61.952c-2.56-14.848-15.36-26.112-31.744-26.112-15.36 0-28.16 10.752-31.232 25.088l-0.512 1.536c-0.512 1.536-0.512 3.072-0.512 5.12v38.4c0 15.36-12.8 28.16-28.672 28.16H138.752c-14.336 0-26.624-10.24-28.16-24.064-1.024-3.072-1.536-6.656-1.536-10.24V407.552h1.024V279.04h-1.024V218.112c0-4.096 0.512-8.192 2.048-11.776 2.56-10.752 11.776-18.432 22.528-20.48 3.072-1.024 6.144-1.536 9.728-1.536h536.576-6.656 15.36c15.872 0 28.672 13.312 28.672 29.184v44.032h-50.176c-19.456 0-34.816 15.36-34.816 33.792 0 18.432 14.848 33.28 33.28 33.792h215.04c3.072 0 6.656 0.512 9.728 1.536 11.264 2.048 19.968 10.24 22.528 20.48 1.536 3.584 2.048 22.528 2.048 26.624v60.928z" fill="" ></path><path d="M830.976 455.168s-0.512-0.512 0 0c-3.072-3.072-6.656-5.12-11.264-5.12-7.68 0-14.336 4.608-14.848 11.264v1.536l-1.024 16.896c-2.56-0.512-5.632-1.024-8.704-1.024h-201.728c-15.36 0-28.16 10.24-28.16 23.04s12.288 23.04 28.16 23.04h201.728c2.048 0 4.608 0 6.656-0.512l-0.512 12.8v1.536c-0.512 6.656 5.632 11.776 13.824 12.288 3.072 0 6.144-0.512 9.216-2.56 1.024-0.512 1.536-1.024 2.048-1.536l50.176-36.352c5.632-4.096 5.632-11.264 0.512-15.872l-46.08-39.424z" fill="" ></path></symbol><symbol id="icon-bohui" viewBox="0 0 1024 1024"><path d="M537.725375 547.15625a35.26171875 35.26171875 0 0 0-35.15625-35.15625h-225a35.15625 35.15625 0 0 0 0 70.3125h225a35.26171875 35.26171875 0 0 0 35.15625-35.15625zM277.569125 392.46875h105.46875a35.15625 35.15625 0 0 0 0-70.3125h-105.46875a35.15625 35.15625 0 0 0 0 70.3125zM277.569125 701.84375a35.15625 35.15625 0 0 0 0 70.3125h147.65625a35.15625 35.15625 0 0 0 0-70.3125z" fill="" ></path><path d="M510.00115625 891.6875c-0.41484375 0-0.79453125 0.10546875-1.209375 0.11953125V891.6875H242.81365625a70.5234375 70.5234375 0 0 1-70.3125-70.3125V202.625a70.5234375 70.5234375 0 0 1 70.3125-70.3125h272.53125v189.33046875c0 33.328125 36.26015625 70.3125 70.3125 70.3125H756.09490625v-0.03515625h34.79765625c0.11953125 0 0.23203125 0.03515625 0.35859375 0.03515625a35.15625 35.15625 0 0 0 35.15625-35.15625V308.09375h-0.06328125a34.98046875 34.98046875 0 0 0-10.1953125-24.2296875L625.79178125 72.2515625A34.99453125 34.99453125 0 0 0 601.40740625 62.04921875V62H172.50115625A70.5234375 70.5234375 0 0 0 102.18865625 132.3125v759.375a70.5234375 70.5234375 0 0 0 70.3125 70.3125h337.5a35.15625 35.15625 0 0 0 0-70.3125zM585.65740625 132.6359375l170.03671875 189.00703125H641.90740625c-46.94765625 0-56.25-27.028125-56.25-70.3125z" fill="" ></path><path d="M911.07771875 693.70859375L781.8081875 564.4390625a34.86796875 34.86796875 0 0 0-17.8875-9.534375 35.521875 35.521875 0 0 0-7.03125-0.71015625L756.8331875 554.1875c-0.6609375 0-1.2796875 0.16171875-1.93359375 0.196875a35.45859375 35.45859375 0 0 0-4.809375 0.48515625 34.453125 34.453125 0 0 0-4.5703125 1.34296875c-0.646875 0.225-1.31484375 0.3515625-1.94765625 0.61171875a34.8890625 34.8890625 0 0 0-5.23125 2.7421875c-0.26015625 0.1546875-0.5484375 0.26015625-0.8015625 0.42890625A35.0859375 35.0859375 0 0 0 721.6769375 589.34375v267.1875a35.15625 35.15625 0 0 1-70.3125 0V694.8125a35.15625 35.15625 0 0 0-70.3125 0v161.71875a105.46875 105.46875 0 0 0 210.9375 0V674.0703125l69.3703125 69.35625a35.15625 35.15625 0 1 0 49.7109375-49.7109375z" fill="" ></path></symbol><symbol id="icon-daishenpi" viewBox="0 0 1024 1024"><path d="M742.58 702.76h-19.12L700 653a98.09 98.09 0 0 0 29.85-70.32c0-53.84-43.69-97.65-97.38-97.65s-97.38 43.8-97.38 97.65A98.1 98.1 0 0 0 564.94 653l-23.46 49.74H522a72.1 72.1 0 0 0-72 72v2.92a72.1 72.1 0 0 0 72 72h220.58a72.1 72.1 0 0 0 72-72v-2.92a72.1 72.1 0 0 0-72-71.98z m-110.1-167.7a47.69 47.69 0 0 1 24.38 88.49 25.39 25.39 0 0 0-10 34.68c0.37 0.64 0.77 1.25 1.19 1.84l20.14 42.69h-71.42L616.92 660c0.4-0.58 0.79-1.18 1.15-1.8a25 25 0 0 0-9.14-34.15 47.71 47.71 0 0 1 23.55-89zM764.6 777.7a22 22 0 0 1-22 22H522a22 22 0 0 1-22-22v-2.92a22 22 0 0 1 22-22h220.58a22 22 0 0 1 22 22zM479.67 514a32 32 0 0 0-32-32h-128a32 32 0 0 0 0 64h128a32 32 0 0 0 32-32z" fill="#666666" ></path><path d="M863 65.16H161a64.19 64.19 0 0 0-64 64v767.68a64.19 64.19 0 0 0 64 64h702a64.19 64.19 0 0 0 64-64V129.16a64.19 64.19 0 0 0-64-64z m0 831.58l-0.11 0.11H161.12l-0.11-0.11V129.27l0.11-0.11h701.76l0.11 0.11z" fill="#666666" ></path><path d="M319 289.58h383.25a32 32 0 0 0 0-64H319a32 32 0 1 0 0 64zM319 417.41h383.25a32 32 0 0 0 0-64H319a32 32 0 0 0 0 64z" fill="#666666" ></path></symbol><symbol id="icon-chehui" viewBox="0 0 1024 1024"><path d="M479.8 672H223c-17.7 0-32 14.3-32 32s14.3 32 32 32h256.9c17.7 0 32-14.3 32-32-0.1-17.7-14.4-32-32.1-32zM606.8 480H223c-17.7 0-32 14.3-32 32s14.3 32 32 32h383.9c17.7 0 32-14.3 32-32-0.1-17.7-14.4-32-32.1-32zM223 352h191.9c17.7 0 32-14.3 32-32s-14.3-32-32-32H223c-17.7 0-32 14.3-32 32s14.3 32 32 32zM832 671H686.8l23.1-23.1c12.5-12.5 12.5-32.8 0-45.3-6.2-6.2-14.4-9.4-22.6-9.4s-16.4 3.1-22.6 9.4L587 680.3c-0.4 0.4-0.8 0.8-1.1 1.2-5.5 6.1-8.2 13.8-8.2 21.4 0 7.7 2.7 15.4 8.2 21.4 0.4 0.4 0.7 0.8 1.1 1.2l77.7 77.7c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L686.8 735H832c35.6 0 64.5 29.3 64 65-0.5 35.1-29.8 63-65 63h-30c-17.7 0-32 14.3-32 32s14.3 32 32 32h29.6c70.6 0 129-56.6 129.4-127.3 0.4-70.9-57.2-128.7-128-128.7z"  ></path><path d="M822.4 247.6L649.2 73.4c-6-6-14.2-9.4-22.7-9.4H128c-35.3 0-64 28.7-64 64v768c0 35.3 28.6 64 64 64h543.9c17.7 0 32-14.3 32-32s-14.3-32-32-32H160c-17.7 0-32-14.3-32-32V160c0-17.7 14.3-32 32-32h383.9v160c0 35.3 28.6 64 64 64h159.9v192c0 17.7 14.3 32 32 32s32-14.3 32-32V270.2c0-8.5-3.4-16.6-9.4-22.6zM639.8 288c-17.7 0-32-14.3-32-32V128l159.9 160H639.8z"  ></path></symbol><symbol id="icon-tongguo" viewBox="0 0 1024 1024"><path d="M303.313 839.094h-119.25c-41.738 0-59.625-26.888-59.625-59.625V183.5c0-52.875 10.237-59.625 59.624-59.625h476.832c46.125 0 60.469 15.469 60.469 59.625v80.044c0 41.625 59.625 46.969 59.625 0v-79.875c0-87.863-28.407-119.194-120.207-119.194H183.894c-58.163 0-118.913 7.144-118.913 116.775V799.1a113.485 113.485 0 0 0 4.95 34.763 93.825 93.825 0 0 0 91.856 65.08c72.957 0.282 102.544 0 141.638 0 39.094 0 36.337-59.793-0.169-59.793z"  ></path><path d="M244.025 242.844c-42.806 0-44.719 60.412 0 60.412h357.637c40.95 0 47.475-60.356 0-60.412H244.026z m96.019 178.706h-96.019c-42.806 0-44.719 60.412 0 60.412h96.019c40.95 0 47.475-60.356 0-60.412zM660.894 363.219A298.012 298.012 0 1 0 958.962 661.23c0.057-166.837-137.08-298.012-298.068-298.012z m0 536.456a238.444 238.444 0 1 1 238.443-238.444A239.231 239.231 0 0 1 660.894 899.9v-0.225z"  ></path><path d="M765.237 557l-146.08 146.138-62.607-62.607c-5.963-11.925-29.813-11.925-41.737 0a28.8 28.8 0 0 0 0 41.738l83.53 83.475a28.8 28.8 0 0 0 41.738 0l166.894-166.95a29.531 29.531 0 0 0-41.681-41.738h-0.056z"  ></path></symbol><symbol id="icon-liuchengzuofei" viewBox="0 0 1024 1024"><path d="M427.625 877.625H174.5c-33.75 0-56.25-22.5-56.25-56.25v-618.75c0-33.75 22.5-56.25 56.25-56.25h506.25c33.75 0 56.25 22.5 56.25 56.25V343.25c0 16.875 11.25 28.125 28.125 28.125s28.125-11.25 28.125-28.125V202.625c0-61.875-50.625-112.5-112.5-112.5H174.5c-61.875 0-112.5 50.625-112.5 112.5v618.75c0 61.875 50.625 112.5 112.5 112.5h253.125c16.875 0 28.125-11.25 28.125-28.125s-5.625-28.125-28.125-28.125z"  ></path><path d="M630.125 343.25c0-16.875-11.25-28.125-28.125-28.125h-337.5c-22.5 0-33.75 11.25-33.75 28.125s11.25 28.125 28.125 28.125h337.5c22.5 0 33.75-11.25 33.75-28.125zM708.875 427.625C568.25 427.625 455.75 540.125 455.75 680.75s112.5 253.125 253.125 253.125 253.125-112.5 253.125-253.125-112.5-253.125-253.125-253.125z m0 450C602 877.625 512 787.625 512 680.75s90-196.875 196.875-196.875S905.75 573.875 905.75 680.75s-90 196.875-196.875 196.875z"  ></path><path d="M810.125 585.125c-11.25-11.25-28.125-11.25-39.375 0l-61.875 61.875-61.875-61.875c-11.25-11.25-28.125-11.25-39.375 0-11.25 11.25-11.25 28.125 0 39.375l61.875 61.875-61.875 61.875c-11.25 11.25-11.25 28.125 0 39.375 11.25 11.25 28.125 11.25 39.375 0l61.875-61.875 61.875 61.875c11.25 11.25 28.125 11.25 39.375 0 11.25-11.25 11.25-28.125 0-39.375l-61.875-61.875 61.875-61.875c11.25-11.25 11.25-28.125 0-39.375zM405.125 540.125c0-16.875-11.25-28.125-33.75-28.125h-112.5c-16.875 0-28.125 11.25-28.125 28.125s11.25 28.125 28.125 28.125h112.5c22.5 5.625 33.75-11.25 33.75-28.125zM258.875 708.875c-16.875 0-28.125 11.25-28.125 28.125s11.25 28.125 28.125 28.125h56.25c16.875 0 28.125-11.25 28.125-28.125s-11.25-28.125-28.125-28.125h-56.25z"  ></path></symbol><symbol id="icon-tqm-search" viewBox="0 0 1056 1024"><path d="M468.48 128c185.6 0 336 150.432 336 336 0 81.408-28.928 156.064-77.12 214.208l0.736 0.512 3.04 2.656 160 160a32 32 0 0 1-42.24 47.904l-3.04-2.656-160-160a32.256 32.256 0 0 1-3.2-3.744A334.496 334.496 0 0 1 468.48 800c-185.536 0-336-150.432-336-336s150.464-336 336-336z m0 64a272 272 0 1 0 0 544 272 272 0 0 0 0-544z"  ></path></symbol></svg>',(a=>{var c=(t=(t=document.getElementsByTagName("script"))[t.length-1]).getAttribute("data-injectcss"),t=t.getAttribute("data-disable-injectsvg");if(!t){var h,e,l,i,o,s=function(c,t){t.parentNode.insertBefore(c,t)};if(c&&!a.__iconfont__svg__cssinject__){a.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(c){console&&console.log(c)}}h=function(){var c,t=document.createElement("div");t.innerHTML=a._iconfont_svg_string_4700118,(t=t.getElementsByTagName("svg")[0])&&(t.setAttribute("aria-hidden","true"),t.style.position="absolute",t.style.width=0,t.style.height=0,t.style.overflow="hidden",t=t,(c=document.body).firstChild?s(t,c.firstChild):c.appendChild(t))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(h,0):(e=function(){document.removeEventListener("DOMContentLoaded",e,!1),h()},document.addEventListener("DOMContentLoaded",e,!1)):document.attachEvent&&(l=h,i=a.document,o=!1,d(),i.onreadystatechange=function(){"complete"==i.readyState&&(i.onreadystatechange=null,n())})}function n(){o||(o=!0,l())}function d(){try{i.documentElement.doScroll("left")}catch(c){return void setTimeout(d,50)}n()}})(window);

package/src/assets/icon/iconfont.json

@@ -0,0 +1,72 @@
+{
+  "id": "4700118",
+  "name": "flow-icon",
+  "font_family": "iconfont",
+  "css_prefix_text": "icon-",
+  "description": "",
+  "glyphs": [
+    {
+      "icon_id": "1263305",
+      "name": "待办",
+      "font_class": "daiban",
+      "unicode": "e629",
+      "unicode_decimal": 58921
+    },
+    {
+      "icon_id": "4766903",
+      "name": "cloud-download",
+      "font_class": "cloud-download",
+      "unicode": "e829",
+      "unicode_decimal": 59433
+    },
+    {
+      "icon_id": "5405340",
+      "name": "节点跳转",
+      "font_class": "tiaozhuan",
+      "unicode": "e639",
+      "unicode_decimal": 58937
+    },
+    {
+      "icon_id": "5485344",
+      "name": "驳回",
+      "font_class": "bohui",
+      "unicode": "e633",
+      "unicode_decimal": 58931
+    },
+    {
+      "icon_id": "6789075",
+      "name": "待审批列表",
+      "font_class": "daishenpi",
+      "unicode": "e631",
+      "unicode_decimal": 58929
+    },
+    {
+      "icon_id": "6834846",
+      "name": "文件-文件撤回",
+      "font_class": "chehui",
+      "unicode": "e76d",
+      "unicode_decimal": 59245
+    },
+    {
+      "icon_id": "12911873",
+      "name": "通过",
+      "font_class": "tongguo",
+      "unicode": "e60f",
+      "unicode_decimal": 58895
+    },
+    {
+      "icon_id": "34055836",
+      "name": "作废",
+      "font_class": "liuchengzuofei",
+      "unicode": "e72f",
+      "unicode_decimal": 59183
+    },
+    {
+      "icon_id": "41853292",
+      "name": "tqm-search",
+      "font_class": "tqm-search",
+      "unicode": "e602",
+      "unicode_decimal": 58882
+    }
+  ]
+}

package/src/styles/global.css

@@ -0,0 +1,4 @@
+/* src/styles/global.css */
+@import '../assets/icon/iconfont.css';
+
+/* 你可以在这里添加更多全局样式 */

package/src/utils/flutterUtil.js

@@ -0,0 +1,52 @@
+import { Toast } from "vant";
+import Vue from "vue";
+
+export const flutterUtil = {};
+
+/**
+ * 打开并预览文件。(需要在APP环境下测试)
+ * 后面会从 lambo-js-bridge 中引用(还未完善)，先用本地的
+ * 此函数通过调用 filePreview.openFile 方法来下载并预览文件。
+ * 在下载和预览过程中显示一个持续的加载提示，并在操作完成后显示相应的成功或失败信息。
+ *
+ * @param {String} fjUrl - 文件的URL，指向需要下载和预览的文件。
+ * @param {String} fjName - 在预览时显示的文件名。
+ * @example
+ * flutterUtil.openFile("http://example.com/file.pdf", "示例文件.pdf");
+ */
+flutterUtil.openFile=async function(fjUrl,fjName){
+    Toast.loading({
+        message: '加载中...',
+        duration: 0, // 持续展示 toast
+        forbidClick: true,
+    });
+    Vue.prototype.$lamboJsBridge.filePreview({
+        title: fjName,
+        path: fjUrl
+    }).then(result => {
+        console.log(result.msg)
+        Toast.clear()
+    }).catch(error => {
+        console.log(error.msg)
+        Toast.clear()
+    })
+}
+
+/**
+ * 扫描二维码并返回结果。(需要在APP环境下测试)
+ * 此函数通过调用 scanCode.startScan 方法来启动二维码扫描。
+ * 扫描成功后返回扫描结果，若扫描失败则返回错误信息。
+ *
+ * @returns {Promise<String>} - 返回一个 Promise，当扫描成功时 resolve，返回扫描的结果字符串；如果失败，reject 返回错误信息。
+ * @example
+ * flutterUtil.scanCode()
+ *   .then(result => {
+ *     console.log('扫描结果:', result.msg);
+ *   })
+ *   .catch(error => {
+ *     console.error('扫描失败:', error.msg);
+ *   });
+ */
+flutterUtil.scanCode = function() {
+    return Vue.prototype.$lamboJsBridge.scanCode();
+};