tatolpage

付延余

2022-07-26 7c3218e12105b87cab21e9ced57c99c339ffac10

 pages/approval-history/approval-history.vue

@@ -1,117 +1,152 @@
<template>
   <!-- 审批历史 -->
   <view class="approval-history">
      <combined-title title="查看进度"></combined-title>
      <view class="historyTable">
      <combined-title title="审批历史"></combined-title>
      <u-empty v-if="scheduleData.length == 0"
              mode="data"
              icon="http://cdn.uviewui.com/uview/empty/data.png" 
                  width="100px"
                  height="150px"
      >
      </u-empty>
      <view class="scheduleTable" v-for="(item,index) in scheduleData" :key="index">
         <uni-table border stripe emptyText="暂无更多数据">
            <!-- 表格数据行 -->
            <uni-tr>
               <uni-th align="center">任务名称</uni-th>
               <uni-td>{{yibanData.renwu}}</uni-td>
               <uni-td>{{ item.name }}</uni-td>
            </uni-tr>
            <uni-tr>
               <uni-th align="center">处理人</uni-th>
               <uni-td>XXX XXX XXX XXX</uni-td>
               <uni-td>
                  <view class="">
                     <u-tag :text="role.nickname" type="primary" size="mini" style="display:inline-block;margin-left: 5%;" plain v-for="(role,roleIndex) in item.assignees" :key="roleIndex"></u-tag>
                  </view>
               </uni-td>
            </uni-tr>
            <uni-tr>
               <uni-th align="center">审批操作</uni-th>
               <uni-td>——</uni-td>
               <uni-td>{{item.deleteReason}}</uni-td>
            </uni-tr>
            <uni-tr>
               <uni-th align="center">审批意见</uni-th>
               <uni-td>{{yibanData.shenpiyijian}}</uni-td>
               <uni-td>{{ item.comment }}</uni-td>
            </uni-tr>
            <uni-tr>
               <uni-th align="center">耗时</uni-th>
               <uni-td>{{yibanData.haoshi}}</uni-td>
               <uni-td>{{
                  item.duration >= 86400000
                              ? parseInt(item.duration / 86400000 + '天' + parseInt(item.duration % 86400000) / 3600000 + '时' + parseInt(item.duration % 3600000) / 60000 + '分')
                              : item.duration >= 3600000
                              ? parseInt(item.duration / 3600000) + '时' + parseInt((item.duration / 3600000) % 3600000) + '分'
                              : parseInt(item.duration / 60000) + '分'
                              }}
                              </uni-td>
            </uni-tr>
            <uni-tr>
               <uni-th align="center">创建时间</uni-th>
               <uni-td>{{yibanData.createTime}}</uni-td>
               <uni-td>{{ item.createTime }}</uni-td>
            </uni-tr>
            <uni-tr>
               <uni-th align="center">完成时间</uni-th>
               <uni-td>——</uni-td>
               <uni-td>{{ item.endTime }}</uni-td>
            </uni-tr>
            <uni-tr>
               <uni-th align="center">状态</uni-th>
               <uni-td style="color:#007AFF" >待处理</uni-td>
               <uni-td :style="{color:(item.endTime==null?'#969696':'#007AFF')}">{{ item.endTime ==null? '待处理' : '已办理' }}</uni-td>
            </uni-tr>
         </uni-table>
      </view>
		

      <!-- 菜单栏 -->
      <popup-menu @menuShow="menushow" ref="menuRef"></popup-menu>
   </view>
</template>

<script>
   import popupMenu from '@/components/common/popup-menu/popup-menu.vue';
   import combinedTitle from '@/components/common/combined-title/combined-title.vue';
   export default {
      data() {
         return {
            yibanData:
               {
                  meizhongshenqing:'葛泉矿申请：煤矸石',
                  renwu:'发运审批',
                  liucheng:'发运通知单',
                  faqiren:'葛泉矿',
                  shenpiCaozuo:'审批通过',
                  shenpiyijian:'同意',
                  haoshi:'19秒',
                  createTime:'2022-5-25 12:06:15'
               },
            menuShow:false
         };
      },
      // 点击导航栏菜单后
      onNavigationBarButtonTap(e) {
         // console.log(e);
import popupMenu from '@/components/common/popup-menu/popup-menu.vue';
import combinedTitle from '@/components/common/combined-title/combined-title.vue';
export default {
   data() {
      return {
         scheduleData: [],
            // meizhongshenqing: '葛泉矿申请：煤矸石',
            // renwu: '发运审批',
            // liucheng: '发运通知单',
            // faqiren: '葛泉矿',
            // shenpiCaozuo: '审批通过',
            // shenpiyijian: '同意',
            // haoshi: '19秒',
            // createTime: '2022-5-25 12:06:15'
         applicationId:null,
         menuShow:false,
         ifEmpty:false
      };
   },
   onLoad(options){
      this.applicationId = JSON.parse(options.index);
   },
   // 点击导航栏菜单后
   onNavigationBarButtonTap(e) {
      // console.log(e);
      this.$refs.menuRef.menuClick();
   },
   onShow(){
      if(this.menuShow == true){
         this.$refs.menuRef.menuClick()
      }
      this.init();
   },
   components: {
      combinedTitle,
      popupMenu
   },
   methods: {
      init(){
         this.historicFlow()
      },
      onShow(){
         if(this.menuShow == true){
            this.$refs.menuRef.menuClick()
         }
      historicFlow(){
         this.$reqGet('historicFlow',{},this.applicationId).then(res=>{
            console.log('审批历史',res);
				
            if(res.code == 0){
               if(res.data == null){
                  this.ifEmpty = true
               } else{
                  this.scheduleData = res.data
               }
            }
         })
      },
      components: {
         combinedTitle,
         popupMenu
      },
      methods:{
         menushow(e){
            this.menuShow = e
         }
      menushow(e){
         this.menuShow = e
      }
   }
};
</script>

<style lang="scss" scoped>
.approval-history{
::v-deep.approval-history {
   width: 100%;
   height: 100%;
   // 表格
   .historyTable{
      margin:0 auto;
      width:91%;
      .uni-table{
			
         .uni-table-tr{
            .uni-table-th{
               width:vww(88);
               height:vww(40);
               background-color: #F5F5F5;
               color:#111111;
               font-size:vww(13);
   .scheduleTable {
      margin: vww(10) auto 0;
      width: 91%;
      .uni-table {
         .uni-table-tr {
            .uni-table-th {
               width: vww(88);
               height: vww(40);
               background-color: #f5f5f5;
               color: #111111;
               font-size: vww(13);
               font-weight: 500;
            }
            .uni-table-td{
               width:vww(240);
               height:vww(40);
               background-color: #FFFFFF;
               color:#111111;
               font-size:vww(13);
            .uni-table-td {
               width: vww(240);
               height: vww(40);
               background-color: #ffffff;
               color: #111111;
               font-size: vww(13);
            }
         }
      }