zouyu
2023-12-22 4ba726492b0a81b5c9db460bec7d25fbe489cb23
src/views/plan/productionschedul/index.vue
@@ -2,32 +2,78 @@
  <div class="mod-config">
    <basic-container>
      <el-row>
        <el-col :span="12">
          <div style="height:80vh;padding: 0px 10px;">
            <avue-crud
            :data="tableData"
            ref="crud"
            :option="option"
            :span-method="spanMethod"
            @refresh-change="getData"
            @current-change="handleCurrentChange"
            @size-change="handleSizeChange"
            :page="page"
            @selection-change="selectionRow"
            :table-loading="loading">
            <template #menu="{ row, index }">
              <el-button type="text" icon="el-icon-edit" size="small" @click="editHandle(row, index)">编辑</el-button>
              <el-button type="text" icon="el-icon-delete" size="small" @click="deleteHandle(row, index)">删除</el-button>
            </template>
          </avue-crud>
          </div>
        <el-col :span="14">
          <el-row>
            <el-col :span="24">
              <div style="height:40vh;padding: 0px 10px;">
                <span style="position: relative;top:40px;">未完成</span>
                <span style="position: relative;top:30px;left:60%;z-index: 11">
                  <el-button @click="tagFinished" size="mini" round type="primary">标记已完成</el-button>
                  <el-button size="mini" round type="primary"
                  v-if="permissions.plan_productionschedul_edit_line"
                  @click="openEditDialog">编辑时间线</el-button>
                </span>
                <avue-crud
                :data="tableData"
                ref="crud"
                :option="option"
                :span-method="spanMethod"
                @refresh-change="getUnFinishedData"
                @current-change="handleCurrentChange"
                @size-change="handleSizeChange"
                :page="page"
                @selection-change="selectionRow"
                :table-loading="loading">
                <template #menu="{ row, index }">
                  <el-button
                  v-if="permissions.plan_productionschedul_edit"
                  type="text"
                  icon="el-icon-edit"
                  size="small"
                  @click="editHandle(row, index)">编辑</el-button>
                  <el-button
                  v-if="permissions.plan_productionschedul_del"
                  type="text"
                  icon="el-icon-delete"
                  size="small"
                  @click="deleteHandle(row, index)">删除</el-button>
                </template>
                </avue-crud>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div style="height:40vh;padding: 0px 10px;">
                <span style="position: relative;top:40px">已完成</span>
                <avue-crud
                :data="finishedTableData"
                ref="finished"
                :option="finishedOption"
                :span-method="spanMethod"
                @refresh-change="getFinishedData"
                @current-change="handleCurrentChange"
                @size-change="handleSizeChange"
                :page="finishedPage"
                @selection-change="selectionFinishedRow">
                <!-- <template #menu="{ row, index }">
                  <el-button
                  v-if="permissions.plan_productionschedul_del"
                  type="text"
                  icon="el-icon-delete"
                  size="small"
                  @click="deleteHandle(row, index)">删除</el-button>
                </template> -->
                </avue-crud>
              </div>
            </el-col>
          </el-row>
        </el-col>
        <el-col :span="12" style="padding-left: 10px">
        <el-col :span="10" style="padding-left: 10px">
          <div style="">
            <el-card>
              <div slot="header" class="clearfix">
                <span>调度时间线</span>
                <el-button v-if="scheduleList.length>0" @click="openEditDialog" style="float: right; padding: 3px 0" type="text">编辑</el-button>
              </div>
              <div style="height:70vh;overflow-y: scroll;">
                <el-timeline>
@@ -138,7 +184,7 @@
  fetchScheduleById,
  fillTime,
  deleteSchedul,
  updateSchedul
  updateState,
} from '@/api//plan/productionschedul'
import ttable from '@/views/common/ztt-table.vue'
import { mapGetters } from 'vuex'
@@ -158,14 +204,25 @@
      multipleSelection: [],
      loading: true,
      tableData: [],
      finishedTableData: [],
      page: {
        total: 10,
        total: 0,
        currentPage: 1,
        pageSize: 10,
        pagerCount: 5
      },
      finishedPage: {
        total: 0,
        currentPage: 1,
        pageSize: 10,
        pagerCount: 5
      },
      option: {
        height: 400,
        defaultSort:{
          prop:'id',
          order:'descending'
        },
        height: 200,
        selection: true,
        columnBtn: false,
        index: true,
@@ -269,7 +326,121 @@
          }
        ],
      },
      finishedOption: {
        refreshBtn: false, // 是否显示刷新按钮
        defaultSort:{
          prop:'id',
          order:'descending'
        },
        height: 180,
        selection: true,
        columnBtn: false,
        index: true,
        indexFixed: false,
        selectionFixed: false,
        rowKey: 'mid',
        indexLabel: '序号',
        menu: false,
        menuAlign: 'center',
        menuWidth: 130,
        editBtn: false,
        delBtn: false,
        addBtn: false,
        border: true,
        align: 'center',
        column: [
          {
            minWidth: 120,
            prop: 'projectName',
            label: '项目名称',
            overHidden: true,
          },
          {
            minWidth: 100,
            prop: 'contractNo',
            label: '合同号',
            overHidden: true,
          },
          {
            minWidth: 120,
            prop: 'orderTime',
            label: '接单日期',
            overHidden: true,
            formatter: (row,columnValue)=> this.formatDate(row,columnValue)
          },
          {
            minWidth: 120,
            prop: 'customerName',
            label: '客户名称',
            overHidden: true,
          },
          {
            minWidth: 120,
            prop: 'deliveryDate',
            label: '交货日期',
            overHidden: true,
            formatter: (row,columnValue)=> this.formatDate(row,columnValue)
          },
          {
            minWidth: 120,
            prop: 'productType',
            label: '产品类型',
            overHidden: true,
          },
          {
            minWidth: 120,
            prop: 'product',
            label: '产品名',
            overHidden: true,
          },
          {
            minWidth: 120,
            prop: 'specs',
            label: '规格型号',
            overHidden: true,
          },
          {
            minWidth: 120,
            prop: 'unit',
            label: '单位',
            overHidden: true,
          },
          {
            minWidth: 120,
            prop: 'number',
            label: '数量',
            overHidden: true,
          },
          {
            minWidth: 120,
            prop: 'productionStatus',
            label: '生产情况',
            overHidden: true,
          },
          {
            minWidth: 120,
            prop: 'productionRoutine',
            label: '生产程度',
            overHidden: true,
          },
          {
            minWidth: 120,
            prop: 'projectLeader',
            label: '项目负责人',
            overHidden: true,
          },
          {
            minWidth: 150,
            prop: 'remark',
            label: '备注',
            overHidden: true,
          }
        ],
      },
      spanArr: [{
        prop: 'id',
        span: []
      },{
        prop: 'projectName',
        span: []
      }, {
@@ -302,14 +473,18 @@
    ...mapGetters(['permissions']),
  },
  created(){
    if(!this.permissions.plan_productionschedul_edit && !this.permissions.plan_productionschedul_del){
      this.option.menu = false
    }
    this.loading = true
    this.getData()
    this.getUnFinishedData()
    this.getFinishedData()
    this.getParamType()
    this.rowSort()
    // this.rowSort()
    this.rowCalc()
  },
  beforeUpdate() {
    this.rowSort()
    // this.rowSort()
    this.rowCalc()
  },
  watch:{
@@ -329,13 +504,31 @@
  beforeDestroy() {
  },
  methods: {
    tagFinished(){
      if(this.multipleSelection.length < 1){
        this.$message.warning("请选择一条数据")
        return
      }
      let ids = this.multipleSelection.map(ele=>{
        return ele.mid
      })
      updateState(ids).then(res=>{
        if(res.status===200){
          this.$message.success("更新成功")
          this.getUnFinishedData()
          this.getFinishedData()
        }
      }).catch(error=>{
        console.error(error);
      })
    },
    confirmEdit(){
      const _than = this
      updateSchedul(this.editForm).then(res=>{
        if(res.status===200){
          _than.$message.success("更新成功")
          _than.editDialogVisible = false
          _than.getData()
          _than.getUnFinishedData()
        }
      }).catch(error=>{
        console.error(error);
@@ -350,6 +543,10 @@
      }
    },
    openEditDialog(){
      if(this.multipleSelection.length<1){
        this.$message.error("请至少选择一条数据")
        return
      }
      this.scheduleEditList = JSON.parse(JSON.stringify(this.scheduleList))
      this.dialogVisible = true
    },
@@ -441,15 +638,26 @@
      }
    },
    selectionRow(val){
      // if (val.length > 1) {
      //   const preVal = val.shift();
      //   this.$refs.crud.toggleRowSelection(preVal, false);
      // }
      // else{
      //   this.scheduleList=[]
      // }
      this.multipleSelection = val
      // this.getScheduleById(val[0].id)
    },
    selectionFinishedRow(val){
      console.log(val);
      if (val.length > 1) {
        const preVal = val.shift();
        this.$refs.crud.toggleRowSelection(preVal, false);
        this.$refs.finished.toggleRowSelection(preVal, false);
      }
      else{
        this.scheduleList=[]
      }
      this.multipleSelection = val
      this.getScheduleById(val[0].id)
      this.getScheduleById(val[0].mid)
    },
    formatDate(row, cellValue){
      if (cellValue) {
@@ -463,26 +671,42 @@
    handleSizeChange(val){
      if(val){
        this.page.pageSize=val
        this.getData()
        this.getUnFinishedData()
      }
    },
    handleCurrentChange(val){
      if(val){
        this.page.currentPage=val
        this.getData()
        this.getUnFinishedData()
      }
    },
    // 获取数据列表
    getData() {
    getUnFinishedData() {
      this.loading = true
      let param = {
        size: this.page.pageSize,
        current: this.page.currentPage,
        state: false
      }
      fetchScheduleList(param).then((res) => {
        this.tableData = res.data.data.records
        this.page.total = res.data.data.total
        this.page.currentPage = res.data.data.records.pages
        this.scheduleList = []
      })
      this.loading = false
    },
    getFinishedData() {
      this.loading = true
      let param = {
        size: this.finishedPage.pageSize,
        current: this.finishedPage.currentPage,
        state: true
      }
      fetchScheduleList(param).then((res) => {
        this.finishedTableData = res.data.data.records
        this.finishedPage.total = res.data.data.total
        this.finishedPage.currentPage = res.data.data.records.pages
        this.scheduleList = []
      })
      this.loading = false
@@ -513,7 +737,7 @@
        ele.span = this.rowSpan(ele.prop, parent)
      })
    },
    rowSort(list) {
    rowSort() {
      let propList = this.spanArr.map(ele => ele.prop)
      this.spanArr.forEach((ele, index) => {
        let key = ele.prop
@@ -572,10 +796,16 @@
  }
}
</script>
<style scoped>
.el-tag--small{
<style>
.avue-crud__tip{
  display: none;
}
.avue-crud__pagination {
    position: relative;
    padding: 5px 0 20px 20px;
    text-align: right;
    z-index: 10;
}
.basic-template-table .el-table__body .el-table__row td:first-child .cell {
  padding-left: 0px;
  padding-right: 0px;