n20-common-lib 1.2.43 → 1.3.0

package/src/components/NstcG6Components/approvelTwo/main.vue

@@ -0,0 +1,220 @@
+<!--
+  功能：    审批页面按钮
+  作者：    nstc
+  创建时间： 2021-08-11
+-->
+<template>
+  <div class="nstc-approvel">
+    <AppProgress />
+  </div>
+</template>
+
+<script>
+import AppProgress from './progress.vue'
+import axios from '@/utils/axios'
+export default {
+  name: 'NstcApprovelTwo',
+  components: {
+    AppProgress
+  },
+  props: {
+    // 预算特殊处理
+    cfbType: {
+      type: Boolean,
+      default: false
+    },
+    // 待审核-驳回至发起人
+    rejectUrl: {
+      type: String,
+      default: '/api/bems/activiti/admin/todo/reject'
+    },
+    // 待审核-驳回至上一步
+    rejectpreUrl: {
+      type: String,
+      default: '/api/bems/activiti/admin/todo/rejectpre'
+    },
+    // 待审核-批准
+    advanceUrl: {
+      type: String,
+      default: '/api/bems/activiti/admin/todo/advance'
+    },
+    // 待审核还是待处理 0 待处理  1 待审核
+    isProcessed: {
+      type: Number,
+      default: 1
+    },
+    // 点击批准按钮的时候是否有其他操作
+    approveOrtherOpreate: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      visible: false,
+      message: ''
+    }
+  },
+  mounted() {},
+  beforeDestroy() {},
+  methods: {
+    activitiReject(data) {
+      return axios.get({
+        url: this.rejectUrl,
+        data
+      })
+    },
+    activitiRejectpre(data) {
+      return axios({
+        url: this.rejectpreUrl,
+        method: 'POST',
+        data
+      })
+    },
+    activitiAdvance(data) {
+      return axios({
+        url: this.advanceUrl,
+        method: 'POST',
+        data
+      })
+    },
+
+    async submitBtn(val) {
+      let data = [
+        {
+          appNo: this.$route.query.appNo || this.$route.params.appNo,
+          attributes: {},
+          groupNo: this.$route.query.groupNo || this.$route.params.groupNo,
+          message: this.message,
+          procInstId:
+            this.$route.query.processInstanceId ||
+            this.$route.params.processInstanceId,
+          taskId: this.$route.query.taskId || this.$route.params.taskId,
+          typeCode: this.$route.query.typeCode || this.$route.params.typeCode
+        }
+      ]
+      let res
+      switch (val) {
+        case 0: // 返回
+          // window.closeTagsForBackPage
+          //   ? window.closeTagsForBackPage(this.$route.fullPath)
+          this.cfbType ? this.$router.go(-2) : this.$router.go(-1)
+          break
+
+        case 1: // 驳回至发起人
+          if (this.message === '') {
+            this.$message({
+              type: 'warnning',
+              message: '请输入审批意见'
+            })
+            return
+          }
+          if (this.approveOrtherOpreate) {
+            this.$emit('otherOperate', 1)
+            return
+          }
+          res = await this.activitiReject(data)
+          if (res.failCount === 0) {
+            this.$message({
+              type: 'success',
+              message: '操作成功'
+            })
+            // window.closeTagsForBackPage
+            //   ? window.closeTagsForBackPage(this.$route.fullPath)
+            this.cfbType ? this.$router.go(-2) : this.$router.go(-1)
+          }
+          break
+
+        case 2: // 驳回至上一节点
+          if (this.message === '') {
+            this.$message({
+              type: 'warnning',
+              message: '请输入审批意见'
+            })
+            return
+          }
+          if (this.approveOrtherOpreate) {
+            this.$emit('otherOperate', 2)
+            return
+          }
+          res = await this.activitiRejectpre(data)
+          if (res.failCount === 0) {
+            this.$message({
+              type: 'success',
+              message: '操作成功'
+            })
+            // window.closeTagsForBackPage
+            //   ? window.closeTagsForBackPage(this.$route.fullPath)
+            this.cfbType ? this.$router.go(-2) : this.$router.go(-1)
+          }
+
+          break
+
+        case 3: // 批准
+          if (this.approveOrtherOpreate) {
+            this.$emit('otherOperate', 3)
+          } else {
+            res = await this.activitiAdvance(data)
+            if (res.failCount === 0) {
+              this.$message({
+                type: 'success',
+                message: '操作成功'
+              })
+              // window.closeTagsForBackPage
+              //   ? window.closeTagsForBackPage(this.$route.fullPath)
+              this.cfbType ? this.$router.go(-2) : this.$router.go(-1)
+            }
+          }
+
+          break
+      }
+    },
+    pendingBtn(val) {
+      switch (val) {
+        case 0: // 返回
+          window.closeTagsForBackPage
+            ? window.closeTagsForBackPage(this.$route.fullPath)
+            : this.$router.go(-1)
+          break
+
+        case 1: // 暂存
+          this.$bus.$emit('pending')
+          this.$emit('pending')
+          break
+
+        case 2: // 提交
+          this.$bus.$emit('pendingSubmit')
+          this.$emit('pendingSubmit')
+          break
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.nstc-approvel {
+  .btn {
+    height: 48px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    box-shadow: 0px -2px 6px 0px rgba(92, 100, 113, 0.11);
+    position: fixed !important;
+    bottom: 0;
+    left: unset !important;
+    right: 16px;
+    background: #fff;
+    .reject {
+      color: #3d4a57 !important;
+      background-color: #e7e6e6 !important;
+      border-color: #e7e6e6 !important;
+    }
+    .reject:hover {
+      color: #3d4a57 !important;
+      background-color: #ccc !important;
+      border-color: #ccc !important;
+    }
+  }
+}
+</style>

package/src/components/NstcG6Components/approvelTwo/progress.vue

@@ -0,0 +1,154 @@
+<template>
+  <div class="nstc-approvel-examination">
+    <div slot="title">
+      <div
+        style="
+          height: 36px;
+          display: flex;
+          justify-content: flex-end;
+          align-items: center;
+          position: absolute;
+          top: 0;
+          right: 100px;
+          z-index: 999;
+        "
+      ></div>
+    </div>
+    <div>
+      <div style="margin: auto">
+        <div v-for="(item, index) in approvalTable" :key="index">
+          <div style="display: flex; align-items: center">
+            <div style="width: 200px; color: #bec8d2">{{ item.endTime }}</div>
+            <div
+              style="
+                width: 19px;
+                height: 19px;
+                line-height: 17px;
+                background: #fff;
+                border-radius: 10px;
+                color: #ccc;
+                text-align: center;
+                border: 1px solid #ccc;
+                font-size: 8px;
+              "
+              :style="item.endTime ? 'background:#1677FF' : ''"
+            ></div>
+            <img
+              src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAACa0lEQVQ4T5WTW0hTcRzHv7+/O25RMYUk6AIGXQyUeeqEwo7Fwh3p4oNQIvWUD0bPUURUUAlFbz2F0EvRSyuigpTtmAN3ll1Wm7pQEV+6QUlkkbLbOb/Yyphr6vo//n7f3+f/uxIWeQOhuMsU6YvM2A3AAjBggzi/V3VNFAuhYsZ+Y7jJgvWQQN3pdOKeZFslgMwRhnUSgryaW44VxhUBMfmN2JgAXfCq9b78AP1ZrJMt7tJUuXFZkD40up3NjK6p8oZCsc/nK6tYv/ULVjjqtB01n/L9/2SkG68bGeKGpspysbID4egkQ7S1uF3xpUGRiJMTtg/CVra5ubHuc764LxitLpMwmnSYa1sVZW5JUNYZCMWuA9gmZWyHPJ7an1mbHplycuLHY4J44VVdp5ftUVbQ2ztpl5yzt8DYw8x9IAgA+wkIVDrMY4qipEsCZUXByMSaTDJx2GKrhQCLCH1kSz1obmj4WtIe9YeHOxjmKbDYAvB7BlK5QIKdmDYyeEyQuNbsdt0v2qN4PF7+cSZ1myBqhcCZqfKM/3hBCb54vLxyJnmQSVwlxsv8Mv+OXw9He5ipOvkt09baunAihaUYxvjqWcw9IYi3mlp/4nfCAPxDww1k8iNpJdd4ZHlmsfvLtw8OvqlKCBonWAe86s7nOVDAiN0E8E5T6y+VApnX+EPRbgLWaU1y5x9QNATgiqbKvf8DemqM7Muwea6lSXbnQHo4dhlgGXbzqFdRvpcCC0ajFelZ3AEwoqny2RwoGAw6UlJFDxF1gFkqBQSi7FLelVLOLo9nU2LB0Wavu6pqV0mg6elX6fb2dnP+01+5XvET5hOqAQAAAABJRU5ErkJggg=="
+              style="
+                vertical-align: bottom;
+                width: 18px;
+                height: 18px;
+                margin-right: 10px;
+              "
+            />
+            <span
+              style="margin-left: 10px; max-width: 300px; color: #434f5c"
+              :title="item.more"
+            >
+              {{ item.assignee }}
+            </span>
+            <span
+              v-if="item.optResult"
+              style="margin-left: 10px; color: #434f5c"
+              >{{ item.optResult }}</span
+            >
+            <el-tooltip
+              v-if="item.suggestion && item.suggestion.length > 40"
+              effect="dark"
+              :content="item.suggestion"
+              placement="top"
+            >
+              <span
+                v-if="item.suggestion"
+                style="margin-left: 10px; color: #434f5c"
+                :class="
+                  item.suggestion && item.suggestion.length > 40 ? 'hidden' : ''
+                "
+                >审批意见：{{ item.suggestion }}</span
+              >
+            </el-tooltip>
+          </div>
+          <div
+            v-if="approvalTable.length !== index + 1"
+            style="
+              width: 2px;
+              height: 20px;
+              background: #ccc;
+              margin: 2px 9px;
+              margin-left: 209px;
+            "
+            :style="item.endTime ? 'background:#1677FF' : ''"
+          ></div>
+        </div>
+      </div>
+    </div>
+    <el-dialog title="查看流程" :visible.sync="dialogVisible" width="1200px">
+      <div v-html="svgHtml"></div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import axios from '@/utils/axios'
+
+export default {
+  name: 'ClApprovalProgress',
+  props: {},
+  data() {
+    return {
+      dialogVisible: false,
+      approvalTable: [],
+      svgHtml: '',
+      bizFlowId: ''
+    }
+  },
+  watch: {
+    bizFlowId() {
+      if (this.bizFlowId.length > 0) {
+        this.intData(this.bizFlowId)
+      }
+    }
+  },
+
+  mounted() {
+    this.bizFlowId =
+      this.$route.query.processInstanceId ||
+      this.$route.params.processInstanceId ||
+      '0cf3ec79c7b048c9add24dd03c95332a'
+    this.intData(this.bizFlowId)
+  },
+
+  methods: {
+    intData(bizFlowId) {
+      axios.get(`/bems/activiti/sample/Q003`, bizFlowId).then((res) => {
+        if (res) {
+          this.approvalTable = res.map((item) => {
+            item.more = item.assignee
+            if (item.assignee && item.assignee.length > 20) {
+              item.assignee = item.assignee.substring(1, 20) + '...'
+            }
+            return item
+          })
+        }
+      })
+      axios.get(`/bems/activiti/sample/Q004`, bizFlowId).then((res) => {
+        if (res) {
+          this.svgHtml = res
+        }
+      })
+    }
+  }
+}
+</script>
+<style lang='scss' scoped>
+.examination {
+  margin-bottom: 20px;
+}
+.hidden {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap; //禁止换行
+  width: 600px;
+}
+</style>

package/src/components/PageHeader/index.vue

@@ -0,0 +1,80 @@
+<template>
+  <div class="page-header">
+    <div v-if="!disable" class="page-header__left" @click="$emit('back')">
+      <i :class="icon"></i>
+      <div class="page-header__title">
+        <slot name="title">{{ title }}</slot>
+      </div>
+    </div>
+    <div class="page-header__content">
+      <slot name="content">{{ content }}</slot>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'PageHeader',
+  props: {
+    title: {
+      type: String,
+      default() {
+        return '返回'
+      }
+    },
+    content: String,
+    disable: {
+      type:Boolean,
+      default: false
+    },
+    icon: {
+      type: String,
+      default: 'n20-icon-yuefenqiehuan-zuoce'
+    }
+  }
+};
+</script>
+
+
+<style lang="scss" scoped>
+.page-header {
+  display: flex;
+  line-height: 20px;
+  padding-bottom: 2px;
+  border-bottom: 1px solid rgba(0,0,0,0.10);
+  .page-header__left {
+    display: flex;
+    align-items: center;
+    cursor: pointer;
+    margin-right: 16px;
+    position: relative;
+
+  }
+  .page-header__left:hover {
+    color: var(--color-primary);
+    .page-header__title {
+      color: var(--color-primary);
+    }
+  }
+  .page-header__left:after {
+    content: "";
+    position: absolute;
+    width: 1px;
+    height: 16px;
+    right: -8px;
+    top: 50%;
+    transform: translateY(-50%);
+    background-color: #dcdfe6;
+  }
+  .page-header__title {
+    font-size: 14px;
+    line-height: 20px;
+    color: #3D4A57;
+  }
+  .page-header__content {
+    font-size: 14px;
+    line-height: 20px;
+    color: #3D4A57;
+  }
+}
+</style>

package/src/components/PageLayout/page.vue

@@ -1,15 +1,15 @@
-<template>
-  <div class="flex-column">
-    <slot name="header"></slot>
-    <div class="n20-page-content flex-item">
-      <slot></slot>
-    </div>
-    <slot name="footer"></slot>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'Page'
-}
-</script>
+<template>
+  <div class="flex-column">
+    <slot name="header"></slot>
+    <div class="n20-page-content flex-item">
+      <slot></slot>
+    </div>
+    <slot name="footer"></slot>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Page'
+}
+</script>