csc-szls-vue/shanXiPlatform/src/views/home/daiBan/initiated/index.vue

<template>
  <div id="inimain">
    <div class="inicontainer" v-if="isShow">
      <div
        class="top"
        v-for="(item, index) in initiatedList"
        :key="index"
        @click="goDetails(item)"
      >
        <div class="header" style="font-weight: 500px">
          <i class="iconfont iconshu"></i>
          {{ item.workName }}
        </div>
        <div class="middle">
          <div class="middle_flex" v-if="item.houseId && item.workName.indexOf('药剂') == -1 && item.type !== 'code1'">
            <div>仓号:</div>
            <div>{{ hourseDic[item.houseId] }}</div>
          </div>
          <div class="middle_flex">
            <div>申请人:</div>
            <div>{{ item.applyName }}</div>
          </div>
          <div class="middle_flex">
            <div>申请部门:</div>
            <div>{{ item.departmentName }}</div>
          </div>
          <div class="middle_flex">
            <div>公司:</div>
            <div>{{ item.companyName }}</div>
          </div>
        </div>
        <div class="div_border"></div>
        <div class="bottom_flex">
          <div class="applyTime">{{ item.applyTime }}</div>
          <span @click="goDetails(item)" v-if="item.auditState == 0"
            >审批中</span
          >
          <!-- <el-button
            type="success"
            size="mini"
            plain
            @click="goDetails(item)"
            v-if="item.auditState == 0"
          >
            待审批
          </el-button> -->
          <span
           
            @click="goDetails(item)"
            v-else-if="item.auditState == 1"
            >审批中</span
          >
          <!-- <el-button
               type="success"
            size="mini"
            plain 
            @click="goDetails(item)" v-else-if="item.auditState == 1"
            >审批通过</el-button
          > -->

          <span
            style="color: red"
            @click="goDetails(item)"
            v-else-if="item.auditState == 2"
            >审批不通过</span
          >
          <!-- <el-button 
           style="background:#ec1313;color:white"
            size="mini"
            @click="goDetails(item)" v-else-if="item.auditState == 2"
            >审批不通过</el-button
          > -->
          <span style="color:#037D41" @click="goDetails(item)" v-else-if="item.auditState == 3"
            >审批通过</span
          >
          <!-- <el-button 
             type="success"
            size="mini"
            plain 
          @click="goDetails(item)" v-else-if="item.auditState == 3"
            >审批完成进行中</el-button
          > -->
          <span style="color:#037D41" @click="goDetails(item)" v-else>审批通过</span>
          <!-- <el-button 
              type="success"
            size="mini"
            plain 
           @click="goDetails(item)" v-else>已完成</el-button> -->
        </div>
      </div>
      <el-pagination
      background
      @size-change="sizeChange"
       v-if="pagination.total != 0"
        @current-change="handleCurrentChange"
        :page-count="5"
        :page-sizes="[10, 20, 30, 40]"
        :page-size="pagination.pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="pagination.total"
      ></el-pagination>
    </div>

    <div>
      <router-view />
    </div>
  </div>
</template>
<script>
import { initiated } from "@/api/daiBan/index"
import { getUser } from "@/utils/auth"
export default {
  name: "Initiated",
  data() {
    return {
      //列表数据的长度
      initLength: null,
      //人员字典数据
      perList: {},
      //库字典数据
      deportDic: {},
      //仓房字典数据
      hourseDic: {},
      //部门字典数据
      departDic: {},
      //审批流程id
      processId: "",
      isShow: true,
      //存储用户信息
      userInfo: {},
      //已发起列表
      initiatedList: [],
      //分页

      pagination: {
        //当前页数
        curPage: 1,
        //每页显示的条数
        pageSize: 10,
        //总条数
        total: 0,
      },
    }
  },
  mounted() {
   
    console.log(this.$route)
    if (this.$route.name == "IniDetails" || this.$route.name == "IniXunzengDetails") {
      this.isShow = false
    } else {
      this.isShow = true
    }
   
    this.userInfo = JSON.parse(getUser())
    console.log(this.userInfo, "this.userInfo.....?????")
    this.getInitiated()
    //人员
    this.perList = JSON.parse(localStorage.getItem("perList"))
    console.log(this.perList, " this.perList...")
    //库字典数据
    this.deportDic = JSON.parse(localStorage.getItem("deportDic"))
    console.log(this.deportDic, " this.deportDic...")
    //仓房字典数据
    this.hourseDic = JSON.parse(localStorage.getItem("hourseDic"))
    console.log(this.hourseDic, " this.hourseDic...")

    //部门字典数据
    this.departDic = JSON.parse(localStorage.getItem("departDic"))
    console.log(this.departDic, " this.departDic...")
  },
  methods: {
    goDetails(item) {
      //   let userInfo = JSON.parse(getUser())
      //  console.log(userInfo,"/////")
      //   let homeType = userInfo.homeType
      var homeType = this.userInfo.homeType
      if(item.type == 'xzjh' || item.type == 'xzsq' || item.type == 'sswxjh' || item.type == 'sswxys' || item.type == 'sbcg'|| item.type == 'sbwx'||item.type == 'sbbf'||item.type == 'sbly'||item.type == 'sbgh'){
        if (homeType == 1) {
          this.$router.push({
            path: "/dashboard/daiban/initiated/inixunzengDetails",
            query: {
              processId: item.processId,
              houseName: item.houseName,
              applyName: item.applyName,
              departmentName: item.departmentName,
              companyName: item.companyName,
              workName: item.workName,
              ongoingStep: item.ongoingStep,
              type: item.type
            },
          })
        } else if (homeType == 2) {
          this.$router.push({
            path: "/dashboard/daiban/initiated/inixunzengDetails",
            query: {
              processId: item.processId,
              houseName: item.houseName,
              applyName: item.applyName,
              departmentName: item.departmentName,
              companyName: item.companyName,
              workName: item.workName,
              ongoingStep: item.ongoingStep,
              type: item.type
            },
          })
        } else if (homeType == 3) {
          this.$router.push({
            path: "/home/daiban/initiated/inixunzengDetails",
            query: {
              processId: item.processId,
              houseName: item.houseName,
              applyName: item.applyName,
              departmentName: item.departmentName,
              companyName: item.companyName,
              workName: item.workName,
              ongoingStep: item.ongoingStep,
              type: item.type
            },
          })
        }
      }else{
        if (homeType == 1) {
          this.$router.push({
            path: "/dashboard/daiban/initiated/iniDetails",
            query: {
              processId: item.processId,
              houseName: item.houseName,
              applyName: item.applyName,
              departmentName: item.departmentName,
              companyName: item.companyName,
              workName: item.workName,
              ongoingStep: item.ongoingStep
            },
          })
        } else if (homeType == 2) {
          this.$router.push({
            path: "/dashboard/daiban/initiated/iniDetails",
            query: {
              processId: item.processId,
              houseName: item.houseName,
              applyName: item.applyName,
              departmentName: item.departmentName,
              companyName: item.companyName,
              workName: item.workName,
              ongoingStep: item.ongoingStep
            },
          })
        } else if (homeType == 3) {
          this.$router.push({
            path: "/home/daiban/initiated/iniDetails",
            query: {
              processId: item.processId,
              houseName: item.houseName,
              applyName: item.applyName,
              departmentName: item.departmentName,
              companyName: item.companyName,
              workName: item.workName,
              ongoingStep: item.ongoingStep
            },
          })
        }
      }
    },
    //列表数据
    getInitiated() {
      var condition = {
        userId: this.userInfo.uid,
      }
      console.log(condition, "condition.....")
      condition = JSON.stringify(condition)
      var data = {
        pageIndex: this.pagination.curPage,
        pageSize: this.pagination.pageSize,
        condition: condition,
      }
      initiated(data).then((res) => {
        console.log(res, "res....")
        if (res.code == 200) {
          this.initiatedList = res.data.records
          this.initLength = this.initiatedList.length
          console.log(this.initLength, " this.initLength.....")
          this.pagination.total = res.data.total
        }
      })
    },
    //当前页发生变化时
    handleCurrentChange(val) {
      console.log(val, "val...")
      this.pagination.curPage = val
      this.getInitiated()
    },

       //页数大小发生变化时
    sizeChange(v) {
      this.pagination.pageSize = v;
      this.getInitiated();
    },
  },
}
</script>
<style lang="scss" >
#inimain {
  // height: 100%;
  .inicontainer {
    width: 100%;

    .top {
      height: 150px;
      background: #ffffff;

      border-radius: 6px;
      padding: 10px;
      margin-bottom: 10px;
      .header {
        font-weight: 500;
        font-size: 18px;
        color: #037d41;
        height: 20%;
        margin-bottom: 20px;
      }
      .middle {
        margin-bottom: 20px;
        width: 80%;
        display: flex;

        justify-content: space-between;
        margin-left:20px;
        .middle_flex {
          display: flex;
     
        }
      }
      .div_border {
       border-top: 1px solid #f3f3f3;
        margin-bottom: 20px;
      }

      .bottom_flex {
        margin-left:20px;
        display: flex;
        justify-content: space-between;
          .applyTime{
          color: #999;
          font-size:14px
        }
      }
    }
    .el-pagination {
      text-align: right;
      margin-top: 20px;
    }
  }
}
</style>