vue2-client 1.13.7 → 1.13.8

package/src/pages/WorkflowDetail/WorkflowDetail.vue

@@ -1,235 +1,235 @@
-<template>
-  <!-- 抽屉 -->
-  <a-drawer
-    :visible="visible"
-    width="85vw"
-    :placement="direction"
-    title="流程详情"
-    @close="onClose"
-  >
-    <div>
-      <!-- 基础信息 -->
-      <workflow-base-information
-        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="查看 / 编辑进度">
-              <WorkFlowHandle
-                v-if="
-                  activeKey === '1' &&
-                    details.f_state !== undefined &&
-                    steps !== undefined
-                "
-                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"
-                @success="success"
-                @nextClick="nextClick"
-              />
-            </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
-                    :workflowId="this.workflowId"
-                    :projectName="details.f_task_name"
-                    :data="messageList"
-                    :loading="messageLoading"
-                    @success="success"/>
-                </a-col>
-              </a-row>
-            </a-tab-pane>
-          </a-tabs>
-        </a-card>
-      </div>
-    </div>
-  </a-drawer>
-</template>
-
-<script>
-import { mapState } from 'vuex'
-import workflowBaseInformation from './WorkflowPageDetail/WorkFlowBaseInformation.vue'
-import WorkFlowHandle from './WorkflowPageDetail/WorkFlowHandle.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 WorkflowLog from './WorkflowPageDetail/WorkflowLog.vue'
-import LeaveMessage from './WorkflowPageDetail/LeaveMessage'
-
-export default {
-  name: 'WorkflowDetail',
-  components: {
-    workflowBaseInformation,
-    WorkFlowHandle,
-    XFormTable,
-    WorkflowLog,
-    LeaveMessage
-  },
-  data () {
-    return {
-      // 页面宽度
-      screenWidth: document.documentElement.clientWidth,
-      // 页面高度
-      screenHeight: document.documentElement.clientHeight,
-      // 控制当前标签页
-      activeKey: '1',
-      // 保存流程和留言信息
-      steps: undefined,
-      // 基础信息
-      details: {},
-      // 是否已完成
-      allStepDown: false,
-      // 给XFormTable增加额外查询条件
-      fixedAddForm: {},
-      fixedQueryForm: {},
-      // 统计数据
-      chartData: {
-        // 流程进度
-        instructRateOfSuccessValue: 0
-      },
-      // 留言数据
-      messageList: [],
-      messageLoading: true,
-      workflowId: '',
-      direction: '',
-      visible: false
-    }
-  },
-  computed: {
-    ...mapState('account', { currUser: 'user' }),
-    ...mapState('setting', ['isMobile'])
-  },
-  props: {},
-  mounted () {
-    // this.init()
-  },
-  methods: {
-    // 内部组件更新了当前步骤后的回调
-    stepChanged () {
-      this.loading = true
-      this.reload()
-    },
-    // 获取所有步骤
-    getSteps () {
-      return postByServiceName(workFlowViewApi.getStepNoteAndHandler, {
-        workflowId: this.workflowId
-      })
-        .then(res => {
-          this.steps = res
-        }, err => {
-          console.log(err)
-        })
-    },
-    // 关闭抽屉的回调
-    onClose () {
-      if (this.$refs.workflowHandle !== undefined) {
-        this.$refs.workflowHandle.onClose()
-      }
-      this.visible = false
-      this.activeKey = '1'
-      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 reload () {
-      await this.getSteps()
-      await this.getBaseInfo()
-      this.fixedQueryForm.a_f_workflow_id = this.workflowId
-      this.fixedAddForm.a_f_workflow_id = this.workflowId
-    },
-    // 初始化两张固定表
-    async init ({ workflowId, direction, visible = true }) {
-      this.workflowId = workflowId
-      this.direction = direction
-      this.visible = visible
-      await this.reload()
-    },
-    // 切换标签页
-    changeTab (id) {
-      this.activeKey = id
-    },
-    // 提交完成后事件
-    success (res) {
-      this.visible = false
-      this.$emit('success', res)
-    },
-    // 提交完成后事件
-    nextClick (res) {
-      this.$emit('nextClick', res)
-    }
-  }
-}
-</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="85vw"
+    :placement="direction"
+    title="流程详情"
+    @close="onClose"
+  >
+    <div>
+      <!-- 基础信息 -->
+      <workflow-base-information
+        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="查看 / 编辑进度">
+              <WorkFlowHandle
+                v-if="
+                  activeKey === '1' &&
+                    details.f_state !== undefined &&
+                    steps !== undefined
+                "
+                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"
+                @success="success"
+                @nextClick="nextClick"
+              />
+            </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
+                    :workflowId="this.workflowId"
+                    :projectName="details.f_task_name"
+                    :data="messageList"
+                    :loading="messageLoading"
+                    @success="success"/>
+                </a-col>
+              </a-row>
+            </a-tab-pane>
+          </a-tabs>
+        </a-card>
+      </div>
+    </div>
+  </a-drawer>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import workflowBaseInformation from './WorkflowPageDetail/WorkFlowBaseInformation.vue'
+import WorkFlowHandle from './WorkflowPageDetail/WorkFlowHandle.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 WorkflowLog from './WorkflowPageDetail/WorkflowLog.vue'
+import LeaveMessage from './WorkflowPageDetail/LeaveMessage'
+
+export default {
+  name: 'WorkflowDetail',
+  components: {
+    workflowBaseInformation,
+    WorkFlowHandle,
+    XFormTable,
+    WorkflowLog,
+    LeaveMessage
+  },
+  data () {
+    return {
+      // 页面宽度
+      screenWidth: document.documentElement.clientWidth,
+      // 页面高度
+      screenHeight: document.documentElement.clientHeight,
+      // 控制当前标签页
+      activeKey: '1',
+      // 保存流程和留言信息
+      steps: undefined,
+      // 基础信息
+      details: {},
+      // 是否已完成
+      allStepDown: false,
+      // 给XFormTable增加额外查询条件
+      fixedAddForm: {},
+      fixedQueryForm: {},
+      // 统计数据
+      chartData: {
+        // 流程进度
+        instructRateOfSuccessValue: 0
+      },
+      // 留言数据
+      messageList: [],
+      messageLoading: true,
+      workflowId: '',
+      direction: '',
+      visible: false
+    }
+  },
+  computed: {
+    ...mapState('account', { currUser: 'user' }),
+    ...mapState('setting', ['isMobile'])
+  },
+  props: {},
+  mounted () {
+    // this.init()
+  },
+  methods: {
+    // 内部组件更新了当前步骤后的回调
+    stepChanged () {
+      this.loading = true
+      this.reload()
+    },
+    // 获取所有步骤
+    getSteps () {
+      return postByServiceName(workFlowViewApi.getStepNoteAndHandler, {
+        workflowId: this.workflowId
+      })
+        .then(res => {
+          this.steps = res
+        }, err => {
+          console.log(err)
+        })
+    },
+    // 关闭抽屉的回调
+    onClose () {
+      if (this.$refs.workflowHandle !== undefined) {
+        this.$refs.workflowHandle.onClose()
+      }
+      this.visible = false
+      this.activeKey = '1'
+      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 reload () {
+      await this.getSteps()
+      await this.getBaseInfo()
+      this.fixedQueryForm.a_f_workflow_id = this.workflowId
+      this.fixedAddForm.a_f_workflow_id = this.workflowId
+    },
+    // 初始化两张固定表
+    async init ({ workflowId, direction, visible = true }) {
+      this.workflowId = workflowId
+      this.direction = direction
+      this.visible = visible
+      await this.reload()
+    },
+    // 切换标签页
+    changeTab (id) {
+      this.activeKey = id
+    },
+    // 提交完成后事件
+    success (res) {
+      this.visible = false
+      this.$emit('success', res)
+    },
+    // 提交完成后事件
+    nextClick (res) {
+      this.$emit('nextClick', res)
+    }
+  }
+}
+</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>