vue2-client 1.9.78 → 1.9.79

package/src/pages/WorkflowDetail/WorkflowPageDetail/WorkflowDetailResso.vue

@@ -1,261 +1,261 @@
-<template>
-  <!-- 抽屉 -->
-  <a-drawer
-    :visible="visible"
-    :width="isMobile ? screenWidth : screenWidth * 0.95"
-    :placement="direction"
-    title="流程详情"
-    @close="onClose"
-    :get-container="false"
-  >
-    <div>
-      <!-- 基础信息 -->
-      <workflow-base-information-details
-        v-if="details"
-        ref="baseInformation"
-        :workflow-id="workflowId"
-        :details="details"
-        :visible="visible"
-      />
-      <div :style="{ height: screenHeight * 0.9 + 'px' }">
-        <a-card style="margin-top: 20px">
-          <a-tabs :activeKey="activeKey" @change="changeTab">
-            <!--   第二个标签页，显示流程信息，根据当前节点显示历史记录、填写表单、控制流程按钮   -->
-            <a-tab-pane key="1" tab="查看 / 编辑进度">
-              <WorkFlowHandleReso
-                v-if="
-                  activeKey === '1' && details.f_state && steps
-                "
-                ref="workflowHandle"
-                :workflow-id="workflowId"
-                :workflowState="details.f_state === 1"
-                :complete-time="details.f_complete_time"
-                :stepsForChild="steps"
-                :visible="visible"
-                :taskName="details.f_task_name"
-                :details="details"
-                @refresh="stepChanged"
-              />
-            </a-tab-pane>
-            <a-tab-pane key="2" tab="任务流转记录">
-              <workflow-log v-if="activeKey === '2'" :workflow-id="workflowId" />
-            </a-tab-pane>
-            <a-tab-pane key="4">
-              <span slot="tab">
-                <span>任务留言</span>
-                <a-badge :count="messageList.length" :offset="[4, -4]" :number-style="{ backgroundColor: '#b2b2b2' }"></a-badge>
-              </span>
-              <a-row>
-                <a-col :span="14">
-                  <leave-message
-                    :projectName="details.f_task_name"
-                    :data="messageList"
-                    :loading="messageLoading"
-                    :submit-message="submitMessage"
-                    @refresh="getMessage"
-                    :workflow-id="workflowId"
-                  />
-                </a-col>
-              </a-row>
-            </a-tab-pane>
-          </a-tabs>
-        </a-card>
-      </div>
-    </div>
-  </a-drawer>
-</template>
-
-<script>
-import { mapState } from 'vuex'
-import workflowBaseInformationDetails from './WorkFlowBaseInformationDetails.vue'
-import WorkFlowHandleReso from './WorkFlowHandleReso.vue'
-import XFormTable from '@vue2-client/base-client/components/common/XFormTable/XFormTable'
-import { postByServiceName } from '@vue2-client/services/api/restTools'
-import { workFlowViewApi } from '@vue2-client/services/api/workFlow'
-import ApplyWorkflowLog from './WorkflowLog.vue'
-import WorkflowLog from '@vue2-client/pages/WorkflowDetail/WorkflowPageDetail/WorkflowLog.vue'
-import LeaveMessage from '@vue2-client/pages/WorkflowDetail/WorkflowPageDetail/LeaveMessage.vue'
-
-export default {
-  name: 'WorkflowDetail',
-  components: {
-    LeaveMessage,
-    WorkflowLog,
-    workflowBaseInformationDetails,
-    WorkFlowHandleReso,
-    XFormTable,
-    ApplyWorkflowLog
-    // LeaveMessage
-  },
-  data () {
-    return {
-      // 页面宽度
-      screenWidth: document.documentElement.clientWidth,
-      // 页面高度
-      screenHeight: document.documentElement.clientHeight,
-      // 控制当前标签页
-      activeKey: '2',
-      // 保存流程和留言信息
-      steps: undefined,
-      // 基础信息
-      details: {},
-      // 是否已完成
-      allStepDown: false,
-      // 给XFormTable增加额外查询条件
-      fixedAddForm: {},
-      fixedQueryForm: {},
-      // 统计数据
-      chartData: {
-        // 流程进度
-        instructRateOfSuccessValue: 0
-      },
-      // 留言数据
-      messageList: [],
-      messageLoading: true,
-    }
-  },
-  computed: {
-    ...mapState('account', { currUser: 'user' }),
-    ...mapState('setting', ['isMobile'])
-  },
-  props: {
-    workflowId: {
-      type: String,
-      required: true
-    },
-    direction: {
-      type: String,
-      required: false,
-      default: ''
-    },
-    visible: {
-      type: Boolean,
-      default: false
-    }
-  },
-  mounted () {
-    this.init()
-  },
-  methods: {
-    // 内部组件更新了当前步骤后的回调
-    stepChanged () {
-      this.loading = true
-      this.init()
-    },
-    // 获取所有步骤
-    getSteps () {
-      return postByServiceName(workFlowViewApi.getStepNoteAndHandler, {
-        workflowId: this.workflowId
-      })
-        .then(res => {
-          this.steps = res
-          console.log('所有步骤', this.steps)
-        }, err => {
-          console.log(err)
-        })
-    },
-    // 关闭抽屉的回调
-    onClose () {
-      if (this.$refs.workflowHandle !== undefined) {
-        this.$refs.workflowHandle.onClose()
-      }
-      this.$emit('update:visible', false)
-      this.activeKey = '2'
-      this.allStepDown = false
-      this.details = {}
-      this.fixedAddForm = {}
-      this.fixedQueryForm = {}
-      this.steps = undefined
-      this.messageList = []
-    },
-    // 获取基础信息
-    getBaseInfo () {
-      this.loading = true
-      return postByServiceName(workFlowViewApi.getWorkFlowBasicInfo, {
-        workflowId: this.workflowId
-      })
-        .then(res => {
-          res.f_sub_state = this.steps[res.f_step_id - 1].name
-          this.details = res
-          if (res.f_state === 1) {
-            this.allStepDown = true
-          }
-          this.chartData.instructRateOfSuccessValue = Math.round(res.f_step_id / this.steps.length * 100)
-        }, err => {
-          console.log(err)
-        })
-    },
-    // 初始化两张固定表
-    async init () {
-      this.getMessage()
-      await this.getSteps()
-      await this.getBaseInfo()
-      this.fixedQueryForm.a_f_workflow_id = this.workflowId
-      this.fixedAddForm.a_f_workflow_id = this.workflowId
-      if (this.$refs.xFormTableOne !== undefined) {
-        this.$refs.xFormTableOne.$refs.xTable.refresh(true)
-      }
-      if (this.$refs.xFormTableTwo !== undefined) {
-        this.$refs.xFormTableTwo.$refs.xTable.refresh(true)
-      }
-    },
-    // 切换标签页
-    changeTab (id) {
-      this.activeKey = id
-    },
-    // 获取留言
-    getMessage () {
-      this.messageLoading = true
-      postByServiceName(workFlowViewApi.getWorkFlowLeaveMessage, {
-        workflowId: this.workflowId
-      }).then(res => {
-        this.messageList = res
-        this.messageLoading = false
-      })
-    },
-    // 提交留言
-    submitMessage (data) {
-      data.f_workflow_id = this.workflowId
-      return postByServiceName('/entity/t_workflow_leave_message', data)
-    }
-  },
-  watch: {
-    visible (newVal) {
-      if (newVal) {
-        this.init()
-      }
-    },
-  },
-}
-</script>
-
-<style lang="less" scoped>
-/deep/ .step-label {
-  &:not(:first-child) {
-    margin-left: 16px;
-  }
-
-  .step-icon {
-    position: relative;
-    top: 1px;
-    display: inline-block;
-    width: 12px;
-    height: 12px;
-    background: #ffffff;
-    border-radius: 50%;
-    margin-right: 8px;
-
-    &.blue {
-      border: 3px solid rgb(24, 144, 255);
-    }
-
-    &.green {
-      border: 3px solid rgb(82, 196, 26);
-    }
-
-    &.gray {
-      border: 3px solid rgb(191, 191, 191);
-    }
-  }
-}
-</style>
+<template>
+  <!-- 抽屉 -->
+  <a-drawer
+    :visible="visible"
+    :width="isMobile ? screenWidth : screenWidth * 0.95"
+    :placement="direction"
+    title="流程详情"
+    @close="onClose"
+    :get-container="false"
+  >
+    <div>
+      <!-- 基础信息 -->
+      <workflow-base-information-details
+        v-if="details"
+        ref="baseInformation"
+        :workflow-id="workflowId"
+        :details="details"
+        :visible="visible"
+      />
+      <div :style="{ height: screenHeight * 0.9 + 'px' }">
+        <a-card style="margin-top: 20px">
+          <a-tabs :activeKey="activeKey" @change="changeTab">
+            <!--   第二个标签页，显示流程信息，根据当前节点显示历史记录、填写表单、控制流程按钮   -->
+            <a-tab-pane key="1" tab="查看 / 编辑进度">
+              <WorkFlowHandleReso
+                v-if="
+                  activeKey === '1' && details.f_state && steps
+                "
+                ref="workflowHandle"
+                :workflow-id="workflowId"
+                :workflowState="details.f_state === 1"
+                :complete-time="details.f_complete_time"
+                :stepsForChild="steps"
+                :visible="visible"
+                :taskName="details.f_task_name"
+                :details="details"
+                @refresh="stepChanged"
+              />
+            </a-tab-pane>
+            <a-tab-pane key="2" tab="任务流转记录">
+              <workflow-log v-if="activeKey === '2'" :workflow-id="workflowId" />
+            </a-tab-pane>
+            <a-tab-pane key="4">
+              <span slot="tab">
+                <span>任务留言</span>
+                <a-badge :count="messageList.length" :offset="[4, -4]" :number-style="{ backgroundColor: '#b2b2b2' }"></a-badge>
+              </span>
+              <a-row>
+                <a-col :span="14">
+                  <leave-message
+                    :projectName="details.f_task_name"
+                    :data="messageList"
+                    :loading="messageLoading"
+                    :submit-message="submitMessage"
+                    @refresh="getMessage"
+                    :workflow-id="workflowId"
+                  />
+                </a-col>
+              </a-row>
+            </a-tab-pane>
+          </a-tabs>
+        </a-card>
+      </div>
+    </div>
+  </a-drawer>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import workflowBaseInformationDetails from './WorkFlowBaseInformationDetails.vue'
+import WorkFlowHandleReso from './WorkFlowHandleReso.vue'
+import XFormTable from '@vue2-client/base-client/components/common/XFormTable/XFormTable'
+import { postByServiceName } from '@vue2-client/services/api/restTools'
+import { workFlowViewApi } from '@vue2-client/services/api/workFlow'
+import ApplyWorkflowLog from './WorkflowLog.vue'
+import WorkflowLog from '@vue2-client/pages/WorkflowDetail/WorkflowPageDetail/WorkflowLog.vue'
+import LeaveMessage from '@vue2-client/pages/WorkflowDetail/WorkflowPageDetail/LeaveMessage.vue'
+
+export default {
+  name: 'WorkflowDetail',
+  components: {
+    LeaveMessage,
+    WorkflowLog,
+    workflowBaseInformationDetails,
+    WorkFlowHandleReso,
+    XFormTable,
+    ApplyWorkflowLog
+    // LeaveMessage
+  },
+  data () {
+    return {
+      // 页面宽度
+      screenWidth: document.documentElement.clientWidth,
+      // 页面高度
+      screenHeight: document.documentElement.clientHeight,
+      // 控制当前标签页
+      activeKey: '2',
+      // 保存流程和留言信息
+      steps: undefined,
+      // 基础信息
+      details: {},
+      // 是否已完成
+      allStepDown: false,
+      // 给XFormTable增加额外查询条件
+      fixedAddForm: {},
+      fixedQueryForm: {},
+      // 统计数据
+      chartData: {
+        // 流程进度
+        instructRateOfSuccessValue: 0
+      },
+      // 留言数据
+      messageList: [],
+      messageLoading: true,
+    }
+  },
+  computed: {
+    ...mapState('account', { currUser: 'user' }),
+    ...mapState('setting', ['isMobile'])
+  },
+  props: {
+    workflowId: {
+      type: String,
+      required: true
+    },
+    direction: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    visible: {
+      type: Boolean,
+      default: false
+    }
+  },
+  mounted () {
+    this.init()
+  },
+  methods: {
+    // 内部组件更新了当前步骤后的回调
+    stepChanged () {
+      this.loading = true
+      this.init()
+    },
+    // 获取所有步骤
+    getSteps () {
+      return postByServiceName(workFlowViewApi.getStepNoteAndHandler, {
+        workflowId: this.workflowId
+      })
+        .then(res => {
+          this.steps = res
+          console.log('所有步骤', this.steps)
+        }, err => {
+          console.log(err)
+        })
+    },
+    // 关闭抽屉的回调
+    onClose () {
+      if (this.$refs.workflowHandle !== undefined) {
+        this.$refs.workflowHandle.onClose()
+      }
+      this.$emit('update:visible', false)
+      this.activeKey = '2'
+      this.allStepDown = false
+      this.details = {}
+      this.fixedAddForm = {}
+      this.fixedQueryForm = {}
+      this.steps = undefined
+      this.messageList = []
+    },
+    // 获取基础信息
+    getBaseInfo () {
+      this.loading = true
+      return postByServiceName(workFlowViewApi.getWorkFlowBasicInfo, {
+        workflowId: this.workflowId
+      })
+        .then(res => {
+          res.f_sub_state = this.steps[res.f_step_id - 1].name
+          this.details = res
+          if (res.f_state === 1) {
+            this.allStepDown = true
+          }
+          this.chartData.instructRateOfSuccessValue = Math.round(res.f_step_id / this.steps.length * 100)
+        }, err => {
+          console.log(err)
+        })
+    },
+    // 初始化两张固定表
+    async init () {
+      this.getMessage()
+      await this.getSteps()
+      await this.getBaseInfo()
+      this.fixedQueryForm.a_f_workflow_id = this.workflowId
+      this.fixedAddForm.a_f_workflow_id = this.workflowId
+      if (this.$refs.xFormTableOne !== undefined) {
+        this.$refs.xFormTableOne.$refs.xTable.refresh(true)
+      }
+      if (this.$refs.xFormTableTwo !== undefined) {
+        this.$refs.xFormTableTwo.$refs.xTable.refresh(true)
+      }
+    },
+    // 切换标签页
+    changeTab (id) {
+      this.activeKey = id
+    },
+    // 获取留言
+    getMessage () {
+      this.messageLoading = true
+      postByServiceName(workFlowViewApi.getWorkFlowLeaveMessage, {
+        workflowId: this.workflowId
+      }).then(res => {
+        this.messageList = res
+        this.messageLoading = false
+      })
+    },
+    // 提交留言
+    submitMessage (data) {
+      data.f_workflow_id = this.workflowId
+      return postByServiceName('/entity/t_workflow_leave_message', data)
+    }
+  },
+  watch: {
+    visible (newVal) {
+      if (newVal) {
+        this.init()
+      }
+    },
+  },
+}
+</script>
+
+<style lang="less" scoped>
+/deep/ .step-label {
+  &:not(:first-child) {
+    margin-left: 16px;
+  }
+
+  .step-icon {
+    position: relative;
+    top: 1px;
+    display: inline-block;
+    width: 12px;
+    height: 12px;
+    background: #ffffff;
+    border-radius: 50%;
+    margin-right: 8px;
+
+    &.blue {
+      border: 3px solid rgb(24, 144, 255);
+    }
+
+    &.green {
+      border: 3px solid rgb(82, 196, 26);
+    }
+
+    &.gray {
+      border: 3px solid rgb(191, 191, 191);
+    }
+  }
+}
+</style>