faw-report-library-web/src/views/userCenter/processCenter/taskDraft.vue

<template>
  <div>
    <div class="table">
      <vxe-table  ref="xTable" :data="tableData" :empty-render="{name: 'NotData'}" align="center" border stripe v-table-min-height="'calc(100vh - 380px)'">
        <vxe-column show-overflow show-header-overflow type="seq" title="序号" width="77">
          <template #default="{ row, rowIndex }">
            {{ rowIndex + (q.current - 1) * q.size + 1 }}
          </template>
        </vxe-column>
        <vxe-column show-overflow show-header-overflow field="prcNum"
                    title="流程编号">
          <template #default="{ row,index }" >
            <div class="blurcolor" @click="handle(row)">{{row.prcNum}}</div>
          </template>
        </vxe-column>
        <vxe-column show-overflow show-header-overflow field="prcType"
                    title="流程类型">
          <template #default="{ row,index }">
            <div>{{getPrcName(row.prcType)}}</div>
          </template>
        </vxe-column>
        <vxe-column show-overflow show-header-overflow field="prcName" title="流程名称">
          <template #default="{ row,index }" >
            <div class="blurcolor" @click="handle(row)">{{row.prcName}}</div>
          </template>
        </vxe-column>
        <vxe-column show-overflow show-header-overflow field="creatUserName"
                    title="发起人"></vxe-column>
        <vxe-column show-overflow show-header-overflow field="creatTime" title="创建时间"></vxe-column>
        <vxe-column show-overflow show-header-overflow title="操作" width="200" fixed="right">
          <template #default="{ row }">
            <el-button @click.native.prevent="handle(row)" type="text" size="small">
              办理
            </el-button>
            <el-button @click.native.prevent="classDel(row.id)" type="text" size="small" class="deleRed">
              删除
            </el-button>
          </template>
        </vxe-column>
      </vxe-table>
      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="q.current"
                     :page-sizes="[5, 10, 20]" :page-size="q.size" layout="total, sizes, prev, pager, next, jumper"
                     :total="total" />
    </div>
  </div>
</template>

<script>
import ProcessMixin from "../../../components/ProcessMixin";
export default {
  name: "gencyProcess",
  mixins:[ProcessMixin],
  data() {
    return {
      q:{
        current:1,
        size:10
      },
      total: 0,
      tableData: []
    };
  },
  props:{
    form:{
      type:Object,
      default:{},
    }
  },

  watch: {
    form:{
      handler(){
        console.log("我见他",this.form)
        this.loadData()
      },
      deep:true
    }
  },
  mounted () {
    this.loadData()
  },
  methods: {
    classDel(row) {
      this.$confirm('确认删除该条数据?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        confirmButtonClass: 'common-button-primary',

      }).then(() => {
          this.$api.processCenter.delDraf({id:row}).then(()=>{
            this.$message.success('删除成功')
            this.q.current  = 1
            this.loadData()
          })
      })
    },
    loadData() {
      let userId=this.$store.getters.userInfo.usid
      this.$api.processCenter.draftProcessPage({...this.q,...this.form,userId:userId}).then(res=>{
        this.tableData = res.data.list
        this.total = res.data.count
      })
    },
    // 单页数据量
    handleSizeChange(val) {
      this.q.size = val;
      this.q.current = 1;
      this.loadData();
    },
    // 第几页
    handleCurrentChange(val) {
      this.q.current = val;
      this.loadData();
    },
    handle(row) {
      let params = row
      this.$store.commit('setHandleProcess',params)
      switch (row.prcType) {
        case '1' :
            this.$router.push({
              path: '/permission/launch',
              query: {
                id: this.$route.query.id,
                isDraft: 1,
              }
            });break;
        case '2' :
          this.$router.push({
            path: '/permission/launch',
            query: {
              id: this.$route.query.id,
              isDraft: 1,
            }
          });break;
        case '3' :
          this.$router.push({
            path: '/permission/launch',
            query: {
              id: this.$route.query.id,
              isDraft: 1,
            }
          });break;
        case '4' :
          this.$router.push({
            path: '/reportprocess/launch',
            query: {
              id: this.$route.query.id,
              isDraft: 1
            }
          });break;

      }
    },
  },
};
</script>

<style lang="scss" scoped>
::v-deep .el-table__fixed, ::v-deep .el-table__fixed-right ::before{
  height: 0px !important;

}
.table {
  margin: 0 14px 0 13px;
  ::v-deep .el-pagination {
    margin-top: 13px;
    padding-left: 20px;
    padding-bottom: 10px;
  }
}
.deleRed{
  color: red !important;
}
</style>