修改审批界面

src/client/DingTalkLogin.vue

@@ -96,7 +96,7 @@ export default {
           // 清除掉/pcapp路径的cookie
           $.removeCookie('token', { path: '/pcapp' });
 
-          $.cookie('token', loginInfo.token, { expires: 7, path: '/', secure: true, sameSite: 'Strict' });
+          // $.cookie('token', loginInfo.token, { expires: 7, path: '/', secure: true, sameSite: 'Strict' });
 
           $('#input-pwd').attr('type', 'text').val('');
           if (_self.redirectUrl != '' && _self.redirectUrl.length > 0) {

src/client/LoginService.js

@@ -24,7 +24,7 @@ export default {
 
     // bug fixed by jack
     // 把cookies的path属性设置成“/”。在指定路径的时候，凡是来自同一服务器，URL里有相同路径的所有WEB页面都可以共享cookies。
-    $.cookie('token', loginInfo.token, { expires: 7, path: '/', secure: true, sameSite: 'Strict' });
+    // $.cookie('token', loginInfo.token, { expires: 7, path: '/', secure: true, sameSite: 'Strict' });
 
     _self.setLocalStorage(loginInfo);
 

src/common/Common.js

@@ -239,12 +239,12 @@ export default {
     });
     $.removeCookie('token', { path: '/' });
     $.removeCookie('token', { path: '/app' });
-    $.cookie('token', loginInfo.token, {
-      expires: 7,
-      path: '/',
-      secure: true,
-      sameSite: 'Strict',
-    });
+    // $.cookie('token', loginInfo.token, {
+    //   expires: 7,
+    //   path: '/',
+    //   secure: true,
+    //   sameSite: 'Strict',
+    // });
   },
   clearLocalStorage: function () {
     // 清理localStorage时需要保留的参数列表

src/workflow/ApprovedWorkflow.vue

@@ -1,503 +1,185 @@
 <template>
-  <div>
-    <div class="container-fluid">
-      <div class="row m-row">
-        <div class="col-md-12 col-sm-12 col-xs-12">
-          <input
-            v-model="taskQueryParam.condition"
-            autocomplete="off"
-            type="text"
-            :placeholder="$t('lang.ApprovedWorkflow.describe1')"
-            class="form-control"
-          />
-        </div>
-      </div>
-
-      <div
-        v-if="taskQueryParam.advancedQuery"
-        class="row m-row"
-      >
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.ApprovedWorkflow.startTime") }}</label>
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime
-            v-model="startAfter"
-          />
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime
-            v-model="startBefore"
-          />
-        </div>
-      </div>
-
-      <div
-        v-if="taskQueryParam.advancedQuery"
-        class="row m-row"
-      >
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.ApprovedWorkflow.completionTime") }}</label>
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime
-            v-model="finishAfter"
-          />
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime
-            v-model="finishBefore"
-          />
-        </div>
-      </div>
-
-      <div
-        v-if="taskQueryParam.advancedQuery"
-        class="row m-row"
-      >
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.ApprovedWorkflow.approvalOriginator") }}</label>
-        </div>
-        <div class="col-md-10 col-sm-10 col-xs-8">
-          <input
-            id="applyUser"
-            v-model="userName"
-            autocomplete="off"
-            type="text"
-            class="form-control"
-          />
-        </div>
-      </div>
-
-      <div class="row m-row">
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.ApprovedWorkflow.subject") }}</label>
-        </div>
-        <div class="col-md-10 col-sm-10 col-xs-8">
-          <select
-            v-model="deploymentId"
-            class="form-control"
-          >
-            <option value="">{{ $t("lang.ApprovedWorkflow.all") }}</option>
-            <option
-              v-for="item in approveType"
-              :key="item.deploymentId"
-              :value="item.deploymentId"
-            >
-              {{ item.name }}
-            </option>
-          </select>
-        </div>
-      </div>
-
-      <div class="row m-row">
-        <div class="col-md-12 col-sm-12 col-xs-10">
-          <button
-            role="button"
-            target="_self"
-            class="btn btn-primary"
-            @click="searchApproved()"
-          >
-            {{ $t("lang.ApprovedWorkflow.search") }}
-          </button>
-          <a
-            class="form-label"
-            @click="taskQueryParam.advancedQuery = !taskQueryParam.advancedQuery"
-          >{{ (taskQueryParam.advancedQuery) ? $t("lang.ApprovedWorkflow.closeAdvancedSearch") : $t("lang.ApprovedWorkflow.advancedSearch") }}</a>
-          <a
-            id="clearSearchCondition"
-            class="form-label"
-            @click="clean()"
-          >{{ $t("lang.ApprovedWorkflow.clearSearchCriteria") }}</a>
-          <span id="choiceStatus">
-            <button
-              class="btn"
-              :class="{&quot;btn-info active&quot;: taskQueryParam.processStatusQuery == &quot;ALL&quot;}"
-              @click="choiceStatus('ALL')"
-            >{{ $t("lang.ApprovedWorkflow.all") }}</button>
-            <button
-              class="btn"
-              :class="{&quot;btn-info active&quot;: taskQueryParam.processStatusQuery == &quot;FINISH&quot;}"
-              @click="choiceStatus('FINISH')"
-            >{{ $t("lang.ApprovedWorkflow.done") }}</button>
-            <button
-              class="btn"
-              :class="{&quot;btn-info active&quot;: taskQueryParam.processStatusQuery == &quot;RUNNING&quot;}"
-              @click="choiceStatus('RUNNING')"
-            >{{ $t("lang.ApprovedWorkflow.inProcess") }}</button>
-          </span>
-        </div>
-      </div>
-
-      <div class="row m-row">
-        <div class="table-responsive">
-          <table class="table table-bordered table-hover">
-            <thead>
-              <tr>
-                <td>{{ $t("lang.ApprovedWorkflow.documentCode") }}</td>
-                <td>{{ $t("lang.ApprovedWorkflow.subject") }}</td>
-                <td>{{ $t("lang.ApprovedWorkflow.approvalSummary") }}</td>
-                <td>{{ $t("lang.ApprovedWorkflow.originatingTime") }}</td>
-                <td>{{ $t("lang.ApprovedWorkflow.completionTime") }}</td>
-                <td>{{ $t("lang.ApprovedWorkflow.status") }}</td>
-              </tr>
-            </thead>
-            <tbody>
-              <tr
-                v-for="item in historicTaskInfos.historicTaskInfos"
-                :key="item.id"
-                class="m-tr"
-                @click="selectTaskInfo(item)"
-              >
-                <td>
-                  {{ item.no }}
-                </td>
-                <!-- <td>
-                  {{ item.title }}
-                </td>
-                <td>
-                  <span style="white-space: pre-line">{{ item.content }}</span>
-                </td> -->
-                <td>
-                  <span v-if="item.category != 'CurdWindow'">
-                    {{ item.name }}
-                  </span>
-                  <span v-else>
-                    {{ item.title }}
-                  </span>
-                </td>
-                <td>
-                  <span v-if="item.category != 'CurdWindow'" style="white-space: pre-line">{{ item.description }}</span>
-                  <span v-else style="white-space: pre-line">{{ item.content }}</span>
-                </td>
-                <td>
-                  {{ item.startDate }}
-                </td>
-                <td>
-                  {{ item.endDate }}
-                </td>
-                <td>
-                  {{ item.documentStatus == '进行中' ? $t("lang.ApprovedWorkflow.inProcess"):$t("lang.ApprovedWorkflow.done") }}
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-      </div>
-      <VueBootstrapPagination
-        :pagination="pagination"
-        :callback="changePage"
+  <a-row type="flex" justify="space-between">
+    <a-col>
+      <a-input-search
+        v-model:value="searchParams.condition"
+        :placeholder="$t('lang.NeedApproveWorkflow.describe1')"
+        enter-button="搜索"
+        allow-clear
+        style="width: 300px;"
+        @search="searchDatas"
       />
-    </div>
-    <Loading v-if="loading" />
-  </div>
+    </a-col>
+    <a-col>
+      <WorkflowType @get-type="getTypeNo" />
+      <WorkflowSearch :function-type="3" @get-search-params="searchWorkflow" />
+    </a-col>
+  </a-row>
+  <CommonTable
+    ref="table"
+    :columns="approveColumns"
+    :data-source="approveDatas"
+    @get-pager="getPageParams"
+  >
+    <template #bodyCell="{ column, record }">
+      <template v-if="column.key === 'title'">
+        <span v-if="record.category != 'CurdWindow'">
+          {{ record.name }}
+        </span>
+        <span v-else>
+          {{ record.title }}
+        </span>
+      </template>
+      <template v-if="column.key === 'description'">
+        <span
+          v-if="record.category != 'CurdWindow'"
+          style="white-space: pre-line"
+        >{{ record.description }}</span>
+        <span v-else style="white-space: pre-line">{{ record.content }}</span>
+      </template>
+      <template v-if="column.key === 'operation'">
+        <a-button type="link" @click="selectTaskInfo(record)">
+          {{ $t("lang.NeedApproveWorkflow.viewTasks") }}
+        </a-button>
+      </template>
+    </template>
+  </CommonTable>
+  <Loading v-if="isLoading" />
+  <CustomerTask
+    ref="customerTask"
+    :task-id="selectedTaskId"
+    @closed="() => searchDatas"
+  />
 </template>
 
-<script>
-import Common from '../common/Common.js';
-
-
-
-
-import FrameWindow from '../widget/FrameWindow.vue';
-import WindowService from '../common/WindowService.js';
-import { Notify, Uuid } from 'pc-component-v3';
+<script setup>
+import { ref, reactive, defineEmits, onMounted } from 'vue';
+import Common from '../common/Common';
+import WorkflowType from './WorkflowType.vue';
+import WorkflowSearch from './WorkflowSearch.vue';
+import CommonTable from '../common/CommonTable.vue';
+import { ajaxApi } from '../api/workflow/workflow.js';
+import { message } from 'ant-design-vue';
+import { approvedColumns } from './configData.js';
 import TaskOpenUtil from './TaskOpenUtil.js';
-import * as dayjs from 'dayjs';
-
+import WindowService from '../common/WindowService.js';
+import CustomerTask from './CustomerTask.vue';
+import { Notify } from 'pc-component-v3';
+
+const emit = defineEmits(['refreshStasticCount']);
+const total = ref(0);
+const table = ref(null);
+const customerTask = ref(null);
+const selectedTaskId = ref(null);
+const isLoading = ref(false);
+const approveDatas = ref([]);
+const approveColumns = ref(approvedColumns);
+const searchParams = ref({});
+const filterParams = ref({});
+const pager = reactive({
+  start: 1,
+  length: 20,
+});
+
+onMounted(() => {
+  searchDatas();
+});
+
+// 查询,回到第一页
+const searchDatas = () => {
+  table.value.backFirstPage();
+};
 
-export default {
+// 获取分页
+const getPageParams = (start, length) => {
+  pager.start = (start - 1) * length;
+  pager.length = length;
+  const params = { ...searchParams.value, ...filterParams.value, ...pager };
+  searchApprove(params);
+};
 
-  components: {
-  },
-  data: function () {
-    return {
-      'defaultStartAfter': '',   //默认开始日期
-      'defaultStartBefore': '',
-      'defaultFinishAfter': '',   //默认结束日期
-      'defaultFinishBefore': '',
-      'startAfter': '',          //开始日期
-      'startBefore': '',
-      'finishAfter': '',          //结束日期
-      'finishBefore': '',
-      'taskQueryParam': { 'processStatusQuery': 'ALL' },    	//查询条件       
-      'historicTaskInfos': [],
-      'deploymentId': '',
-      'userName': '',
-      'approveType': [],
-      pagination: {
-        total: 0,
-        per_page: 20,    // required
-        current_page: 1, // required
-        last_page: 0,    // required
-      },
-      loading: false,
-    };
-  },
-  mounted: function () {
-    this.init();
-  },
+// 获取类型no
+const getTypeNo = windowNo => {
+  searchParams.value.windowNo = windowNo;
+  searchDatas();
+};
 
-  methods: {
-    // 加载数据
-    init: function () {
-      var _self = this;
-      _self.loading=true;
-      _self.defaultStartAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultStartBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.taskQueryParam = {
-        'condition': '',         //查询条件(主题、文件编码、正文内容、审批意见).
-        'startAfter': _self.defaultStartAfter,
-        'startBefore': _self.defaultStartBefore,
-        'advancedQuery': false,    //是否高级查询
-        //"startUserId" : "",     //审批单发起人
-        'deploymentId': '',      //工作流部署Id
-        'processStatusQuery': 'ALL',  //审批状态
-        'range': {               //查询区间
-          'length': 100,
-          'start': 0,
-        },
-      };
-      console.log(JSON.stringify(_self.taskQueryParam));
-      $.ajax({
-        url: Common.getApiURL('WorkflowResource/approveType'),
-        type: 'GET',
-        dataType: 'json',
-        beforeSend: function (request) {
-          Common.addTokenToRequest(request);
-        },
-        success: function (data) {
-          _self.loading=false;
-          _self.approveType = data;
-          _self.searchApproved();
-        },
-        error: function (XMLHttpRequest, textStatus, errorThrown) {
-          _self.loading=false;
-          Common.processException(XMLHttpRequest, textStatus, errorThrown);
-        },
-      });
-    },
-    getStartUserId: function () {
-      var _self = this;
-      _self.loading=true;
-      if (_self.userName != null && _self.userName != '') {
-        var infoQueryParam = {};
-        infoQueryParam.infoWindowNo = 11531;
-        infoQueryParam.start = 0;
-        infoQueryParam.length = 1;
-        infoQueryParam.sortClause = '';
-        infoQueryParam.infoFilterFieldValues = [];
-        infoQueryParam.infoFilterFieldValues[0] = {};
-        infoQueryParam.infoFilterFieldValues[0].infoFilterFieldId = 11532;
-        infoQueryParam.infoFilterFieldValues[0].value1 = _self.userName;
-        $.ajax({
-          url: Common.getApiURL('InfoWindowResource/QueryInfoWindowData2'),
-          type: 'post',
-          dataType: 'json',
-          beforeSend: function (request) {
-            Common.addTokenToRequest(request);
-          },
-          contentType: 'application/json',
-          data: JSON.stringify(infoQueryParam),
-          async: false,
-          success: function (data) {
-            _self.loading=false;
-            _self.taskQueryParam.startUserId = '';
-            if (data.dataList[0].id != null) {
-              _self.taskQueryParam.startUserId = data.dataList[0].id;
-            }
+// 通过高级查询搜索
+const searchWorkflow = value => {
+  filterParams.value = value;
+  searchDatas();
+};
 
-          },
-          error: function (XMLHttpRequest, textStatus, errorThrown) {
-            _self.loading=false;
-            _self.$refs.common.processException(XMLHttpRequest, textStatus, errorThrown);
-          },
-        });
+// 查询数据API
+const searchApprove = params => {
+  isLoading.value = true;
+  const url = 'api/WorkflowResource/approved';
+  ajaxApi(url, params).then(
+    success => {
+      if (success.errorCode === 0) {
+        if (success.datas && success.datas.length > 0) {
+          success.datas.forEach(item => {
+            item.content = parseContent(item.content);
+          });
+          approveDatas.value = success.datas;
+        } else {
+          approveDatas.value = [];
+        }
+      } else {
+        message.warning(success.errorMessage);
       }
+      isLoading.value = false;
     },
-    searchApproved: function () {
-      var _self = this;
-      _self.loading=true;
-      _self.taskQueryParam.range.start = 0;
-      _self.taskQueryParam.range.length = _self.pagination.per_page;
-      _self.pagination.current_page = 1;
-      _self.taskQueryParam.startAfter = _self.defaultStartAfter;
-      _self.taskQueryParam.startBefore = _self.defaultStartBefore;
-      _self.taskQueryParam.finishAfter = _self.defaultFinishAfter;
-      _self.taskQueryParam.finishBefore = _self.defaultFinishBefore;
-      _self.taskQueryParam.deploymentId = _self.deploymentId;
-      if (_self.taskQueryParam.advancedQuery) {
-        _self.getStartUserId();
-        _self.taskQueryParam.startAfter = _self.startAfter;
-        _self.taskQueryParam.startBefore = _self.startBefore;
-        _self.taskQueryParam.finishAfter = _self.finishAfter;
-        _self.taskQueryParam.finishBefore = _self.finishBefore;
-      }
-      console.log(JSON.stringify(_self.taskQueryParam));
-      $.ajax({
-        url: Common.getApiURL('WorkflowResource/approved'),
-        type: 'post',
-        dataType: 'json',
-        contentType: 'application/json',
-        beforeSend: function (request) {
-          Common.addTokenToRequest(request);
-        },
-        data: JSON.stringify(_self.taskQueryParam),
-        success: function (data) {
-          _self.loading=false;
-          _self.historicTaskInfos = data;
-          _self.historicTaskInfos.historicTaskInfos.forEach(item => {
-            try{
-              var content = JSON.parse(item.content);
-              var parentForm = '';
-              content.parentForm.forEach(item => {
-                parentForm =parentForm + item.title+':'+item.content+'，\n';
-              });
-              item.content = parentForm;
-            // eslint-disable-next-line no-empty
-            }catch(e){
-              
-            }
-          });
-          _self.pagination.total = data.totalCount;
-          _self.pagination.last_page = Math.ceil(data.totalCount / _self.taskQueryParam.range.length);
-          console.log('totalCount=' + _self.pagination.total);
-          console.log('totalPage=' + _self.pagination.last_page);
-        },
-        error: function (XMLHttpRequest, textStatus, errorThrown) {
-          _self.loading=false;
-          Common.processException(XMLHttpRequest, textStatus, errorThrown);
-        },
-      });
-
+    error => {
+      isLoading.value = false;
+      Common.processException(error);
     },
-    //是否开启高级查询
-    isAdvancedQuery: function (flag) {
-      let _self = this;
-      _self.taskQueryParam.advancedQuery = flag;
-      if (!flag) {
-        //初始化日期
-        _self.taskQueryParam.startAfter = _self.defaultStartAfter;
-        _self.taskQueryParam.startBefore = _self.defaultStartBefore;
+  );
+};
 
+// 选择了taskInfo
+const selectTaskInfo = taskInfo => {
+  TaskOpenUtil.openTask(taskInfo).then(
+    successData => {
+      if (successData.type === 'newWindow') {
+        WindowService.open(successData.url, '待处理', function () {
+          searchDatas();
+          emit('refreshStasticCount');
+        });
+      } else if (successData.type === 'customerTask') {
+        // 打开自定义的界面
+        selectedTaskId.value = taskInfo.id;
+        customerTask.value.show();
+        searchDatas();
+        emit('refreshStasticCount');
       }
     },
-    showTaskInfo: function (id) {
-      var _self = this;
-      _self.taskInfoId = id;
-
-    },
-    clean: function () {   //清空搜索条件
-      var _self = this;
-      _self.userName = '';
-      _self.taskQueryParam.condition = '';
-      _self.defaultStartAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultStartBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.startAfter = '';
-      _self.startBefore = '';
-      _self.finishAfter = '';
-      _self.finishBefore = '';
-    },
-    choiceStatus: function (status) {
-      this.taskQueryParam.processStatusQuery = status;
-      this.searchApproved();
-    },
-    changePage: function () {
-      var _self = this;
-      _self.loading=true;
-      _self.taskQueryParam.range.start = _self.pagination.per_page * (parseInt(_self.pagination.current_page) - 1);
-      _self.taskQueryParam.startAfter = _self.defaultStartAfter;
-      _self.taskQueryParam.startBefore = _self.defaultStartBefore;
-      _self.taskQueryParam.finishAfter = _self.defaultFinishAfter;
-      _self.taskQueryParam.finishBefore = _self.defaultFinishBefore;
-      if (_self.taskQueryParam.advancedQuery) {
-        _self.taskQueryParam.startAfter = _self.startAfter;
-        _self.taskQueryParam.startBefore = _self.startBefore;
-        _self.taskQueryParam.finishAfter = _self.finishAfter;
-        _self.taskQueryParam.finishBefore = _self.finishBefore;
+    errorData => {
+      if (errorData != null) {
+        Notify.error(errorData.title, errorData.message, false);
       }
-      console.log(JSON.stringify(_self.taskQueryParam));
-      $.ajax({
-        url: Common.getApiURL('WorkflowResource/approved'),
-        type: 'post',
-        dataType: 'json',
-        contentType: 'application/json',
-        beforeSend: function (request) {
-          Common.addTokenToRequest(request);
-        },
-        data: JSON.stringify(_self.taskQueryParam),
-        success: function (data) {
-          _self.loading=false;
-          _self.historicTaskInfos = data;
-          _self.historicTaskInfos.historicTaskInfos.forEach(item => {
-            try{
-              var content = JSON.parse(item.content);
-              var parentForm = '';
-              content.parentForm.forEach(item => {
-                parentForm =parentForm + item.title+':'+item.content+'，\n';
-              });
-              item.content = parentForm;
-            // eslint-disable-next-line no-empty
-            }catch(e){
-              
-            }
-            
-          });
-          _self.pagination.total = data.totalCount;
-          _self.pagination.last_page = Math.ceil(data.totalCount / _self.taskQueryParam.range.length);
-        },
-        error: function (XMLHttpRequest, textStatus, errorThrown) {
-          _self.loading=false;
-          _self.$refs.common.processException(XMLHttpRequest, textStatus, errorThrown);
-        },
-      });
     },
+  );
+};
 
-
-    
-    // 选择了taskInfo
-    selectTaskInfo: function (taskInfo) {
-      let _self = this;
-      TaskOpenUtil.openHistoryTask(taskInfo).then(successData => {
-        if(successData.type === 'newWindow'){
-          WindowService.open(successData.url, '已处理的', function(){
-            _self.$emit('refreshStasticCount');
-            _self.searchApproved();
-          });
-        }else if(successData.type === 'customerTask'){
-          // 打开自定义的界面
-          _self.selectedTaskId = taskInfo.id;
-          _self.$refs.customerTask.show();
-          _self.$emit('refreshStasticCount');
-          _self.searchApproved();
-        }
-      }, errorData => {
-        if(errorData != null){
-          Notify.error(errorData.title, errorData.message, false);
-        }
+// 处理content json
+const parseContent = content => {
+  const x = content;
+  try {
+    let content = JSON.parse(x);
+    let parentForm = '';
+    if (content != null && content.parentForm != null) {
+      content.parentForm.forEach(item => {
+        parentForm = parentForm + item.title + ':' + item.content + '，\n';
       });
-    },
-
-
-  },
+      return parentForm;
+    } else {
+      return null;
+    }
+    // eslint-disable-next-line no-empty
+  } catch (e) {}
 };
 </script>
 
 <style scoped>
-.form-label {
-    margin-left: 10px;
-    cursor: pointer;
-}
-
-.m-tr {
-    cursor: pointer;
-}
 </style>

src/workflow/CopyTaskWorkflow.vue

@@ -1,569 +1,217 @@
 <template>
-  <div>
-    <div class="container-fluid">
-      <div class="row m-row">
-        <div class="col-md-12 col-sm-12 col-xs-12">
-          <input
-            v-model="taskQueryParam.condition"
-            autocomplete="off"
-            type="text"
-            :placeholder="$t('lang.CopyTaskWorkflow.describe1')"
-            class="form-control"
-          />
-        </div>
-      </div>
-
-      <div
-        v-if="taskQueryParam.advancedQuery"
-        class="row m-row"
-      >
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.CopyTaskWorkflow.startTime") }}</label>
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime v-model="startAfter" />
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime v-model="startBefore" />
-        </div>
-      </div>
-
-      <div
-        v-if="taskQueryParam.advancedQuery"
-        class="row m-row"
-      >
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.CopyTaskWorkflow.completionTime") }}</label>
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime v-model="finishAfter" />
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime v-model="finishBefore" />
-        </div>
-      </div>
-
-      <div
-        v-if="taskQueryParam.advancedQuery"
-        class="row m-row"
+  <a-row type="flex" justify="space-between">
+    <a-col>
+      <a-input-search
+        v-model:value="searchParams.condition"
+        :placeholder="$t('lang.NeedApproveWorkflow.describe1')"
+        enter-button="搜索"
+        allow-clear
+        style="width: 300px"
+        @search="queryDatas"
+      />
+    </a-col>
+    <a-col>
+      <a-select
+        v-model:value="searchParams.processStatusQuery"
+        allow-clear
+        placeholder="请选择审批状态"
+        style="width: 200px"
+        @change="statusChange"
       >
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.CopyTaskWorkflow.approvalOriginator") }}</label>
-        </div>
-        <div class="col-md-10 col-sm-10 col-xs-8">
-          <input
-            id="applyUser"
-            v-model="userName"
-            autocomplete="off"
-            type="text"
-            class="form-control"
-          />
-        </div>
-      </div>
-
-      <div class="row m-row">
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.CopyTaskWorkflow.subject") }}</label>
-        </div>
-        <div class="col-md-10 col-sm-10 col-xs-8">
-          <select
-            v-model="deploymentId"
-            class="form-control"
-          >
-            <option value="">{{ $t("lang.CopyTaskWorkflow.all") }}</option>
-            <option
-              v-for="item in approveType"
-              :key="item.deploymentId"
-              :value="item.deploymentId"
-            >
-              {{ item.name }}
-            </option>
-          </select>
-        </div>
-      </div>
-
-      <div class="row m-row">
-        <div class="col-md-12 col-sm-12 col-xs-10">
-          <button
-            role="button"
-            target="_self"
-            class="btn btn-primary"
-            @click="searchCopyTask()"
-          >
-            {{ $t("lang.CopyTaskWorkflow.search") }}
-          </button>
-          <a
-            class="form-label"
-            @click="taskQueryParam.advancedQuery = !taskQueryParam.advancedQuery"
-          >
-
-            {{ (taskQueryParam.advancedQuery) ? $t("lang.CopyTaskWorkflow.closeAdvancedSearch") : $t("lang.CopyTaskWorkflow.advancedSearch") }}
-
-          </a>
-          <a
-            id="clearSearchCondition"
-            class="form-label"
-            @click="clean()"
-          >{{ $t("lang.CopyTaskWorkflow.clearSearchCriteria") }}</a>
-          <span id="choiceStatus">
-            <button
-              class="btn"
-              :class="{&quot;btn-info active&quot;: taskQueryParam.processStatusQuery == &quot;ALL&quot;}"
-              @click="choiceStatus('ALL')"
-            >{{ $t("lang.CopyTaskWorkflow.all") }}</button>
-            <button
-              class="btn"
-              :class="{&quot;btn-info active&quot;: taskQueryParam.processStatusQuery == &quot;FINISH&quot;}"
-              @click="choiceStatus('FINISH')"
-            >{{ $t("lang.CopyTaskWorkflow.completed") }}</button>
-            <button
-              class="btn"
-              :class="{&quot;btn-info active&quot;: taskQueryParam.processStatusQuery == &quot;RUNNING&quot;}"
-              @click="choiceStatus('RUNNING')"
-            >{{ $t("lang.CopyTaskWorkflow.haveInHand") }}</button>
-            <a-button type="link" @click="completeApproval">全部完成审阅</a-button>
-          </span>
-        </div>
-      </div>
-
-      <div class="row m-row">
-        <div class="table-responsive">
-          <table class="table table-bordered table-hover">
-            <thead>
-              <tr>
-                <td>{{ $t("lang.CopyTaskWorkflow.documentCode") }}</td>
-                <td>{{ $t("lang.CopyTaskWorkflow.subject") }}</td>
-                <td>{{ $t("lang.CopyTaskWorkflow.approvalSummary") }}</td>
-                <td>{{ $t("lang.CopyTaskWorkflow.originatingTime") }}</td>
-                <td>{{ $t("lang.CopyTaskWorkflow.completionTime") }}</td>
-                <td>{{ $t("lang.CopyTaskWorkflow.status") }}</td>
-              </tr>
-            </thead>
-            <tbody>
-              <tr
-                v-for="item in copyTaskInfos.copyTaskInfo"
-                :key="item.id"
-                class="m-tr"
-                @click="selectTaskInfo(item)"
-              >
-                <td>
-                  {{ item.no }}
-                </td>
-                <td>
-                  {{ item.title }}
-                </td>
-                <td>
-                  <span style="white-space: pre-line">{{ item.content }}</span>
-                </td>
-                <td>
-                  {{ item.startDate }}
-                </td>
-                <td>
-                  {{ item.endDate }}
-                </td>
-                <td>
-                  {{ item.documentStatus }}
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
+        <a-select-option value="ALL">全部</a-select-option>
+        <a-select-option value="FINISH">审批完成</a-select-option>
+        <a-select-option value="RUNNING">审批中</a-select-option>
+      </a-select>
+    </a-col>
+  </a-row>
+  <a-table
+    sticky
+    bordered
+    :pagination="false"
+    :columns="approveColumns"
+    :data-source="approveDatas"
+  >
+    <template #bodyCell="{ column, record }">
+      <template v-if="column.key === 'title'">
+        <span v-if="record.category != 'CurdWindow'">
+          {{ record.name }}
+        </span>
+        <span v-else>
+          {{ record.title }}
+        </span>
+      </template>
+      <template v-if="column.key === 'description'">
+        <span
+          v-if="record.category != 'CurdWindow'"
+          style="white-space: pre-line"
+        >{{ record.description }}</span>
+        <span v-else style="white-space: pre-line">{{ record.content }}</span>
+      </template>
+      <template v-if="column.key === 'documentStatus'">
+        <a-tag v-if="record.documentStatus == '已完成'" color="success">
+          已完成
+        </a-tag>
+        <a-tag v-if="record.documentStatus == '进行中'" color="processing">
+          进行中
+        </a-tag>
+      </template>
+      <template v-if="column.key === 'operation'">
+        <a-button type="link" @click="selectTaskInfo(record)">
+          {{ $t("lang.NeedApproveWorkflow.viewTasks") }}
+        </a-button>
+      </template>
+    </template>
+    <template v-if="approveDatas.length > 0" #footer>
+      <div style="text-align: center">
+        <a-button type="link" @click="loadMore">加载更多</a-button>
       </div>
-      <VueBootstrapPagination
-        :pagination="pagination"
-        :callback="changePage"
-      />
-    </div>
-    <Loading v-if="loading" />
-  </div>
+    </template>
+  </a-table>
+  <Loading v-if="isLoading" />
+  <CustomerTask
+    ref="customerTask"
+    :task-id="selectedTaskId"
+    @closed="() => searchDatas"
+  />
 </template>
 
-<script>
-import Common from '../common/Common.js';
-import WindowService from '../common/WindowService.js';
+<script setup>
+import { ref, reactive, defineEmits, onMounted } from 'vue';
+import Common from '../common/Common';
+import { ajaxApi } from '../api/workflow/workflow.js';
+import { message } from 'ant-design-vue';
+import { approvedColumns } from './configData.js';
 import TaskOpenUtil from './TaskOpenUtil.js';
-import { Notify, Uuid } from 'pc-component-v3';
-import * as dayjs from 'dayjs';
-
-export default {
-
-  components: {
-  },
-  emits:['refreshStasticCount'],
-  data: function () {
-    return {
-      defaultStartAfter: '', //默认开始日期
-      defaultStartBefore: '',
-      defaultFinishAfter: '', //默认结束日期
-      defaultFinishBefore: '',
-      startAfter: '', //开始日期
-      startBefore: '',
-      finishAfter: '', //结束日期
-      finishBefore: '',
-      taskQueryParam: { processStatusQuery: 'ALL' }, //查询条件
-      copyTaskInfos: '',
-      deploymentId: '',
-      userName: '',
-      approveType: [],
-      pagination: {
-        total: 0,
-        per_page: 12, // required
-        current_page: 1, // required
-        last_page: 0, // required
-      },
-      loading: false,
-    };
-  },
-  mounted: function () {
-    this.init();
-  },
-
-  methods: {
-    // 加载数据
-    init: function () {
-      var _self = this;
-      _self.loading = true;
-      _self.defaultStartAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultStartBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.taskQueryParam = {
-        condition: '', //查询条件(主题、文件编码、正文内容、审批意见).
-        startAfter: _self.defaultStartAfter,
-        startBefore: _self.defaultStartBefore,
-        advancedQuery: false, //是否高级查询
-        //"startUserId" : "",     //审批单发起人
-        deploymentId: '', //工作流部署Id
-        processStatusQuery: 'RUNNING', //审批状态
-        range: {
-          //查询区间
-          length: 100,
-          start: 0,
-        },
-      };
-
-      $.ajax({
-        url: Common.getApiURL('WorkflowResource/approveType'),
-        type: 'GET',
-        dataType: 'json',
-        beforeSend: function (request) {
-          Common.addTokenToRequest(request);
-        },
-        success: function (data) {
-          _self.loading = false;
-          _self.approveType = data;
-          _self.searchCopyTask();
-        },
-        error: function (XMLHttpRequest, textStatus, errorThrown) {
-          _self.loading = false;
-          Common.processException(XMLHttpRequest, textStatus, errorThrown);
-        },
-      });
-    },
-
-    getStartUserId: function () {
-      var _self = this;
+import WindowService from '../common/WindowService.js';
+import CustomerTask from './CustomerTask.vue';
+import { Notify } from 'pc-component-v3';
+
+const emit = defineEmits(['refreshStasticCount']);
+const customerTask = ref(null);
+const selectedTaskId = ref(null);
+const isLoading = ref(false);
+const approveDatas = ref([]);
+const approveColumns = ref(approvedColumns);
+const searchParams = ref({
+  condition: '',
+  processStatusQuery: 'ALL',
+});
+const pager = reactive({
+  start: 0,
+  length: 10,
+});
+
+onMounted(() => {
+  searchDatas();
+});
+
+// 查询条件时从0开始
+const queryDatas = () => {
+  pager.start = 0;
+  searchDatas(true);
+};
 
-      _self.loading = true;
+// 加载更多时push
+const loadMore = () => {
+  pager.start += 10;
+  searchDatas();
+};
 
-      if (_self.userName != null && _self.userName != '') {
-        var infoQueryParam = {};
-        infoQueryParam.infoWindowNo = 11531;
-        infoQueryParam.start = 0;
-        infoQueryParam.length = 1;
-        infoQueryParam.sortClause = '';
-        infoQueryParam.infoFilterFieldValues = [];
-        infoQueryParam.infoFilterFieldValues[0] = {};
-        infoQueryParam.infoFilterFieldValues[0].infoFilterFieldId = 11532;
-        infoQueryParam.infoFilterFieldValues[0].value1 = _self.userName;
-        $.ajax({
-          url: Common.getApiURL('InfoWindowResource/QueryInfoWindowData2'),
-          type: 'post',
-          dataType: 'json',
-          beforeSend: function (request) {
-            Common.addTokenToRequest(request);
-          },
-          contentType: 'application/json',
-          data: JSON.stringify(infoQueryParam),
-          async: false,
-          success: function (data) {
-            _self.loading = false;
-            _self.taskQueryParam.startUserId = '';
-            if (data.dataList[0].id != null) {
-              _self.taskQueryParam.startUserId = data.dataList[0].id;
-            }
-          },
-          error: function (XMLHttpRequest, textStatus, errorThrown) {
-            _self.loading = false;
-            Common.processException(XMLHttpRequest, textStatus, errorThrown);
-          },
-        });
-      }
-    },
+//  查询
+const searchDatas = isSearch => {
+  const params = { ...searchParams.value, ...pager };
+  searchApprove(params, isSearch);
+};
 
-    searchCopyTask: function () {
-      var _self = this;
-      _self.loading = true;
-      _self.taskQueryParam.range.start = 0;
-      _self.taskQueryParam.range.length = _self.pagination.per_page;
-      _self.pagination.current_page = 1;
-      _self.taskQueryParam.startAfter = _self.defaultStartAfter;
-      _self.taskQueryParam.startBefore = _self.defaultStartBefore;
-      _self.taskQueryParam.finishAfter = _self.defaultFinishAfter;
-      _self.taskQueryParam.finishBefore = _self.defaultFinishBefore;
-      _self.taskQueryParam.deploymentId = _self.deploymentId;
-      if (_self.taskQueryParam.advancedQuery) {
-        _self.getStartUserId();
-        _self.taskQueryParam.startAfter = _self.startAfter;
-        _self.taskQueryParam.startBefore = _self.startBefore;
-        _self.taskQueryParam.finishAfter = _self.finishAfter;
-        _self.taskQueryParam.finishBefore = _self.finishBefore;
-      }
-      console.log(JSON.stringify(_self.taskQueryParam));
-      $.ajax({
-        url: Common.getApiURL('WorkflowResource/copyTask'),
-        type: 'post',
-        dataType: 'json',
-        contentType: 'application/json',
-        beforeSend: function (request) {
-          Common.addTokenToRequest(request);
-        },
-        data: JSON.stringify(_self.taskQueryParam),
-        success: function (data) {
-          console.log(JSON.stringify(data));
-          _self.loading = false;
-          _self.copyTaskInfos = data;
-          _self.copyTaskInfos.copyTaskInfo.forEach(item => {
-            try {
-              var content = JSON.parse(item.content);
-              var parentForm = '';
-              content.parentForm.forEach(item => {
-                parentForm =
-                                    parentForm + item.title + ':' + item.content + '，\n';
-              });
-              item.content = parentForm;
-              // eslint-disable-next-line no-empty
-            } catch (e) {
+// 状态改变事件
+const statusChange = value => {
+  if (!value) searchParams.value.processStatusQuery = 'ALL';
+  searchDatas(true);
+};
 
+// 查询数据API
+const searchApprove = (params, isSearch) => {
+  isLoading.value = true;
+  const url = 'api/WorkflowResource/copyTask';
+  ajaxApi(url, params).then(
+    success => {
+      if (success.errorCode === 0) {
+        if (success.datas && success.datas.length > 0) {
+          success.datas.forEach(item => {
+            item.content = parseContent(item.content);
+            if (!isSearch) {
+              approveDatas.value.push(item);
             }
-
           });
-          _self.pagination.total = data.totalCount;
-          _self.pagination.last_page =
-                        data.totalCount % _self.taskQueryParam.range.length == 0
-                          ? data.totalCount / _self.taskQueryParam.range.length
-                          : Math.floor(
-                            data.totalCount / _self.taskQueryParam.range.length,
-                          ) + 1;
-        },
-        error: function (XMLHttpRequest, textStatus, errorThrown) {
-          _self.loading = false;
-          Common.processException(XMLHttpRequest, textStatus, errorThrown);
-        },
-      });
-    },
-
-    //是否开启高级查询
-    isAdvancedQuery: function (flag) {
-      let _self = this;
-      _self.taskQueryParam.advancedQuery = flag;
-      if (!flag) {
-        //初始化日期
-        _self.taskQueryParam.startAfter = _self.defaultStartAfter;
-        _self.taskQueryParam.startBefore = _self.defaultStartBefore;
+          if (isSearch) {
+            approveDatas.value = success.datas;
+          }
+        } else {
+          if (!isSearch) {
+            message.info('没有更多数据了。');
+            isLoading.value = false;
+            return;
+          }
+          approveDatas.value = [];
+        }
+      } else {
+        message.warning(success.errorMessage);
       }
+      isLoading.value = false;
     },
-
-    showTaskInfo: function (id) {
-      var _self = this;
-      _self.taskInfoId = id;
-    },
-
-    clean: function () {
-      //清空搜索条件
-      var _self = this;
-      _self.userName = '';
-      _self.taskQueryParam.condition = '';
-      _self.defaultStartAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultStartBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.startAfter = '';
-      _self.startBefore = '';
-      _self.finishAfter = '';
-      _self.finishBefore = '';
-    },
-
-    choiceStatus: function (status) {
-      this.taskQueryParam.processStatusQuery = status;
-      this.searchCopyTask();
+    error => {
+      isLoading.value = false;
+      Common.processException(error);
     },
+  );
+};
 
-    changePage: function () {
-      var _self = this;
-      _self.loading = true;
-      _self.taskQueryParam.range.start =
-                _self.pagination.per_page *
-                (parseInt(_self.pagination.current_page) - 1);
-      _self.taskQueryParam.startAfter = _self.defaultStartAfter;
-      _self.taskQueryParam.startBefore = _self.defaultStartBefore;
-      _self.taskQueryParam.finishAfter = _self.defaultFinishAfter;
-      _self.taskQueryParam.finishBefore = _self.defaultFinishBefore;
-      if (_self.taskQueryParam.advancedQuery) {
-        _self.taskQueryParam.startAfter = _self.startAfter;
-        _self.taskQueryParam.startBefore = _self.startBefore;
-        _self.taskQueryParam.finishAfter = _self.finishAfter;
-        _self.taskQueryParam.finishBefore = _self.finishBefore;
+// 选择了taskInfo
+const selectTaskInfo = taskInfo => {
+  TaskOpenUtil.openTask(taskInfo).then(
+    successData => {
+      if (successData.type === 'newWindow') {
+        WindowService.open(successData.url, '待处理', function () {
+          searchDatas();
+          emit('refreshStasticCount');
+        });
+      } else if (successData.type === 'customerTask') {
+        // 打开自定义的界面
+        selectedTaskId.value = taskInfo.id;
+        customerTask.value.show();
+        searchDatas();
+        emit('refreshStasticCount');
       }
-      console.log(JSON.stringify(_self.taskQueryParam));
-      $.ajax({
-        url: Common.getApiURL('WorkflowResource/copyTask'),
-        type: 'post',
-        dataType: 'json',
-        contentType: 'application/json',
-        beforeSend: function (request) {
-          Common.addTokenToRequest(request);
-        },
-        data: JSON.stringify(_self.taskQueryParam),
-        success: function (data) {
-          _self.loading = false;
-          //console.log(JSON.stringify(data));
-          _self.copyTaskInfos = data;
-          _self.copyTaskInfos.copyTaskInfo.forEach(item => {
-            try {
-              var content = JSON.parse(item.content);
-              var parentForm = '';
-              content.parentForm.forEach(item => {
-                parentForm =
-                                    parentForm + item.title + ':' + item.content + '，\n';
-              });
-              item.content = parentForm;
-              // eslint-disable-next-line no-empty
-            } catch (e) {
-
-            }
-          });
-          _self.pagination.total = data.totalCount;
-          _self.pagination.last_page =
-                        data.totalCount % _self.taskQueryParam.range.length == 0
-                          ? data.totalCount / _self.taskQueryParam.range.length
-                          : Math.floor(
-                            data.totalCount / _self.taskQueryParam.range.length,
-                          ) + 1;
-          console.log('totalCount=' + _self.pagination.total);
-          console.log('totalPage=' + _self.pagination.last_page);
-        },
-        error: function (XMLHttpRequest, textStatus, errorThrown) {
-          _self.loading = false;
-          Common.processException(
-            XMLHttpRequest,
-            textStatus,
-            errorThrown,
-          );
-        },
-      });
     },
-
-    // 选择了taskInfo
-    selectTaskInfo: function (taskInfo) {
-      var _self = this;
-      _self.loading = true;
-      if (
-        taskInfo.systemProcess == undefined ||
-                taskInfo.systemProcess == false
-      ) {
-        $.ajax({
-          url: Common.getApiURL('WorkflowResource/processTaskInfo'),
-          type: 'get',
-          dataType: 'json',
-          contentType: 'application/json',
-          beforeSend: function (request) {
-            Common.addTokenToRequest(request);
-          },
-          data: {
-            taskInfoId: taskInfo.id,
-          },
-          success: function (data) {
-            _self.loading = false;
-          },
-          error: function (XMLHttpRequest, textStatus, errorThrown) {
-            _self.loading = false;
-            Common.processException(
-              XMLHttpRequest,
-              textStatus,
-              errorThrown,
-            );
-          },
-        });
+    errorData => {
+      if (errorData != null) {
+        Notify.error(errorData.title, errorData.message, false);
       }
-
-
-      TaskOpenUtil.openCopyTask(taskInfo).then(successData => {
-        if (successData.type === 'newWindow') {
-          WindowService.open(successData.url, '抄送我的', function () {
-            _self.$emit('refreshStasticCount');
-            _self.searchCopyTask();
-          });
-        } else if (successData.type === 'customerTask') {
-          // 打开自定义的界面
-          //_self.selectedTaskId = taskInfo.id;
-          //_self.$refs.customerTask.show();
-          //_self.$emit('refreshStasticCount');
-          //_self.searchCopyTask();
-        }
-      }, errorData => {
-        if (errorData != null) {
-          Notify.error(errorData.title, errorData.message, false);
-        }
-      });
     },
+  );
+};
 
-    // 全部完成审阅
-    completeApproval: function () {
-      const _self = this;
-      _self.loading = false;
-      $.ajax({
-        url: Common.getApiURL('WorkflowResource/completeCopyTasks'),
-        type: 'post',
-        dataType: 'json',
-        contentType: 'application/json',
-        beforeSend: function (request) {
-          Common.addTokenToRequest(request);
-        },
-        success: function (data) {
-          _self.loading = false;
-          if(data.errorCode === 0){
-            _self.$emit('refreshStasticCount');
-            _self.searchCopyTask();
-          } else {
-            Notify.error('错误', data.errorMessage, false);
-          }
-        },
-        error: function (XMLHttpRequest, textStatus, errorThrown) {
-          _self.loading = false;
-          Common.processException(
-            XMLHttpRequest,
-            textStatus,
-            errorThrown,
-          );
-        },
+// 处理content json
+const parseContent = content => {
+  const x = content;
+  try {
+    let content = JSON.parse(x);
+    let parentForm = '';
+    if (content != null && content.parentForm != null) {
+      content.parentForm.forEach(item => {
+        parentForm = parentForm + item.title + ':' + item.content + '，\n';
       });
-    },
-  },
+      return parentForm;
+    } else {
+      return null;
+    }
+    // eslint-disable-next-line no-empty
+  } catch (e) {}
 };
 </script>
 
 <style scoped>
-.form-label {
-    margin-left: 10px;
-    cursor: pointer;
-}
-
-.m-tr {
-    cursor: pointer;
+.ant-table-wrapper {
+  margin-top: 8px;
 }
 </style>

src/workflow/MyApplyWorkflow.vue

@@ -1,474 +1,188 @@
 <template>
-  <div>
-    <div class="container-fluid">
-      <div class="row m-row">
-        <div class="col-md-12 col-sm-12 col-xs-12">
-          <input
-            v-model="taskQueryParam.condition"
-            autocomplete="off"
-            type="text"
-            :placeholder="$t('lang.MyApplyWorkflow.describe1')"
-            class="form-control"
-          />
-        </div>
-      </div>
-
-      <div
-        v-if="taskQueryParam.advancedQuery"
-        class="row m-row"
-      >
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.MyApplyWorkflow.startTime") }}</label>
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime
-            v-model="startAfter"
-          />
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime
-            v-model="startBefore"
-          />
-        </div>
-      </div>
-
-      <div
-        v-if="taskQueryParam.advancedQuery"
-        class="row m-row"
-      >
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.MyApplyWorkflow.completionTime") }}</label>
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime
-            v-model="finishAfter"
-          />
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime
-            v-model="finishBefore"
-          />
-        </div>
-      </div>
-
-      <div
-        v-if="taskQueryParam.advancedQuery"
-        class="row m-row"
-      >
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.MyApplyWorkflow.approvalOriginator") }}</label>
-        </div>
-        <div class="col-md-10 col-sm-10 col-xs-8">
-          <input
-            id="applyUser"
-            v-model="userName"
-            autocomplete="off"
-            type="text"
-            class="form-control"
-          />
-        </div>
-      </div>
-
-      <div class="row m-row">
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.MyApplyWorkflow.subject") }}</label>
-        </div>
-        <div class="col-md-10 col-sm-10 col-xs-8">
-          <select
-            v-model="deploymentId"
-            class="form-control"
-          >
-            <option value="">{{ $t("lang.MyApplyWorkflow.all") }}</option>
-            <option
-              v-for="item in approveType"
-              :key="item.deploymentId"
-              :value="item.deploymentId"
-            >
-              {{ item.name }}
-            </option>
-          </select>
-        </div>
-      </div>
-
-      <div class="row m-row">
-        <div class="col-md-12 col-sm-12 col-xs-10">
-          <button
-            role="button"
-            target="_self"
-            class="btn btn-primary"
-            @click="searchMyApply()"
-          >
-            {{ $t("lang.MyApplyWorkflow.search") }}
-          </button>
-          <a
-            class="form-label"
-            @click="taskQueryParam.advancedQuery = !taskQueryParam.advancedQuery"
-          >{{ (taskQueryParam.advancedQuery) ? $t("lang.MyApplyWorkflow.closeAdvancedSearch") : $t("lang.MyApplyWorkflow.advancedSearch") }}</a>
-          <a
-            id="clearSearchCondition"
-            class="form-label"
-            @click="clean()"
-          >{{ $t("lang.MyApplyWorkflow.clearSearchCriteria") }}</a>
-          <span id="choiceStatus">
-            <button
-              class="btn"
-              :class="{&quot;btn-info active&quot;: taskQueryParam.processStatusQuery == &quot;ALL&quot;}"
-              @click="choiceStatus('ALL')"
-            >{{ $t("lang.MyApplyWorkflow.all") }}</button>
-            <button
-              class="btn"
-              :class="{&quot;btn-info active&quot;: taskQueryParam.processStatusQuery == &quot;FINISH&quot;}"
-              @click="choiceStatus('FINISH')"
-            >{{ $t("lang.MyApplyWorkflow.done") }}</button>
-            <button
-              class="btn"
-              :class="{&quot;btn-info active&quot;: taskQueryParam.processStatusQuery == &quot;RUNNING&quot;}"
-              @click="choiceStatus('RUNNING')"
-            >{{ $t("lang.MyApplyWorkflow.inProcess") }}</button>
-          </span>
-        </div>
-      </div>
-      <div class="row m-row">
-        <div class="table-responsive">
-          <table class="table  table-hover table-bordered">
-            <thead>
-              <tr>
-                <td>{{ $t("lang.MyApplyWorkflow.documentCode") }}</td>
-                <td>{{ $t("lang.MyApplyWorkflow.subject") }}</td>
-                <td>{{ $t("lang.MyApplyWorkflow.approvalSummary") }}</td>
-                <td>{{ $t("lang.MyApplyWorkflow.originatingTime") }}</td>
-                <td>{{ $t("lang.MyApplyWorkflow.completionTime") }}</td>
-                <td>{{ $t("lang.MyApplyWorkflow.status") }}</td>
-              </tr>
-            </thead>
-            <tbody>
-              <tr
-                v-for="item in historicProcessInstanceInfos.historicProcessInstanceInfos"
-                :key="item.id"
-                class="m-tr"
-                @click="selectTaskInfo(item)"
-              >
-                <td>
-                  {{ item.no }}
-                </td>
-                <td>
-                  {{ item.title }}
-                </td>
-                <td>
-                  <span style="white-space: pre-line">{{ item.content }}</span>
-                </td>
-                <td>
-                  {{ item.startDate }}
-                </td>
-                <td>
-                  {{ item.endDate }}
-                </td>
-                <td>
-                  {{ item.documentStatus }}
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-      </div>
-      <VueBootstrapPagination
-        :pagination="pagination"
-        :callback="changePage"
+  <a-row type="flex" justify="space-between">
+    <a-col>
+      <a-input-search
+        v-model:value="searchParams.condition"
+        :placeholder="$t('lang.NeedApproveWorkflow.describe1')"
+        enter-button="搜索"
+        allow-clear
+        style="width: 300px;"
+        @search="searchDatas"
       />
-    </div>
-    <Loading v-if="loading" />
-  </div>
+    </a-col>
+    <a-col>
+      <WorkflowType @get-type="getTypeNo" />
+      <WorkflowSearch :function-type="4" @get-search-params="searchWorkflow" />
+    </a-col>
+  </a-row>
+  <CommonTable
+    ref="table"
+    :total="total"
+    :columns="approveColumns"
+    :data-source="approveDatas"
+    @get-pager="getPageParams"
+  >
+    <template #bodyCell="{ column, record }">
+      <template v-if="column.key === 'title'">
+        <span v-if="record.category != 'CurdWindow'">
+          {{ record.name }}
+        </span>
+        <span v-else>
+          {{ record.title }}
+        </span>
+      </template>
+      <template v-if="column.key === 'description'">
+        <span
+          v-if="record.category != 'CurdWindow'"
+          style="white-space: pre-line"
+        >{{ record.description }}</span>
+        <span v-else style="white-space: pre-line">{{ record.content }}</span>
+      </template>
+      <template v-if="column.key === 'operation'">
+        <a-button type="link" @click="selectTaskInfo(record)">
+          {{ $t("lang.NeedApproveWorkflow.viewTasks") }}
+        </a-button>
+      </template>
+    </template>
+  </CommonTable>
+  <Loading v-if="isLoading" />
+  <CustomerTask
+    ref="customerTask"
+    :task-id="selectedTaskId"
+    @closed="() => searchDatas"
+  />
 </template>
 
-<script>
-import Common from '../common/Common.js';
-
-
-import { Uuid} from 'pc-component-v3';
-import * as dayjs from 'dayjs';
-
+<script setup>
+import { ref, reactive, defineEmits, onMounted } from 'vue';
+import Common from '../common/Common';
+import WorkflowType from './WorkflowType.vue';
+import WorkflowSearch from './WorkflowSearch.vue';
+import CommonTable from '../common/CommonTable.vue';
+import { ajaxApi } from '../api/workflow/workflow.js';
+import { message } from 'ant-design-vue';
+import { approvedColumns } from './configData.js';
+import TaskOpenUtil from './TaskOpenUtil.js';
+import WindowService from '../common/WindowService.js';
+import CustomerTask from './CustomerTask.vue';
+import { Notify } from 'pc-component-v3';
+
+const emit = defineEmits(['refreshStasticCount']);
+const total = ref(0);
+const table = ref(null);
+const customerTask = ref(null);
+const selectedTaskId = ref(null);
+const isLoading = ref(false);
+const approveDatas = ref([]);
+const approveColumns = ref(approvedColumns);
+const searchParams = ref({});
+const filterParams = ref({});
+const pager = reactive({
+  start: 1,
+  length: 20,
+});
+
+onMounted(() => {
+  searchDatas();
+});
+
+// 查询,回到第一页
+const searchDatas = () => {
+  table.value.backFirstPage();
+};
 
+// 获取分页
+const getPageParams = (start, length) => {
+  pager.start = (start - 1) * length;
+  pager.length = length;
+  const params = { ...searchParams.value, ...filterParams.value, ...pager };
+  searchApprove(params);
+};
 
-export default {
+// 获取类型no
+const getTypeNo = windowNo => {
+  searchParams.value.windowNo = windowNo;
+  searchDatas();
+};
 
-  components: {
-  },
-  data: function () {
-    return {
-      'defaultStartAfter': '',   //默认开始日期
-      'defaultStartBefore': '',
-      'defaultFinishAfter': '',   //默认结束日期
-      'defaultFinishBefore': '',
-      'startAfter': '',          //开始日期
-      'startBefore': '',
-      'finishAfter': '',          //结束日期
-      'finishBefore': '',
-      'taskQueryParam': { 'processStatusQuery': 'ALL' },    	//查询条件       
-      'historicProcessInstanceInfos': '',
-      'deploymentId': '',
-      'userName': '',
-      'approveType': [],
-      pagination: {
-        total: 0,
-        per_page: 15,    // 每页的信息数
-        current_page: 1, // required
-        last_page: 0,    // required
-      },
-      loading: false,
-    };
-  },
-  mounted: function () {
-    this.init();
-  },
+// 通过高级查询搜索
+const searchWorkflow = value => {
+  filterParams.value = value;
+  searchDatas();
+};
 
-  methods: {
-    // 加载数据
-    init: function () {
-      var _self = this;
-      _self.loading=true;
-      _self.defaultStartAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultStartBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.taskQueryParam = {
-        'condition': '',         //查询条件(主题、文件编码、正文内容、审批意见).
-        'startAfter': _self.defaultStartAfter,
-        'startBefore': _self.defaultStartBefore,
-        'advancedQuery': false,    //是否高级查询
-        //"startUserId" : "",     //审批单发起人
-        'deploymentId': '',      //工作流部署Id
-        'processStatusQuery': 'ALL',  //审批状态
-        'range': {               //查询区间
-          'length': 100,
-          'start': 0,
-        },
-      };
-      console.log(JSON.stringify(_self.taskQueryParam));
-      $.ajax({
-        url: Common.getApiURL('WorkflowResource/approveType'),
-        type: 'GET',
-        dataType: 'json',
-        beforeSend: function (request) {
-          Common.addTokenToRequest(request);
-        },
-        success: function (data) {
-          _self.loading=false;
-          _self.approveType = data;
-          _self.searchMyApply();
-        },
-        error: function (XMLHttpRequest, textStatus, errorThrown) {
-          _self.loading=false;
-          Common.processException(XMLHttpRequest, textStatus, errorThrown);
-        },
-      });
-    },
-    getStartUserId: function () {
-      var _self = this;
-      if (_self.userName != null && _self.userName != '') {
-        _self.loading=true;
-        var infoQueryParam = {};
-        infoQueryParam.infoWindowNo = 11531;
-        infoQueryParam.start = 0;
-        infoQueryParam.length = 1;
-        infoQueryParam.sortClause = '';
-        infoQueryParam.infoFilterFieldValues = [];
-        infoQueryParam.infoFilterFieldValues[0] = {};
-        infoQueryParam.infoFilterFieldValues[0].infoFilterFieldId = 11532;
-        infoQueryParam.infoFilterFieldValues[0].value1 = _self.userName;
-        $.ajax({
-          url: Common.getApiURL('InfoWindowResource/QueryInfoWindowData2'),
-          type: 'post',
-          dataType: 'json',
-          beforeSend: function (request) {
-            Common.addTokenToRequest(request);
-          },
-          contentType: 'application/json',
-          data: JSON.stringify(infoQueryParam),
-          async: false,
-          success: function (data) {
-            _self.loading=false;
-            _self.taskQueryParam.startUserId = '';
-            if (data.dataList[0].id != null) {
-              _self.taskQueryParam.startUserId = data.dataList[0].id;
-            }
-          },
-          error: function (XMLHttpRequest, textStatus, errorThrown) {
-            _self.loading=false;
-            _self.$refs.common.processException(XMLHttpRequest, textStatus, errorThrown);
-          },
-        });
-      }
-    },
-    searchMyApply: function () {
-      var _self = this;
-      _self.loading=true;
-      _self.taskQueryParam.range.start = 0;
-      _self.taskQueryParam.range.length = _self.pagination.per_page;
-      _self.pagination.current_page = 1;
-      _self.taskQueryParam.startAfter = _self.defaultStartAfter;
-      _self.taskQueryParam.startBefore = _self.defaultStartBefore;
-      _self.taskQueryParam.finishAfter = _self.defaultFinishAfter;
-      _self.taskQueryParam.finishBefore = _self.defaultFinishBefore;
-      _self.taskQueryParam.deploymentId = _self.deploymentId;
-      if (_self.taskQueryParam.advancedQuery) {
-        _self.getStartUserId();
-        _self.taskQueryParam.startAfter = _self.startAfter;
-        _self.taskQueryParam.startBefore = _self.startBefore;
-        _self.taskQueryParam.finishAfter = _self.finishAfter;
-        _self.taskQueryParam.finishBefore = _self.finishBefore;
-      }
-						
-      $.ajax({
-        url: Common.getApiURL('WorkflowResource/myApply'),
-        type: 'post',
-        dataType: 'json',
-        contentType: 'application/json',
-        beforeSend: function (request) {
-          Common.addTokenToRequest(request);
-        },
-        data: JSON.stringify(_self.taskQueryParam),
-        success: function (data) {
-          _self.loading=false;
-          _self.historicProcessInstanceInfos = data;
-          _self.historicProcessInstanceInfos.historicProcessInstanceInfos.forEach(item => {
-            
-            try{
-              var content = JSON.parse(item.content);
-              var parentForm = '';
-              content.parentForm.forEach(item => {
-                parentForm =parentForm + item.title+':'+item.content+'，\n';
-              });
-              item.content = parentForm;
-            // eslint-disable-next-line no-empty
-            }catch(e){
-              
-            }
-            
+// 查询数据API
+const searchApprove = params => {
+  isLoading.value = true;
+  const url = 'api/WorkflowResource/myApply';
+  ajaxApi(url, params).then(
+    success => {
+      if (success.errorCode === 0) {
+        if (success.datas && success.datas.length > 0) {
+          success.datas.forEach(item => {
+            item.content = parseContent(item.content);
           });
-          _self.pagination.total = data.totalCount;
-          _self.pagination.last_page = Math.ceil(data.totalCount / _self.taskQueryParam.range.length);
-        },
-        error: function (XMLHttpRequest, textStatus, errorThrown) {
-          _self.loading=false;
-          _self.$refs.common.processException(XMLHttpRequest, textStatus, errorThrown);
-        },
-      });
-    },
-    //是否开启高级查询
-    isAdvancedQuery: function (flag) {
-      let _self = this;
-      _self.taskQueryParam.advancedQuery = flag;
-      if (!flag) {
-        //初始化日期
-        _self.taskQueryParam.startAfter = _self.defaultStartAfter;
-        _self.taskQueryParam.startBefore = _self.defaultStartBefore;
+          total.value = success.total;
+          approveDatas.value = success.datas;
+        } else {
+          total.value = 0;
+          approveDatas.value = [];
+        }
+      } else {
+        message.warning(success.errorMessage);
       }
+      isLoading.value = false;
     },
-    showTaskInfo: function (id) {
-      var _self = this;
-      _self.taskInfoId = id;
-    },
-    clean: function () {   //清空搜索条件
-      var _self = this;
-      _self.userName = '';
-      _self.taskQueryParam.condition = '';
-      _self.defaultStartAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultStartBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.startAfter = '';
-      _self.startBefore = '';
-      _self.finishAfter = '';
-      _self.finishBefore = '';
+    error => {
+      isLoading.value = false;
+      Common.processException(error);
     },
-    choiceStatus: function (status) {
-      this.taskQueryParam.processStatusQuery = status;
-      this.searchMyApply();
+  );
+};
+
+// 选择了taskInfo
+const selectTaskInfo = taskInfo => {
+  TaskOpenUtil.openTask(taskInfo).then(
+    successData => {
+      if (successData.type === 'newWindow') {
+        WindowService.open(successData.url, '待处理', function () {
+          searchDatas();
+          emit('refreshStasticCount');
+        });
+      } else if (successData.type === 'customerTask') {
+        // 打开自定义的界面
+        selectedTaskId.value = taskInfo.id;
+        customerTask.value.show();
+        searchDatas();
+        emit('refreshStasticCount');
+      }
     },
-    changePage: function () {
-      var _self = this;
-      _self.loading=true;
-      _self.taskQueryParam.range.start = _self.pagination.per_page * (parseInt(_self.pagination.current_page) - 1);
-      _self.taskQueryParam.startAfter = _self.defaultStartAfter;
-      _self.taskQueryParam.startBefore = _self.defaultStartBefore;
-      _self.taskQueryParam.finishAfter = _self.defaultFinishAfter;
-      _self.taskQueryParam.finishBefore = _self.defaultFinishBefore;
-      if (_self.taskQueryParam.advancedQuery) {
-        _self.taskQueryParam.startAfter = _self.startAfter;
-        _self.taskQueryParam.startBefore = _self.startBefore;
-        _self.taskQueryParam.finishAfter = _self.finishAfter;
-        _self.taskQueryParam.finishBefore = _self.finishBefore;
+    errorData => {
+      if (errorData != null) {
+        Notify.error(errorData.title, errorData.message, false);
       }
-      console.log(JSON.stringify(_self.taskQueryParam));
-      $.ajax({
-        url: Common.getApiURL('WorkflowResource/myApply'),
-        type: 'post',
-        dataType: 'json',
-        contentType: 'application/json',
-        beforeSend: function (request) {
-          Common.addTokenToRequest(request);
-        },
-        data: JSON.stringify(_self.taskQueryParam),
-        success: function (data) {
-          _self.loading=false;
-          _self.historicProcessInstanceInfos = data;
-          _self.historicProcessInstanceInfos.historicProcessInstanceInfos.forEach(item => {
-            
-            try{
-
-              var content = JSON.parse(item.content);
-              var parentForm = '';
-              content.parentForm.forEach(item => {
-                parentForm =parentForm + item.title+':'+item.content+'，\n';
-              });
-              item.content = parentForm;
-            // eslint-disable-next-line no-empty
-            }catch(e){
-              
-            }
-          });
-          _self.pagination.total = data.totalCount;
-          _self.pagination.last_page = Math.ceil(data.totalCount / _self.taskQueryParam.range.length);
-        },
-        error: function (XMLHttpRequest, textStatus, errorThrown) {
-          _self.loading=false;
-          _self.$refs.common.processException(XMLHttpRequest, textStatus, errorThrown);
-        },
-      });
     },
-        
-    // 选择了taskInfo
-    selectTaskInfo: function (taskInfo) {
-      var _self = this;
-      var type = 'view';
-      var windowNo = taskInfo.windowNo;
-      var tabIndex = taskInfo.tabIndex;
-      var recordId = taskInfo.recordId;
-      var url = '/desktop/window/window-read/'
-                + type + '/'
-                + windowNo + '/'
-                + tabIndex + '/'
-                + recordId
-                + '?workflowType=approve&taskInfoId=' + taskInfo.id
-                + '&currIndex=1&totalCount=1&canGoBack=false&uuid=' + Uuid.createUUID();
+  );
+};
 
-      window.open(Common.getRedirectUrl('#' + url));
-    },
-  },
+// 处理content json
+const parseContent = content => {
+  const x = content;
+  try {
+    let content = JSON.parse(x);
+    let parentForm = '';
+    if (content != null && content.parentForm != null) {
+      content.parentForm.forEach(item => {
+        parentForm = parentForm + item.title + ':' + item.content + '，\n';
+      });
+      return parentForm;
+    } else {
+      return null;
+    }
+    // eslint-disable-next-line no-empty
+  } catch (e) {}
 };
 </script>
 
 <style scoped>
-.form-label {
-    margin-left: 10px;
-    cursor: pointer;
-}
-
-.m-tr {
-    cursor: pointer;
-}
 </style>

src/workflow/NeedApproveWorkflow.vue

@@ -12,7 +12,7 @@
     </a-col>
     <a-col>
       <WorkflowType @get-type="getTypeNo" />
-      <WorkflowSearch @get-search-params="searchWorkflow" />
+      <WorkflowSearch :function-type="2" @get-search-params="searchWorkflow" />
     </a-col>
   </a-row>
   <CommonTable
@@ -39,9 +39,9 @@
         <span v-else style="white-space: pre-line">{{ record.content }}</span>
       </template>
       <template v-if="column.key === 'operation'">
-        <button class="btn btn-link" @click="selectTaskInfo(record)">
+        <a-button type="link" @click="selectTaskInfo(record)">
           {{ $t("lang.NeedApproveWorkflow.viewTasks") }}
-        </button>
+        </a-button>
       </template>
     </template>
   </CommonTable>

src/workflow/NotApproveWorkflow.vue

@@ -1,480 +1,188 @@
 <template>
-  <div>
-    <div class="container-fluid">
-      <div class="row m-row">
-        <div class="col-md-12 col-sm-12 col-xs-12">
-          <input
-            v-model="taskQueryParam.condition"
-            autocomplete="off"
-            type="text"
-            :placeholder="$t('lang.NotApproveWorkflow.describe1')"
-            class="form-control"
-          />
-        </div>
-      </div>
-
-      <div
-        v-if="taskQueryParam.advancedQuery"
-        class="row m-row"
-      >
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.NotApproveWorkflow.startTime") }}</label>
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime
-            v-model="startAfter"
-          />
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime
-            v-model="startBefore"
-          />
-        </div>
-      </div>
-
-      <div
-        v-if="taskQueryParam.advancedQuery"
-        class="row m-row"
-      >
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.NotApproveWorkflow.completionTime") }}</label>
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime
-            v-model="finishAfter"
-          />
-        </div>
-
-        <div class="col-md-5 col-sm-5 col-xs-4">
-          <DateTime
-            v-model="finishBefore"
-          />
-        </div>
-      </div>
-
-      <div
-        v-if="taskQueryParam.advancedQuery"
-        class="row m-row"
-      >
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.NotApproveWorkflow.approvalOriginator") }}</label>
-        </div>
-        <div class="col-md-10 col-sm-10 col-xs-8">
-          <input
-            id="applyUser"
-            v-model="userName"
-            autocomplete="off"
-            type="text"
-            class="form-control"
-          />
-        </div>
-      </div>
-
-      <div class="row m-row">
-        <div class="col-md-2 col-sm-2 col-xs-4">
-          <label class="form-control-static">{{ $t("lang.NotApproveWorkflow.subject") }}</label>
-        </div>
-        <div class="col-md-10 col-sm-10 col-xs-8">
-          <select
-            v-model="deploymentId"
-            class="form-control"
-          >
-            <option value="">{{ $t("lang.NotApproveWorkflow.all") }}</option>
-            <option
-              v-for="item in approveType"
-              :key="item.deploymentId"
-              :value="item.deploymentId"
-            >
-              {{ item.name }}
-            </option>
-          </select>
-        </div>
-      </div>
-
-      <div class="row m-row">
-        <div class="col-md-12 col-sm-12 col-xs-10">
-          <button
-            role="button"
-            target="_self"
-            class="btn btn-primary"
-            @click="searchNotApproved()"
-          >
-            {{ $t("lang.NotApproveWorkflow.search") }}
-          </button>
-          <a
-            class="form-label"
-            @click="taskQueryParam.advancedQuery = !taskQueryParam.advancedQuery"
-          >{{ (taskQueryParam.advancedQuery) ? $t("lang.NotApproveWorkflow.closeAdvancedSearch") : $t("lang.NotApproveWorkflow.advancedSearch") }}</a>
-          <a
-            id="clearSearchCondition"
-            class="form-label"
-            @click="clean()"
-          >{{ $t("lang.NotApproveWorkflow.clearSearchCriteria") }}</a>
-          <span id="choiceStatus">
-            <button
-              class="btn"
-              :class="{&quot;btn-info active&quot;: taskQueryParam.processStatusQuery == &quot;ALL&quot;}"
-              @click="choiceStatus('ALL')"
-            >{{ $t("lang.NotApproveWorkflow.all") }}</button>
-            <button
-              class="btn"
-              :class="{&quot;btn-info active&quot;: taskQueryParam.processStatusQuery == &quot;FINISH&quot;}"
-              @click="choiceStatus('FINISH')"
-            >{{ $t("lang.NotApproveWorkflow.done") }}</button>
-            <button
-              class="btn"
-              :class="{&quot;btn-info active&quot;: taskQueryParam.processStatusQuery == &quot;RUNNING&quot;}"
-              @click="choiceStatus('RUNNING')"
-            >{{ $t("lang.NotApproveWorkflow.inProcess") }}</button>
-          </span>
-        </div>
-      </div>
-
-      <div class="row m-row">
-        <div class="table-responsive">
-          <table class="table table-bordered table-hover">
-            <thead>
-              <tr>
-                <td>{{ $t("lang.NotApproveWorkflow.documentCode") }}</td>
-                <td>{{ $t("lang.NotApproveWorkflow.subject") }}</td>
-                <td>{{ $t("lang.NotApproveWorkflow.approvalSummary") }}</td>
-                <td>{{ $t("lang.NotApproveWorkflow.originatingTime") }}</td>
-                <td>{{ $t("lang.NotApproveWorkflow.completionTime") }}</td>
-                <td>{{ $t("lang.NotApproveWorkflow.status") }}</td>
-              </tr>
-            </thead>
-            <tbody>
-              <tr
-                v-for="item in historicTaskInfos.historicProcessInstanceInfos"
-                :key="item.id"
-                class="m-tr"
-                @click="selectTaskInfo(item)"
-              >
-                <td>
-                  {{ item.no }}
-                </td>
-                <td>
-                  {{ item.title }}
-                </td>
-                <td>
-                  <span style="white-space: pre-line">{{ item.content }}</span>
-                </td>
-                <td>
-                  {{ item.startDate }}
-                </td>
-                <td>
-                  {{ item.endDate }}
-                </td>
-                <td>
-                  {{ item.documentStatus == '进行中' ? $t("lang.NotApproveWorkflow.inProcess"):$t("lang.NotApproveWorkflow.done") }}
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-      </div>
-      <VueBootstrapPagination
-        :pagination="pagination"
-        :callback="changePage"
+  <a-row type="flex" justify="space-between">
+    <a-col>
+      <a-input-search
+        v-model:value="searchParams.condition"
+        :placeholder="$t('lang.NeedApproveWorkflow.describe1')"
+        enter-button="搜索"
+        allow-clear
+        style="width: 300px;"
+        @search="searchDatas"
       />
-    </div>
-    <Loading v-if="loading" />
-  </div>
+    </a-col>
+    <a-col>
+      <WorkflowType @get-type="getTypeNo" />
+      <WorkflowSearch :function-type="6" @get-search-params="searchWorkflow" />
+    </a-col>
+  </a-row>
+  <CommonTable
+    ref="table"
+    :total="total"
+    :columns="approveColumns"
+    :data-source="approveDatas"
+    @get-pager="getPageParams"
+  >
+    <template #bodyCell="{ column, record }">
+      <template v-if="column.key === 'title'">
+        <span v-if="record.category != 'CurdWindow'">
+          {{ record.name }}
+        </span>
+        <span v-else>
+          {{ record.title }}
+        </span>
+      </template>
+      <template v-if="column.key === 'description'">
+        <span
+          v-if="record.category != 'CurdWindow'"
+          style="white-space: pre-line"
+        >{{ record.description }}</span>
+        <span v-else style="white-space: pre-line">{{ record.content }}</span>
+      </template>
+      <template v-if="column.key === 'operation'">
+        <a-button type="link" @click="selectTaskInfo(record)">
+          {{ $t("lang.NeedApproveWorkflow.viewTasks") }}
+        </a-button>
+      </template>
+    </template>
+  </CommonTable>
+  <Loading v-if="isLoading" />
+  <CustomerTask
+    ref="customerTask"
+    :task-id="selectedTaskId"
+    @closed="() => searchDatas"
+  />
 </template>
 
-<script>
-import Common from '../common/Common.js';
+<script setup>
+import { ref, reactive, defineEmits, onMounted } from 'vue';
+import Common from '../common/Common';
+import WorkflowType from './WorkflowType.vue';
+import WorkflowSearch from './WorkflowSearch.vue';
+import CommonTable from '../common/CommonTable.vue';
+import { ajaxApi } from '../api/workflow/workflow.js';
+import { message } from 'ant-design-vue';
+import { approvedColumns } from './configData.js';
+import TaskOpenUtil from './TaskOpenUtil.js';
 import WindowService from '../common/WindowService.js';
+import CustomerTask from './CustomerTask.vue';
 import { Notify } from 'pc-component-v3';
-import TaskOpenUtil from './TaskOpenUtil.js';
-import * as dayjs from 'dayjs';
 
-export default {
+const emit = defineEmits(['refreshStasticCount']);
+const total = ref(0);
+const table = ref(null);
+const customerTask = ref(null);
+const selectedTaskId = ref(null);
+const isLoading = ref(false);
+const approveDatas = ref([]);
+const approveColumns = ref(approvedColumns);
+const searchParams = ref({});
+const filterParams = ref({});
+const pager = reactive({
+  start: 1,
+  length: 20,
+});
+
+onMounted(() => {
+  searchDatas();
+});
+
+// 查询,回到第一页
+const searchDatas = () => {
+  table.value.backFirstPage();
+};
 
-  components: {
-  },
-  data: function () {
-    return {
-      'defaultStartAfter': '',   //默认开始日期
-      'defaultStartBefore': '',
-      'defaultFinishAfter': '',   //默认结束日期
-      'defaultFinishBefore': '',
-      'startAfter': '',          //开始日期
-      'startBefore': '',
-      'finishAfter': '',          //结束日期
-      'finishBefore': '',
-      'taskQueryParam': { 'processStatusQuery': 'FINISH' },    	//查询条件       
-      'historicTaskInfos': [],
-      'deploymentId': '',
-      'userName': '',
-      'approveType': [],
-      pagination: {
-        total: 0,
-        per_page: 20,    // required
-        current_page: 1, // required
-        last_page: 0,    // required
-      },
-      loading: false,
-    };
-  },
-  mounted: function () {
-    this.init();
-  },
+// 获取分页
+const getPageParams = (start, length) => {
+  pager.start = (start - 1) * length;
+  pager.length = length;
+  const params = { ...searchParams.value, ...filterParams.value, ...pager };
+  searchApprove(params);
+};
 
-  methods: {
-    // 加载数据
-    init: function () {
-      var _self = this;
-      _self.loading=true;
-      _self.defaultStartAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultStartBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.taskQueryParam = {
-        'condition': '',         //查询条件(主题、文件编码、正文内容、审批意见).
-        'startAfter': _self.defaultStartAfter,
-        'startBefore': _self.defaultStartBefore,
-        'advancedQuery': false,    //是否高级查询
-        //"startUserId" : "",     //审批单发起人
-        'deploymentId': '',      //工作流部署Id
-        'processStatusQuery': 'ALL',  //审批状态
-        'range': {               //查询区间
-          'length': 100,
-          'start': 0,
-        },
-      };
-      console.log(JSON.stringify(_self.taskQueryParam));
-      $.ajax({
-        url: Common.getApiURL('WorkflowResource/approveType'),
-        type: 'GET',
-        dataType: 'json',
-        beforeSend: function (request) {
-          Common.addTokenToRequest(request);
-        },
-        success: function (data) {
-          _self.loading=false;
-          _self.approveType = data;
-          _self.searchNotApproved();
-        },
-        error: function (XMLHttpRequest, textStatus, errorThrown) {
-          _self.loading=false;
-          Common.processException(XMLHttpRequest, textStatus, errorThrown);
-        },
-      });
-    },
-    getStartUserId: function () {
-      var _self = this;
-      _self.loading=true;
-      if (_self.userName != null && _self.userName != '') {
-        var infoQueryParam = {};
-        infoQueryParam.infoWindowNo = 11531;
-        infoQueryParam.start = 0;
-        infoQueryParam.length = 1;
-        infoQueryParam.sortClause = '';
-        infoQueryParam.infoFilterFieldValues = [];
-        infoQueryParam.infoFilterFieldValues[0] = {};
-        infoQueryParam.infoFilterFieldValues[0].infoFilterFieldId = 11532;
-        infoQueryParam.infoFilterFieldValues[0].value1 = _self.userName;
-        $.ajax({
-          url: Common.getApiURL('InfoWindowResource/QueryInfoWindowData2'),
-          type: 'post',
-          dataType: 'json',
-          beforeSend: function (request) {
-            Common.addTokenToRequest(request);
-          },
-          contentType: 'application/json',
-          data: JSON.stringify(infoQueryParam),
-          async: false,
-          success: function (data) {
-            _self.loading=false;
-            _self.taskQueryParam.startUserId = '';
-            if (data.dataList[0].id != null) {
-              _self.taskQueryParam.startUserId = data.dataList[0].id;
-            }
+// 获取类型no
+const getTypeNo = windowNo => {
+  searchParams.value.windowNo = windowNo;
+  searchDatas();
+};
 
-          },
-          error: function (XMLHttpRequest, textStatus, errorThrown) {
-            _self.loading=false;
-            Common.processException(XMLHttpRequest);
-          },
-        });
+// 通过高级查询搜索
+const searchWorkflow = value => {
+  filterParams.value = value;
+  searchDatas();
+};
+
+// 查询数据API
+const searchApprove = params => {
+  isLoading.value = true;
+  const url = 'api/WorkflowResource/refuse';
+  ajaxApi(url, params).then(
+    success => {
+      if (success.errorCode === 0) {
+        if (success.datas && success.datas.length > 0) {
+          success.datas.forEach(item => {
+            item.content = parseContent(item.content);
+          });
+          total.value = success.total;
+          approveDatas.value = success.datas;
+        } else {
+          total.value = 0;
+          approveDatas.value = [];
+        }
+      } else {
+        message.warning(success.errorMessage);
       }
+      isLoading.value = false;
     },
-    searchNotApproved: function () {
-      var _self = this;
-      _self.loading=true;
-      _self.taskQueryParam.range.start = 0;
-      _self.taskQueryParam.range.length = _self.pagination.per_page;
-      _self.pagination.current_page = 1;
-      _self.taskQueryParam.startAfter = _self.defaultStartAfter;
-      _self.taskQueryParam.startBefore = _self.defaultStartBefore;
-      _self.taskQueryParam.finishAfter = _self.defaultFinishAfter;
-      _self.taskQueryParam.finishBefore = _self.defaultFinishBefore;
-      _self.taskQueryParam.deploymentId = _self.deploymentId;
-      if (_self.taskQueryParam.advancedQuery) {
-        _self.getStartUserId();
-        _self.taskQueryParam.startAfter = _self.startAfter;
-        _self.taskQueryParam.startBefore = _self.startBefore;
-        _self.taskQueryParam.finishAfter = _self.finishAfter;
-        _self.taskQueryParam.finishBefore = _self.finishBefore;
-      }
-      console.log(JSON.stringify(_self.taskQueryParam));
-      $.ajax({
-        url: Common.getApiURL('WorkflowResource/refuse'),
-        type: 'post',
-        dataType: 'json',
-        contentType: 'application/json',
-        beforeSend: function (request) {
-          Common.addTokenToRequest(request);
-        },
-        data: JSON.stringify(_self.taskQueryParam),
-        success: function (data) {
-          _self.loading=false;
-          _self.historicTaskInfos = data;
-          _self.historicTaskInfos.historicProcessInstanceInfos.forEach(item => {
-            try{
-              var content = JSON.parse(item.content);
-              var parentForm = '';
-              content.parentForm.forEach(item => {
-                parentForm =parentForm + item.title+':'+item.content+'，\n';
-              });
-              item.content = parentForm;
-            // eslint-disable-next-line no-empty
-            }catch(e){
-              
-            }
-          });
-          _self.pagination.total = data.totalCount;
-          _self.pagination.last_page = Math.ceil(data.totalCount / _self.taskQueryParam.range.length);
-        },
-        error: function (XMLHttpRequest, textStatus, errorThrown) {
-          _self.loading=false;
-          Common.processException(XMLHttpRequest, textStatus, errorThrown);
-        },
-      });
-
+    error => {
+      isLoading.value = false;
+      Common.processException(error);
     },
-    //是否开启高级查询
-    isAdvancedQuery: function (flag) {
-      let _self = this;
-      _self.taskQueryParam.advancedQuery = flag;
-      if (!flag) {
-        //初始化日期
-        _self.taskQueryParam.startAfter = _self.defaultStartAfter;
-        _self.taskQueryParam.startBefore = _self.defaultStartBefore;
+  );
+};
 
+// 选择了taskInfo
+const selectTaskInfo = taskInfo => {
+  TaskOpenUtil.openTask(taskInfo).then(
+    successData => {
+      if (successData.type === 'newWindow') {
+        WindowService.open(successData.url, '待处理', function () {
+          searchDatas();
+          emit('refreshStasticCount');
+        });
+      } else if (successData.type === 'customerTask') {
+        // 打开自定义的界面
+        selectedTaskId.value = taskInfo.id;
+        customerTask.value.show();
+        searchDatas();
+        emit('refreshStasticCount');
       }
     },
-    showTaskInfo: function (id) {
-      var _self = this;
-      _self.taskInfoId = id;
-
-    },
-    clean: function () {   //清空搜索条件
-      var _self = this;
-      _self.userName = '';
-      _self.taskQueryParam.condition = '';
-      _self.defaultStartAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultStartBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishAfter = dayjs().add(-1, 'month').format('YYYY-MM-DD HH:mm:ss');
-      _self.defaultFinishBefore = dayjs().format('YYYY-MM-DD HH:mm:ss');
-      _self.startAfter = '';
-      _self.startBefore = '';
-      _self.finishAfter = '';
-      _self.finishBefore = '';
-    },
-    choiceStatus: function (status) {
-      this.taskQueryParam.processStatusQuery = status;
-      this.searchNotApproved();
-    },
-    changePage: function () {
-      var _self = this;
-      _self.loading=true;
-      _self.taskQueryParam.range.start = _self.pagination.per_page * (parseInt(_self.pagination.current_page) - 1);
-      _self.taskQueryParam.startAfter = _self.defaultStartAfter;
-      _self.taskQueryParam.startBefore = _self.defaultStartBefore;
-      _self.taskQueryParam.finishAfter = _self.defaultFinishAfter;
-      _self.taskQueryParam.finishBefore = _self.defaultFinishBefore;
-      if (_self.taskQueryParam.advancedQuery) {
-        _self.taskQueryParam.startAfter = _self.startAfter;
-        _self.taskQueryParam.startBefore = _self.startBefore;
-        _self.taskQueryParam.finishAfter = _self.finishAfter;
-        _self.taskQueryParam.finishBefore = _self.finishBefore;
+    errorData => {
+      if (errorData != null) {
+        Notify.error(errorData.title, errorData.message, false);
       }
-      console.log(JSON.stringify(_self.taskQueryParam));
-      $.ajax({
-        url: Common.getApiURL('WorkflowResource/refuse'),
-        type: 'post',
-        dataType: 'json',
-        contentType: 'application/json',
-        beforeSend: function (request) {
-          Common.addTokenToRequest(request);
-        },
-        data: JSON.stringify(_self.taskQueryParam),
-        success: function (data) {
-          _self.loading=false;
-          _self.historicTaskInfos = data;
-          _self.historicTaskInfos.historicProcessInstanceInfos.forEach(item => {
-            try{
-
-              var content = JSON.parse(item.content);
-              var parentForm = '';
-              content.parentForm.forEach(item => {
-                parentForm =parentForm + item.title+':'+item.content+'，\n';
-              });
-              item.content = parentForm;
-            // eslint-disable-next-line no-empty
-            }catch(e){
-              
-            }
-          });
-          _self.pagination.total = data.totalCount;
-          _self.pagination.last_page = Math.ceil(data.totalCount / _self.taskQueryParam.range.length);
-        },
-        error: function (XMLHttpRequest, textStatus, errorThrown) {
-          _self.loading=false;
-          Common.processException(XMLHttpRequest, textStatus, errorThrown);
-        },
-      });
     },
-    // 选择了taskInfo
-    selectTaskInfo: function (taskInfo) {
-      let _self = this;
-      TaskOpenUtil.openHistoryTask(taskInfo).then(successData => {
-        if(successData.type === 'newWindow'){
-          WindowService.open(successData.url, '已驳回的', function(){
-            _self.$emit('refreshStasticCount');
-            _self.searchNotApproved();
-          });
-        }else if(successData.type === 'customerTask'){
-          // 打开自定义的界面
-          _self.selectedTaskId = taskInfo.id;
-          _self.$refs.customerTask.show();
-          _self.$emit('refreshStasticCount');
-          _self.searchNotApproved();
-        }
-      }, errorData => {
-        if(errorData != null){
-          Notify.error(errorData.title, errorData.message, false);
-        }
-      });
-    },
-
+  );
+};
 
-  },
+// 处理content json
+const parseContent = content => {
+  const x = content;
+  try {
+    let content = JSON.parse(x);
+    let parentForm = '';
+    if (content != null && content.parentForm != null) {
+      content.parentForm.forEach(item => {
+        parentForm = parentForm + item.title + ':' + item.content + '，\n';
+      });
+      return parentForm;
+    } else {
+      return null;
+    }
+    // eslint-disable-next-line no-empty
+  } catch (e) {}
 };
 </script>
 
 <style scoped>
-.form-label {
-    margin-left: 10px;
-    cursor: pointer;
-}
-
-.m-tr {
-    cursor: pointer;
-}
 </style>

src/workflow/WorkflowSearch.vue

@@ -13,9 +13,10 @@
         :model="formState"
         name="basic"
         autocomplete="off"
-        style="width: 500px; padding: 20px"
+        style="width: 458px; padding: 20px"
       >
         <a-form-item
+          v-if="functionType != 4 && functionType != 6"
           label="审批单发起人:"
           name="startUserId"
           style="margin-bottom: 12px"
@@ -41,7 +42,7 @@
             @change="(_, str) => dateChange(str, 'processInstanceStartBefore')"
           />
         </a-form-item>
-        <a-form-item label="审批任务时间:">
+        <a-form-item v-if="functionType == 2" label="任务开始时间:">
           <a-date-picker
             v-model:value="formState.taskCreateTimeAfter"
             @change="(_, str) => dateChange(str, 'taskCreateTimeAfter')"
@@ -52,10 +53,35 @@
             @change="(_, str) => dateChange(str, 'taskCreateTimeBefore')"
           />
         </a-form-item>
+        <a-form-item v-if="functionType == 3" label="完成审批时间:">
+          <a-date-picker
+            v-model:value="formState.taskEndTimeAfter"
+            @change="(_, str) => dateChange(str, 'taskEndTimeAfter')"
+          />
+          至
+          <a-date-picker
+            v-model:value="formState.taskEndTimeBefore"
+            @change="(_, str) => dateChange(str, 'taskEndTimeBefore')"
+          />
+        </a-form-item>
+        <a-form-item
+          v-if="functionType == 4 || functionType == 6"
+          label="完成审批时间:"
+        >
+          <a-date-picker
+            v-model:value="formState.processInstanceEndAfter"
+            @change="(_, str) => dateChange(str, 'processInstanceEndAfter')"
+          />
+          至
+          <a-date-picker
+            v-model:value="formState.processInstanceEndBefore"
+            @change="(_, str) => dateChange(str, 'processInstanceEndBefore')"
+          />
+        </a-form-item>
         <a-divider />
         <a-row type="flex" align="middle" justify="space-between">
           <a-col>
-            <span v-if="!isShowClear" style="color: #c8c8c9">清空搜索条件</span>
+            <span v-if="!isShowClear" style="color: #c8c8c9; cursor: pointer">清空搜索条件</span>
             <a v-else @click="clearFilter"> 清空搜索条件</a>
           </a-col>
           <a-col>
@@ -76,12 +102,17 @@
 
 <script setup>
 import Common from '../common/Common';
-import { ref, defineEmits, watch, onMounted } from 'vue';
+import { ref, defineEmits, defineProps, watch, onMounted } from 'vue';
 import UserResource from '../api/base/UserResource.js';
 import { AlignCenterOutlined } from '@ant-design/icons-vue';
 
 const emit = defineEmits(['getSearchParams']);
-
+const props = defineProps({
+  functionType: {
+    type: Number,
+    default: 2,
+  },
+});
 const formState = ref({});
 const visible = ref(false);
 const searchParams = ref({});
@@ -91,7 +122,12 @@ const copyUserIds = ref([]);
 // 获取日期string格式
 const dateChange = (value, key) => {
   if (value) {
-    if (key === 'processInstanceStartAfter' || key === 'taskCreateTimeAfter') {
+    if (
+      key === 'processInstanceStartAfter' ||
+      key === 'taskCreateTimeAfter' ||
+      key === 'taskEndTimeAfter' ||
+      key === 'processInstanceEndAfter'
+    ) {
       searchParams.value[key] = value + ' 00:00:00';
     } else {
       searchParams.value[key] = value + ' 23:59:59';

src/workflow/WorkflowType.vue

@@ -4,6 +4,7 @@
     show-search
     :placeholder="$t('lang.NeedApproveWorkflow.all')"
     style="width: 200px"
+    allow-clear
     :options="approveTypes"
     :field-names="{ label: 'windowName', value: 'windowNo' }"
     :filter-option="filterOption"

src/workflow/configData.js

@@ -4,42 +4,90 @@ export const needApproveColumns = [
     title: '文件编码',
     dataIndex: 'no',
     key: 'no',
-    width: 160,
+    width: 70,
   },
   {
     title: '主题',
     dataIndex: 'title',
     key: 'title',
-    width: 160,
+    width: 70,
   },
   {
     title: '审批摘要',
     dataIndex: 'description',
     key: 'description',
-    width: 160,
+    width: 200,
   },
   {
     title: '发起时间',
     dataIndex: 'startDate',
     key: 'startDate',
-    width: 160,
+    width: 90,
   },
   {
     title: '截止时间',
     dataIndex: 'dueDate',
     key: 'dueDate',
-    width: 160,
+    width: 90,
   },
   {
     title: '操作',
     dataIndex: 'operation',
     key: 'operation',
-    width: 160,
+    width: 120,
   },
 
 ].map(item => ({
   ...item,
-  resizable: true,
-  mainWidth: 75,
+  mainWidth: 60,
+  maxWidth: 400,
+}));
+export const approvedColumns = [
+
+  {
+    title: '文件编码',
+    dataIndex: 'no',
+    key: 'no',
+    width: 70,
+  },
+  {
+    title: '主题',
+    dataIndex: 'title',
+    key: 'title',
+    width: 70,
+  },
+  {
+    title: '审批摘要',
+    dataIndex: 'description',
+    key: 'description',
+    width: 200,
+  },
+  {
+    title: '发起时间',
+    dataIndex: 'startDate',
+    key: 'startDate',
+    width: 90,
+  },
+  {
+    title: '完成时间',
+    dataIndex: 'endDate',
+    key: 'endDate',
+    width: 90,
+  },
+  {
+    title: '状态',
+    dataIndex: 'documentStatus',
+    key: 'documentStatus',
+    width: 80,
+  },
+  {
+    title: '操作',
+    dataIndex: 'operation',
+    key: 'operation',
+    width: 80,
+  },
+].map(item => ({
+  ...item,
+  mainWidth: 60,
   maxWidth: 400,
 }));