From fd7cbaabddf260bed4782e834daa510c49504d16 Mon Sep 17 00:00:00 2001
From: zyn <nn_0223@163.com>
Date: Tue, 14 Nov 2023 09:19:08 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E5=96=84=E5=85=AC=E5=85=B1=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../hzwlComponents/RadioGroupFormItem.vue     |  61 +++++++++++
 .../hzwlComponents/SelectMultipleFormItem.vue |  27 ++++-
 .../hzwlComponents/UploadFormItem.vue         |  27 +++--
 .../phoneComponents/phoneApprovalHistory.vue  | 103 ++++++++++++++++++
 .../pages/components/ProcessHeaderPhone.vue   |   4 +-
 5 files changed, 208 insertions(+), 14 deletions(-)
 create mode 100644 src/components/hzwlComponents/RadioGroupFormItem.vue
 create mode 100644 src/components/hzwlComponents/phoneComponents/phoneApprovalHistory.vue

diff --git a/src/components/hzwlComponents/RadioGroupFormItem.vue b/src/components/hzwlComponents/RadioGroupFormItem.vue
new file mode 100644
index 000000000..49fcca456
--- /dev/null
+++ b/src/components/hzwlComponents/RadioGroupFormItem.vue
@@ -0,0 +1,61 @@
+<template>
+  <el-form-item :label="label" :prop="prop" class="add-form-item form-item-disabled">
+    <el-radio-group :value="value"
+                    :disabled="disabled"
+                    :placeholder="placeholder"
+                    @input="handleChange"
+    >
+      <el-radio v-for="item in options"
+                :key="item.value"
+                :label="item.label">{{ item.value }}</el-radio>
+    </el-radio-group>
+  </el-form-item>
+</template>
+
+<script>
+export default {
+  name: "RadioGroupFormItem",
+  props: {
+    label: {
+      type: String,
+    },
+    prop: {
+      type: String
+    },
+    value: {
+      required: true
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    options: {
+      type: Array,
+      required: true
+    },
+  },
+  computed: {
+    placeholder () {
+      return `请选择${this.label}`
+    },
+  },
+  methods: {
+    handleChange (event) {
+      console.log(event)
+      this.$emit('input', event)
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+.add-form-item /deep/ .el-radio-group{
+  padding: 0 10px !important;
+}
+.add-form-item /deep/ .el-radio{
+  margin-right: 15px !important;
+}
+.add-form-item /deep/ .el-radio:last-child {
+  margin-right: 0 !important;
+}
+</style>
diff --git a/src/components/hzwlComponents/SelectMultipleFormItem.vue b/src/components/hzwlComponents/SelectMultipleFormItem.vue
index 571dbd025..511d10ff1 100644
--- a/src/components/hzwlComponents/SelectMultipleFormItem.vue
+++ b/src/components/hzwlComponents/SelectMultipleFormItem.vue
@@ -23,6 +23,7 @@ export default {
   name: "SelectMultipleFormItem",
   props: {
     value: {
+      type: [Array, String],
       required: true
     },
     prop: {
@@ -49,21 +50,39 @@ export default {
       default: true
     },
   },
+  data () {
+    return {
+      basicType: 'Array'
+    }
+  },
   computed: {
     placeholder () {
       return `请选择${this.label}`
     },
     data () {
-      if (this.value && this.value !== '') {
-        return this.value.split(',')
-      } else {
+      if (!this.value) {
         return []
+      } else {
+        if (this.getType(this.value) === 'Array') {
+          this.basicType = 'Array'
+          return this.value
+        } else if (this.getType(this.value) === 'String'){
+          this.basicType = 'String'
+          return this.value.split(',')
+        }
       }
     }
   },
   methods: {
+    getType (target) {
+      return Object.prototype.toString.call(target).slice(8, -1)
+    },
     handleChange (event) {
-      this.$emit('input', event.join(','))
+      if (this.basicType === 'Array') {
+        this.$emit('input', event)
+      } else if (this.basicType === 'String') {
+        this.$emit('input', event.join(','))
+      }
     }
   }
 }
diff --git a/src/components/hzwlComponents/UploadFormItem.vue b/src/components/hzwlComponents/UploadFormItem.vue
index 2765699e3..08ad292e9 100644
--- a/src/components/hzwlComponents/UploadFormItem.vue
+++ b/src/components/hzwlComponents/UploadFormItem.vue
@@ -7,16 +7,21 @@
       clearable
     ></el-input>
     <div style="display: flex;justify-content: space-between">
-      <div style="width: 80%;margin-top: 13px">
-        <div v-for="file in FileList"
-             :key="file.id"
-             @click="onPreview(file)"
-             style="color: #409eff;cursor:pointer"
-             class="fileClass">
-          {{ file.name }}
-        </div>
+      <div style="margin-top: 13px" :style="{width: view ? '100%' : '80%'}">
+        <template v-if="FileList.length > 0">
+          <div v-for="file in FileList"
+               :key="file.id"
+               @click="onPreview(file)"
+               style="color: #409eff;cursor:pointer"
+               class="fileClass">
+            {{ file.name }}
+          </div>
+        </template>
+        <template v-else>
+          <div v-if="view" style="line-height: 22px">-</div>
+        </template>
       </div>
-      <div style="width: 20%;">
+      <div v-if="!view" style="width: 20%;">
         <el-button :disabled="disabled"
                    type="primary"
                    class="common-button-primary"
@@ -85,6 +90,10 @@ export default {
     size: {
       type: Number,
       default: 200
+    },
+    view: {
+      type: Boolean,
+      default: false
     }
   },
   created () {
diff --git a/src/components/hzwlComponents/phoneComponents/phoneApprovalHistory.vue b/src/components/hzwlComponents/phoneComponents/phoneApprovalHistory.vue
new file mode 100644
index 000000000..9cdd99c21
--- /dev/null
+++ b/src/components/hzwlComponents/phoneComponents/phoneApprovalHistory.vue
@@ -0,0 +1,103 @@
+<template>
+  <div class="phoneHistortTable">
+    <el-table
+        height="100%"
+        ref="selection"
+        :data="histortData"
+        tooltip-effect="dark"
+        style="width: 100%"
+        border
+        row-key="id"
+        :header-cell-style="{background: '#f8f8f9', color: '#515a6e'}">
+      <el-table-column
+          prop="name"
+          min-width="100"
+          label="任务步骤"
+          align="center"
+      >
+      </el-table-column>
+      <el-table-column
+          prop="assignee"
+          min-width="100"
+          label="任务受理人"
+          align="center"
+      >
+      </el-table-column>
+      <el-table-column
+          prop="createTime"
+          label="创建时间"
+          min-width="100"
+          align="center">
+        <template slot-scope="scope">
+          <span>{{ scope.row.createTime ? $moment(scope.row.createTime).format('YYYY-MM-DD') : '' }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+          prop="endTime"
+          label="完成时间"
+          min-width="100"
+          align="center">
+        <template slot-scope="scope">
+          <span>{{ scope.row.endTime ? $moment(scope.row.endTime).format('YYYY-MM-DD') : '' }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+          prop="comment"
+          label="流程信息"
+          min-width="100"
+          align="center">
+        <template slot-scope="scope">
+          <span>{{ scope.row.commentText }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+          prop="completeFlag"
+          label="状态"
+          align="center">
+        <template slot-scope="scope">
+          <span>{{ scope.row.endTime ? '已完成' : scope.row.receiveStatus ? '已接收' : '未完成' }}</span>
+        </template>
+      </el-table-column>
+    </el-table>
+    <loading :loading="loading">流程列表加载中</loading>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "phoneApprovalHistory",
+  data() {
+    return {
+      histortData: [],
+      loading: false
+    }
+  },
+  props: {
+    prcNum: {
+      type: String
+    }
+  },
+  methods: {
+    getHistoryData () {
+      this.$http.get('lawss/activiti/get_list_by_instance', {
+        prcNum: this.prcNum || this.$route.query.prcNum
+      }, {
+        loading: "loading",
+        _this: this
+      }, res => {
+        this.histortData = res
+      }, e => {})
+    },
+  },
+  mounted () {
+    this.getHistoryData()
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.phoneHistortTable{
+  height: 100%;
+  //min-height: calc(100vh - 52px)
+}
+</style>
diff --git a/src/pages/processCenter/pages/components/ProcessHeaderPhone.vue b/src/pages/processCenter/pages/components/ProcessHeaderPhone.vue
index e62b55566..ee5a5a3ce 100644
--- a/src/pages/processCenter/pages/components/ProcessHeaderPhone.vue
+++ b/src/pages/processCenter/pages/components/ProcessHeaderPhone.vue
@@ -73,12 +73,14 @@
     }
     .process-title {
         width: 100%;
-        margin-left: 10px;
+        //margin-left: 10px;
         font-size: 18px;
         font-weight: bold;
         display: inline-block;
         height: 30px;
         line-height: 30px;
+        box-sizing: border-box;
+        padding-left: 10px;
         .smallText {
             font-size: 14px;
             margin-left: 5px;