yos_web/src/HDrpManagement/dataanalysis/modules/project.vue

<template>
  <div>
    <el-scrollbar >
      <div style="margin: auto;">
        <div id="projectAddFull" style="background: #FFFFFF" :style="{padding:isFull ?'16px':0}">
          <div style="display: flex;justify-content: space-between">
            <div>
              <span style="font-size: 16px;color: #333">{{$t(`新增项目`)}}</span>
            </div>
            <div>
              <quickDate class="inline-16" ref="quickAdd" @selectQuick="selectQuickAdd" :disabled="disabled"></quickDate>
              <fullScreen ref="addFullRef" class="inline-16" domId="projectAddFull" @onFull="onFull('新增')" @backFull="backFull('新增')"></fullScreen>
            </div>
          </div>
          <tableLayout style="margin-top: 10px" :layout="tablecolsAdd" :data="listAdd" :opwidth="200" :custom="true" :height="isFull ?'calc(100vh - 150px)':tableHeight">
            <template v-slot:customcol="scope">
              <p>{{scope.column.data[scope.column.columnname]?$t(scope.column.data[scope.column.columnname]):'--'}}</p>
            </template>
          </tableLayout>
          <div class="container normal-panel" style="text-align:right">
            <el-pagination
                background
                @size-change="handleSizeChangeAdd"
                @current-change="handleCurrentChangeAdd"
                :current-page="currentPageAdd"
                :page-sizes="isFull ?[100,150, 200, 250]:[10,20, 50, 100, 200]"
                :page-size="isFull ?100:10"
                layout="total,sizes, prev, pager, next, jumper"
                :total="totalAdd">
            </el-pagination>
          </div>
        </div>
       <div id="projectUpdFull" style="background: #FFFFFF" :style="{padding:isFull ?'16px':0}">
         <div style="display: flex;justify-content: space-between">
           <div>
             <span style="font-size: 16px;color: #333">{{$t(`更新项目`)}}</span>
           </div>
           <div>
             <quickDate class="inline-16"  ref="quickUpd" @selectQuick="selectQuickUpd"></quickDate>
             <fullScreen ref="updFullRef" class="inline-16" domId="projectUpdFull" @onFull="onFull('更新')" @backFull="backFull('更新')"></fullScreen>
           </div>
         </div>
         <tableLayout style="margin-top: 10px" :layout="tablecolsUpdate" :data="listUpdate" :opwidth="200" :custom="true" :height="isFull ?'calc(100vh - 150px)':tableHeight">
           <template v-slot:customcol="scope">
             <p>{{scope.column.data[scope.column.columnname]?$t(scope.column.data[scope.column.columnname]):'--'}}</p>
           </template>
         </tableLayout>
         <div class="container normal-panel" style="text-align:right">
           <el-pagination
               background
               @size-change="handleSizeChangeUpdate"
               @current-change="handleCurrentChangeUpdate"
               :current-page="currentPageUpdate"
               :page-sizes="isFull ?[100,150, 200, 250]:[10,20, 50, 100, 200]"
               :page-size="isFull ?100:10"
               layout="total,sizes, prev, pager, next, jumper"
               :total="totalUpdate">
           </el-pagination>
         </div>
       </div>
       <div id="projectFowFull" style="background: #FFFFFF" :style="{padding:isFull ?'16px':0}">
         <div style="display: flex;justify-content: space-between">
           <div>
             <span style="font-size: 16px;color: #333">{{$t(`跟进项目`)}}</span>
           </div>
           <div>
             <quickDate class="inline-16" ref="quickFow" @selectQuick="selectQuickFow" :disabled="disabled"></quickDate>
             <fullScreen ref="fowFullRef" class="inline-16" domId="projectFowFull" @onFull="onFull('跟进')" @backFull="backFull('跟进')"></fullScreen>
           </div>
         </div>
         <tableLayout style="margin-top: 10px" :layout="tablecolsFollow" :data="listFollow" :opwidth="200" :custom="true" :height="isFull ?'calc(100vh - 150px)':tableHeight">
           <template v-slot:customcol="scope">
             <p v-if="scope.column.columnname === 'followname'">
              <span v-if="scope.column.data.followname.length > 0">
                <span v-for="(item,index) in scope.column.data.followname">
                <span v-if="index === scope.column.data.followname.length -1">
                  {{$t(item)}}
                </span>
                <span v-else>
                  {{item + ','}}
                </span>
              </span>
              </span>
               <span v-else>--</span>
             </p>
             <p v-else>{{scope.column.data[scope.column.columnname]?$t(scope.column.data[scope.column.columnname]):'--'}}</p>
           </template>
         </tableLayout>
         <div class="container normal-panel" style="text-align:right">
           <el-pagination
               background
               @size-change="handleSizeChangeFollow"
               @current-change="handleCurrentChangeFollow"
               :current-page="currentPageFollow"
               :page-sizes="isFull ?[100,150, 200, 250]:[10,20, 50, 100, 200]"
               :page-size="isFull ?100:10"
               layout="total,sizes, prev, pager, next, jumper"
               :total="totalFollow">
           </el-pagination>
         </div>
       </div>
      </div>

    </el-scrollbar>
  </div>
</template>

<script>
import quickDate from "@/HDrpManagement/dataanalysis/components/quickDate";
import tableLayout from '@/components/table/index9'
import fullScreen from "@/views/salesData/components/fullScreen";
export default {
  name: "project",
  props:['param','isDep','dataid','isPerson'],
  components:{quickDate,tableLayout,fullScreen},
  data() {
    return {
      listAdd:[],
      tablecolsAdd:[],
      listUpdate:[],
      tablecolsUpdate:[],
      tableHeight:'',
      currentPageAdd:0,
      totalAdd:0,
      currentPageUpdate:0,
      totalUpdate:0,
      listFollow:[],
      tablecolsFollow:[],
      currentPageFollow:0,
      totalFollow:0,
      begindate:'',
      enddate:'',
      selectAdd:'月',
      selectUpd:'月',
      selectFow:'月',
      sort:[
        {
          reversed : 0,
          sorted: 1,
          sortid: 207,
          sortname: "新增，更新排序"
        },
        {
          reversed : 0,
          sorted: 1,
          sortid: 208,
          sortname: "跟进排序"
        }
      ],
      isFull:false,
      disabled:false
    }
  },
  methods:{
    async queryAdd(){
      this.param.content.dataType = 7
      this.param.content.where.begindate = this.selectAdd ? '' :this.begindate
      this.param.content.where.enddate = this.selectAdd ? '' : this.enddate
      this.param.content.dateType = this.selectAdd
      this.param.content.dataid = this.dataid
      this.param.content.type = this.isDep?1:0
      this.param.content.sort = [this.sort[0]]
      const res = await this.$api.requested(this.param)
      this.listAdd = res.data
      this.currentPageAdd = res.pageNumber
      this.totalAdd = res.total
    },
    handleSizeChangeAdd(val) {
      // console.log(`每页 ${val} 条`);
      this.param.content.pageSize = val
      this.queryAdd()
    },
    handleCurrentChangeAdd(val) {
      // console.log(`当前页: ${val}`);
      this.param.content.pageNumber = val
      this.queryAdd()
    },
    async queryUpdate(){
      this.param.content.dataType = 8
      this.param.content.where.begindate = this.selectUpd ? '' :this.begindate
      this.param.content.where.enddate = this.selectUpd ? '' : this.enddate
      this.param.content.dateType = this.selectUpd
      this.param.content.dataid = this.dataid
      this.param.content.type = this.isDep?1:0
      this.param.content.sort = [this.sort[0]]
      const res = await this.$api.requested(this.param)
      this.listUpdate = res.data
      this.currentPageUpdate = res.pageNumber
      this.totalUpdate = res.total
    },
    handleSizeChangeUpdate(val) {
      // console.log(`每页 ${val} 条`);
      this.param.content.pageSize = val
      this.queryUpdate()
    },
    handleCurrentChangeUpdate(val) {
      // console.log(`当前页: ${val}`);
      this.param.content.pageNumber = val
      this.queryUpdate()
    },
    async queryFollow(){
      this.param.content.dataType = 9
      this.param.content.where.begindate = this.selectFow ? '' :this.begindate
      this.param.content.where.enddate = this.selectFow ? '' : this.enddate
      this.param.content.dateType = this.selectFow
      this.param.content.dataid = this.dataid
      this.param.content.type = this.isDep?1:0
      this.param.content.sort = [this.sort[1]]
      const res = await this.$api.requested(this.param)
      this.listFollow = res.data
      this.currentPageFollow = res.pageNumber
      this.totalFollow = res.total
    },
    handleSizeChangeFollow(val) {
      // console.log(`每页 ${val} 条`);
      this.param.content.pageSize = val
      this.queryFollow()
    },
    handleCurrentChangeFollow(val) {
      // console.log(`当前页: ${val}`);
      this.param.content.pageNumber = val
      this.queryFollow()
    },
    /*日期筛选*/
    selectQuickAdd(begindate,enddate,select){
      this.begindate = begindate
      this.enddate = enddate
      this.selectAdd = select
      this.queryAdd(this.param.content.pageNumber = 1)
    },
    selectQuickUpd(begindate,enddate,select){
      this.begindate = begindate
      this.enddate = enddate
      this.selectUpd = select
      this.queryUpdate(this.param.content.pageNumber = 1)
    },
    selectQuickFow(begindate,enddate,select){
      this.begindate = begindate
      this.enddate = enddate
      this.selectFow = select
      this.queryFollow(this.param.content.pageNumber = 1)
    },
    onFull(type){
      if (type == '新增'){
        this.param.content.dataType = 7
        this.param.content.pageNumber = 1
        this.param.content.pageSize = 100
        this.queryAdd()
        this.isFull = true
      }else if (type == '更新'){
        this.param.content.dataType = 8
        this.param.content.pageNumber = 1
        this.param.content.pageSize = 100
        this.queryUpdate()
        this.isFull = true
      }else if (type == '跟进'){
        this.param.content.dataType = 9
        this.param.content.pageNumber = 1
        this.param.content.pageSize = 100
        this.queryFollow()
        this.isFull = true
      }
    },
    backFull(type){
      if (type == '新增'){
        this.param.content.dataType = 7
        this.param.content.pageNumber = 1
        this.param.content.pageSize = 10
        this.queryAdd()
        this.disabled = false
        this.isFull = false
      }else if (type == '更新'){
        this.param.content.dataType = 8
        this.param.content.pageNumber = 1
        this.param.content.pageSize = 10
        this.queryUpdate()
        this.isFull = false
      }else if (type == '跟进'){
        this.param.content.dataType = 9
        this.param.content.pageNumber = 1
        this.param.content.pageSize = 10
        this.queryFollow()
        this.disabled = false
        this.isFull = false
      }
    }
  },
  created() {
    this.tablecolsAdd = this.tool.tabelCol(this.$route.name).projectAdd.tablecols
    this.tablecolsUpdate = this.tool.tabelCol(this.$route.name).projectUpdate.tablecols
    this.tablecolsFollow = this.tool.tabelCol(this.$route.name).projectFollow.tablecols
  }
}
</script>

<style scoped>

</style>