refactor(workflow): adjust some styles

src/api/platform.js

@@ -164,55 +164,3 @@ export function getOperationResults (query) {
     }
   })
 }
-
-export function addOrUpdateWorkflow (data) {
-  return messageSend({
-    url: '/workflow/saveOrUpdate',
-    method: 'POST',
-    data
-  }, '操作')
-}
-
-export function deleteWorkflow ({ id }) {
-  return del({
-    url: '/workflow/saveOrUpdate',
-    method: 'POST',
-    data: { id }
-  })
-}
-
-export function getWorkflowDetail ({ id }) {
-  return request({
-    url: '/workflow/getBussinessData',
-    method: 'GET',
-    params: { workflowId: id }
-  })
-}
-
-export function getWorkflows (query) {
-  const { pageNum: pageIndex, pageSize, ...params } = query
-  return request({
-    url: '/workflow/pageByPropertis',
-    method: 'GET',
-    params: {
-      pageIndex, pageSize,
-      ...params
-    }
-  })
-}
-
-export function getWorkflow ({ id }) {
-  return request({
-    url: '/workflow/getById',
-    method: 'GET',
-    params: { workflowId: id }
-  })
-}
-
-export function resolveWorkflow ({ id }) {
-  return request({
-    url: '/workflow/getById',
-    method: 'GET',
-    params: { workflowId: id }
-  })
-}

src/api/workflow.js

@@ -0,0 +1,57 @@
+import store from '@/store'
+import {
+  JUMP_REVIEW,
+  State,
+  Access,
+  WorkflowState
+} from '@/constant'
+import request from '@/utils/request'
+import {
+  addTenant,
+  addUser
+} from '@/api/base'
+
+export function getAuditWorkflows (query, options) {
+  const { pageNum: pageIndex, pageSize } = query
+  const condition = { status: State.SUBMITTED }
+  const access = store.getters.access
+  const isFinal = access.has(Access.REVIEW_RELEASE_FINAL)
+  if (!isFinal || !JUMP_REVIEW) {
+    const arr = []
+    if (isFinal) {
+      arr.push(WorkflowState.FINAL_LEVEL)
+    }
+    if (access.has(Access.REVIEW_RELEASE_SECOND)) {
+      arr.push(WorkflowState.SECOND_LEVEL)
+    }
+    if (access.has(Access.REVIEW_RELEASE_FIRST)) {
+      arr.push(WorkflowState.FIRST_LEVEL)
+    }
+    condition.currentSeveralReviewedList = arr
+  }
+  return request({
+    url: '/workflow/pageByPropertis',
+    method: 'POST',
+    data: {
+      pageIndex, pageSize,
+      param: addTenant({
+        status: State.SUBMITTED,
+        ...condition
+      })
+    },
+    ...options
+  })
+}
+
+export function getWorkflowsByUser (query, options) {
+  const { pageNum: pageIndex, pageSize, ...params } = query
+  return request({
+    url: '/workflow/pageByPropertis',
+    method: 'POST',
+    data: {
+      pageIndex, pageSize,
+      param: addTenant(addUser(params, 'createBy'))
+    },
+    ...options
+  })
+}

src/components/table/Table/Column.vue

@@ -180,10 +180,10 @@ export default {
       return this.createTag(tag, data)
     },
     createTag (tag, data) {
-      const { label, ignore, ...tagProps } = tag
+      const { label, ignore, size = '', ...tagProps } = tag
       const { on } = this.schema
       return this.$createElement('el-tag', {
-        staticClass: on && !ignore ? 'o-tag u-pointer' : 'o-tag u-readonly',
+        staticClass: on && !ignore ? `o-tag ${size} u-pointer` : `o-tag ${size} u-readonly`,
         props: {
           size: 'medium',
           'disable-transitions': true,

src/router/index.js

@@ -157,6 +157,7 @@ export const asyncRoutes = [
         meta: { title: '按宽高比发布' }
       },
       {
+        name: 'workflow-mine',
         path: 'mine',
         component: () => import('@/views/screen/review/workflow/mine/index'),
         access: Access.MANAGE_CALENDAR,

src/scss/base/_cover.scss

@@ -49,3 +49,9 @@
 .el-message-box__input {
   padding-top: $spacing--3xs;
 }
+
+.el-table.sm {
+  .el-table__cell {
+    padding: $padding--sm 0;
+  }
+}

src/scss/bem/_layout.scss

@@ -62,8 +62,8 @@
   display: grid;
   grid-template-columns: repeat(4, minmax(160px, 1fr));
   grid-template-rows: max-content;
-  grid-row-gap: $spacing--xs;
-  grid-column-gap: $spacing--xs;
+  row-gap: $spacing--xs;
+  column-gap: $spacing--xs;
   min-height: 0;
   min-width: 0;
 
@@ -80,8 +80,8 @@
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
   grid-template-rows: max-content;
-  grid-row-gap: $spacing;
-  grid-column-gap: $spacing;
+  row-gap: $spacing;
+  column-gap: $spacing;
   align-items: start;
   min-height: 0;
   min-width: 0;

src/views/screen/review/workflow/api.js

@@ -1,11 +1,14 @@
+import store from '@/store'
+import {
+  JUMP_REVIEW,
+  Access
+} from '@/constant'
 import request, { tenantRequest } from '@/utils/request'
 import {
   confirmAndSend,
   del,
   send,
-  addTenantOrOrg,
-  addTenant,
-  addUser
+  addTenantOrOrg
 } from '@/api/base'
 
 export function getPublishHistory (query) {
@@ -35,30 +38,6 @@ export function cancelPublishByDevice (calendarReleaseHisId, deviceIds) {
   })
 }
 
-export function getWorkflowsByUser (query) {
-  const { pageNum: pageIndex, pageSize, ...params } = query
-  return request({
-    url: '/workflow/pageByPropertis',
-    method: 'POST',
-    data: {
-      pageIndex, pageSize,
-      param: addUser(params, 'createBy')
-    }
-  })
-}
-
-export function getWorkflows (query) {
-  const { pageNum: pageIndex, pageSize, ...params } = query
-  return request({
-    url: '/workflow/pageByPropertis',
-    method: 'POST',
-    data: {
-      pageIndex, pageSize,
-      param: addTenant(params)
-    }
-  })
-}
-
 export function deleteWorkflow (id) {
   return del({
     url: '/workflow/delete',
@@ -101,7 +80,18 @@ export function getWorkflowHistory (workflowId) {
   })
 }
 
+function resolveFinal (workflowNodeId) {
+  return send({
+    url: '/workflow/endReviewed',
+    method: 'GET',
+    params: { workflowNodeId }
+  })
+}
+
 export function resolveWorkflow (workflowNodeId) {
+  if (JUMP_REVIEW && store.getters.access.has(Access.REVIEW_RELEASE_FINAL)) {
+    return resolveFinal(workflowNodeId)
+  }
   return send({
     url: '/workflow/reviewedAgree',
     method: 'GET',
@@ -120,14 +110,6 @@ export function rejectWorkflow (workflowNodeId, reason) {
   })
 }
 
-export function resolveFinal (workflowNodeId) {
-  return send({
-    url: '/workflow/endReviewed',
-    method: 'GET',
-    params: { workflowNodeId }
-  })
-}
-
 export function getAssetsByProgramSnap (itemId) {
   return request({
     url: `/item/${itemId}/relation`,

src/views/screen/review/workflow/audit/index.vue

@@ -119,7 +119,6 @@ import {
   getWorkflow,
   resolveWorkflow,
   rejectWorkflow,
-  resolveFinal,
   getAssetsByProgramSnap
 } from '../api'
 
@@ -331,9 +330,6 @@ export default {
       this.$router.replace({ name: 'workflow-list' })
     },
     resolveWorkflow () {
-      if (this.workflow.currentSeveralReviewed < 3 && JUMP_REVIEW && this.access.has(Access.REVIEW_RELEASE_FINAL)) {
-        return resolveFinal(this.workflowNodeId)
-      }
       return resolveWorkflow(this.workflowNodeId)
     },
     onResolve () {

src/views/screen/review/workflow/components/PublishDetailDialog.vue

@@ -12,7 +12,7 @@
         />
       </div>
       <div class="l-flex__fill l-flex c-sibling-item--v">
-        <div class="c-sibling-item c-sidebar u-width--xl l-flex--col">
+        <div class="l-flex--col c-sibling-item c-sidebar u-width--xl">
           <schema-table
             ref="deviceTable"
             :schema="deviceSchema"

src/views/screen/review/workflow/components/WorkflowDialog.vue

@@ -12,12 +12,15 @@
         />
       </div>
       <div class="l-flex__fill l-flex c-sibling-item--v">
-        <div class="c-sibling-item c-sidebar u-width--lg l-flex--col">
+        <div class="l-flex--col c-sibling-item c-sidebar u-width">
           <schema-table :schema="deviceSchema" />
         </div>
-        <div class="l-flex__fill l-flex--col c-sibling-item far">
+        <div class="l-flex--col c-sidebar c-sibling-item far u-width--lg">
           <schema-table :schema="timeSchema" />
         </div>
+        <div class="l-flex__fill l-flex--col c-sibling-item far">
+          <schema-table :schema="historySchema" />
+        </div>
       </div>
       <material-dialog ref="materialDialog" />
     </template>
@@ -25,8 +28,12 @@
 </template>
 
 <script>
+import {
+  State,
+  WorkflowStateInfo
+} from '@/constant'
 import { parseDeploy } from '../utils'
-import { getWorkflowDetail } from '../api'
+import { getWorkflow } from '../api'
 
 export default {
   name: 'WorkflowDialog',
@@ -47,6 +54,9 @@ export default {
       },
       deviceSchema: {
         nonPagination: true,
+        props: {
+          size: 'small'
+        },
         list: this.getDevices,
         cols: [
           { prop: 'deviceName', label: '上播设备' }
@@ -54,17 +64,43 @@ export default {
       },
       timeSchema: {
         nonPagination: true,
+        props: {
+          size: 'small'
+        },
         list: this.getTimes,
         cols: [
           { prop: 'time', label: '上播时间' }
         ]
+      },
+      historySchema: {
+        nonPagination: true,
+        props: {
+          size: 'small'
+        },
+        list: this.getWorkflowHistory,
+        cols: [
+          { label: '节点', render: ({ severalReviewed }) => WorkflowStateInfo[severalReviewed], width: 60, align: 'center' },
+          { type: 'tag', render: ({ status, remark }) => status > State.READY
+            ? {
+              size: 'sm',
+              type: ['', 'primary', 'success', 'danger'][status],
+              label: ['', '待审核', '通过', '驳回'][status],
+              msg: remark
+            }
+            : null, width: 68 },
+          { prop: 'reviewedBy', label: '处理人', align: 'center' },
+          { prop: 'reviewedTime', label: '处理时间', width: 140, align: 'center' }
+        ]
       }
     }
   },
   methods: {
     show (workflowId) {
-      getWorkflowDetail(workflowId, { loading: true }).then(({ data }) => {
-        this.workflow = parseDeploy(data)
+      getWorkflow(workflowId, { loading: true }).then(({ data }) => {
+        this.workflow = {
+          ...parseDeploy(data.businessData),
+          workflowNodeDtoList: data.workflowNodeDtoList
+        }
         this.$refs.dialog.show()
       })
     },
@@ -77,6 +113,9 @@ export default {
     getTimes () {
       return Promise.resolve({ data: this.workflow.targetList })
     },
+    getWorkflowHistory () {
+      return Promise.resolve({ data: this.workflow.workflowNodeDtoList })
+    },
     onView ({ detail }) {
       this.$refs.materialDialog.showPublishTarget(detail)
     }

src/views/screen/review/workflow/components/WorkflowHistoryDialog.vue

@@ -1,48 +0,0 @@
-<template>
-  <table-dialog
-    ref="tableDialog"
-    title="流程历史"
-    :schema="historySchema"
-  />
-</template>
-
-<script>
-import {
-  State,
-  WorkflowStateInfo
-} from '@/constant'
-import { getWorkflowHistory } from '../api'
-
-export default {
-  name: 'WorkflowHistoryDialog',
-  data () {
-    return {
-      historySchema: {
-        nonPagination: true,
-        list: this.getWorkflowHistory,
-        cols: [
-          { label: '节点', render: ({ severalReviewed }) => WorkflowStateInfo[severalReviewed], width: 80, align: 'center' },
-          { type: 'tag', render: ({ status }) => status > State.READY
-            ? {
-              type: ['', 'primary', 'success', 'danger'][status],
-              label: ['', '待审核', '通过', '驳回'][status]
-            }
-            : null },
-          { prop: 'reviewedBy', label: '处理人', width: 160, align: 'center' },
-          { prop: 'reviewedTime', label: '时间', width: 160, align: 'center' },
-          { prop: 'remark', label: '备注' }
-        ]
-      }
-    }
-  },
-  methods: {
-    show (workflowId) {
-      this.$workflowId = workflowId
-      this.$refs.tableDialog.show()
-    },
-    getWorkflowHistory () {
-      return getWorkflowHistory(this.$workflowId)
-    }
-  }
-}
-</script>

src/views/screen/review/workflow/history/index.vue

@@ -10,7 +10,6 @@
       :schema="schema"
     />
     <publish-detail-dialog ref="publishDetailDialog" />
-    <workflow-history-dialog ref="workflowHistoryDialog" />
   </wrapper>
 </template>
 
@@ -22,18 +21,22 @@ import {
 } from '../api'
 import { parseDeploy } from '../utils'
 import PublishDetailDialog from '../components/PublishDetailDialog.vue'
-import WorkflowHistoryDialog from '../components/WorkflowHistoryDialog.vue'
 
 export default {
   name: 'ScheduleDeployHistory',
   components: {
-    PublishDetailDialog,
-    WorkflowHistoryDialog
+    PublishDetailDialog
   },
   data () {
     return {
       workflow: {},
       schema: {
+        listeners: {
+          'row-click': this.onDetail
+        },
+        props: {
+          'row-class-name': 'u-pointer'
+        },
         list: getPublishHistory,
         transform: this.transform,
         cols: [
@@ -70,9 +73,8 @@ export default {
           } },
           { type: 'invoke', render: [
             this.$store.getters.isGroupAdmin && { label: '下架', allow: ({ status }) => status === State.RESOLVED, on: this.onCancel },
-            { label: '详情', on: this.onDetail },
-            { label: '流程历史', allow: ({ workflowId }) => !!workflowId, on: this.onViewHistory }
-          ].filter(Boolean), width: 180 }
+            { label: '详情', on: this.onDetail }
+          ].filter(Boolean) }
         ]
       }
     }
@@ -96,9 +98,6 @@ export default {
     },
     onDetail (workflowHis) {
       this.$refs.publishDetailDialog.show(workflowHis)
-    },
-    onViewHistory ({ workflowId }) {
-      this.$refs.workflowHistoryDialog.show(workflowId)
     }
   }
 }

src/views/screen/review/workflow/index.vue

@@ -13,14 +13,8 @@
 </template>
 
 <script>
-import { mapGetters } from 'vuex'
-import {
-  JUMP_REVIEW,
-  State,
-  Access,
-  WorkflowStateInfo
-} from '@/constant'
-import { getWorkflows } from './api'
+import { WorkflowStateInfo } from '@/constant'
+import { getAuditWorkflows } from '@/api/workflow'
 
 export default {
   name: 'WorkflowList',
@@ -30,7 +24,10 @@ export default {
         listeners: {
           'row-click': this.onAudit
         },
-        list: this.getWorkflows,
+        props: {
+          'row-class-name': 'u-pointer'
+        },
+        list: getAuditWorkflows,
         cols: [
           { type: 'refresh' },
           { label: '当前节点', render: ({ currentSeveralReviewed }) => WorkflowStateInfo[currentSeveralReviewed], width: 100, align: 'center' },
@@ -45,40 +42,10 @@ export default {
       }
     }
   },
-  computed: {
-    ...mapGetters(['access']),
-    condition () {
-      const condition = { status: State.SUBMITTED }
-      const isFinal = this.access.has(Access.REVIEW_RELEASE_FINAL)
-      if (isFinal && JUMP_REVIEW) {
-        return condition
-      }
-      const arr = []
-      if (isFinal) {
-        arr.push(3)
-      }
-      if (this.access.has(Access.REVIEW_RELEASE_SECOND)) {
-        arr.push(2)
-      }
-      if (this.access.has(Access.REVIEW_RELEASE_FIRST)) {
-        arr.push(1)
-      }
-      return {
-        ...condition,
-        currentSeveralReviewedList: arr
-      }
-    }
-  },
   activated () {
     this.$refs.table.pageTo()
   },
   methods: {
-    getWorkflows (params) {
-      return getWorkflows({
-        ...this.condition,
-        ...params
-      })
-    },
     onAudit ({ id }) {
       this.$router.push({
         name: 'workflow-audit',

src/views/screen/review/workflow/mine/index.vue

@@ -29,7 +29,6 @@
       :schema="schema"
     />
     <workflow-dialog ref="workflowDialog" />
-    <workflow-history-dialog ref="workflowHistoryDialog" />
   </wrapper>
 </template>
 
@@ -38,18 +37,14 @@ import {
   State,
   WorkflowStateInfo
 } from '@/constant'
-import {
-  getWorkflowsByUser,
-  deleteWorkflow
-} from '../api'
+import { getWorkflowsByUser } from '@/api/workflow'
+import { deleteWorkflow } from '../api'
 import WorkflowDialog from '../components/WorkflowDialog.vue'
-import WorkflowHistoryDialog from '../components/WorkflowHistoryDialog.vue'
 
 export default {
   name: 'MyWorkflows',
   components: {
-    WorkflowDialog,
-    WorkflowHistoryDialog
+    WorkflowDialog
   },
   data () {
     return {
@@ -68,6 +63,9 @@ export default {
         listeners: {
           'row-click': this.onView
         },
+        props: {
+          'row-class-name': 'u-pointer'
+        },
         list: this.getWorkflows,
         cols: [
           { type: 'refresh' },
@@ -78,8 +76,7 @@ export default {
           { prop: 'updateTime', label: isSubmitted ? '最近审核' : '审核时间', width: 160, align: 'center' },
           { prop: 'createTime', label: '提交时间', width: 160, align: 'center' },
           { type: 'invoke', render: [
-            { label: '详情', on: this.onView },
-            { label: '流程历史', on: this.onViewHistory }
+            { label: '详情', on: this.onView }
           ] }
         ]
       }
@@ -101,9 +98,6 @@ export default {
     onView ({ id }) {
       this.$refs.workflowDialog.show(id)
     },
-    onViewHistory ({ id }) {
-      this.$refs.workflowHistoryDialog.show(id)
-    },
     onDel ({ id }) {
       deleteWorkflow(id).then(() => {
         this.$refs.table.decrease(1)
@@ -112,8 +106,3 @@ export default {
   }
 }
 </script>
-<style lang="scss" scoped>
-::v-deep .hide-expend .el-table__expand-icon {
-  display: none;
-}
-</style>