xujiecloud-vue/src/views/modules/scheduling/scheduling.vue

<script>
import {getAllBuList} from "../../../api/factory/site";
import {
  cancelPurchaseOrder,
  closePurchaseOrder,
  queryPurchaseOrder, queryPurchaseOrder2,
  queryPurchaseOrderHead
} from "../../../api/partspare/purchaseOrder";
import {
  getSiteAndBuByUserName,
  getUserRoleList,
  getOperatorList
} from "@/api/eam/eam.js"
import ExportUtil from "@/utils/export";
import {
  searchSamplingProgrammeDetails, // 搜索抽样方案中的矩阵
  getPlanLists, // 获取矩阵列表
  saveSamplingProgrammeDetails, // 新增抽样方案中的矩阵
  deleteSamplingProgrammeDetails, // 删除抽样方案中的矩阵
} from "@/api/qc/qc.js";
import {
  getClassesList,
  querySchedulingList,
  saveSchedulingHeader,
  querySaveSchedulingRecord,
  deleteSchedulingRecord,
  editSaveSchedulingRecord
} from "../../../api/scheduling/scheduling";

export default {
  name: "scheduling",
  data(){
    return{
      span:3,
      saveSchedulingFlag: false,
      fastAddFlag: false,
      insertSchedulingFlag: false,
      detailData: {
        site: '',
        bu: '',
        adminID: '',
        adminName: '',
        roleId: '',
        roleName: '',
      },
      editFlag: false,
      initFlag: false,
      schedulingRecordData:{},
      peopleList:[],
      peopleList2:[],
      itemList1: [],
      itemList2: [],
      roleList: [],
      queryParams: {
        site: '',
        classesCode:'',
        buDesc: '',
        partNo: '',
        partDescription: '',
        status: '',
        startDate: null,
        endDate: null,
        no: 1,
        size: 50,
        purchaseOrderNo:'',
        isExport:'',
        exportBy:'',
        exportTime:null,
        status:''
      },
      saveData:{
        checkbox1: false,
        checkbox2: false
      },
      activeName:'detail',
      userBuList: [],
      classesList: [],
      classesList2: [],
      dataList: [],
      dataListHead:[],
      queryLoading: false,
      saveErrorFlag: false,
      total:0,
      totalHead:0,
      queryLineRow:{},
      columns:[
        {
          userId: this.$store.state.user.name,
          functionId: 200101107,
          serialNumber: '200101107Table1headNum',
          tableId: '200101107Table1',
          tableName: '备品备件采购表',
          columnProp: 'adminId',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '人员编码',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 80
        },
        {
          userId: this.$store.state.user.name,
          functionId: 200101107,
          serialNumber: '200101107Table1BuDesc',
          tableId: '200101107Table1',
          tableName: '备品备件采购表',
          columnProp: 'adminName',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '人员名称',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 80
        },
        {
          userId: this.$store.state.user.name,
          functionId: 200101107,
          serialNumber: '200101107Table1PartNo',
          tableId: '200101107Table1',
          tableName: '备品备件采购表',
          columnProp: 'isHoliday',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '是否请假',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 120
        }
      ],
      columns_head:[
        {
          userId: this.$store.state.user.name,
          functionId: 200101106,
          serialNumber: '200101106Table1BuDesc',
          tableId: '200101106Table1',
          tableName: '备品备件采购表',
          columnProp: 'classesCode',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '班次编码',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 80
        },
        {
          userId: this.$store.state.user.name,
          functionId: 200101106,
          serialNumber: '200101106Table1BuDesc',
          tableId: '200101106Table1',
          tableName: '备品备件采购表',
          columnProp: 'classesDescription',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '班次名称',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 80
        },
        {
          userId: this.$store.state.user.name,
          functionId: 200101107,
          serialNumber: '200101107Table1purchaseOrderNo',
          tableId: '200101107Table1',
          tableName: '备品备件采购表',
          columnProp: 'date',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '日期',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 80
        },
        {
          userId: this.$store.state.user.name,
          functionId: 200101107,
          serialNumber: '200101107Table1createTime',
          tableId: '200101107Table1',
          tableName: '备品备件采购表',
          columnProp: 'buNo',
          headerAlign: 'center',
          align: 'center',
          columnLabel: 'BU',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 80
        }
      ],
      column_people:[
        {
          userId: this.$store.state.user.name,
          functionId: 200101106,
          serialNumber: '200101106Table1BuDesc',
          tableId: '200101106Table1',
          tableName: '备品备件采购表',
          columnProp: 'adminID',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '用户名',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 80
        },
        {
          userId: this.$store.state.user.name,
          functionId: 200101107,
          serialNumber: '200101107Table1purchaseOrderNo',
          tableId: '200101107Table1',
          tableName: '备品备件采购表',
          columnProp: 'adminName',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '姓名',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 80
        }
      ]
    }
  },
  methods:{
    getBuList() {
      let tempData = {
        username: this.$store.state.user.name,
      }
      getSiteAndBuByUserName(tempData).then(({data}) => {
        if (data.code === 0) {
          this.userBuList = data.rows
        }
      })
    },
    // 获取用户角色
    getUserRoleList () {
      getUserRoleList().then(({data}) => {
        if (data.code === 0) {
          this.roleList = data.rows
        } else {
          this.roleList = []
        }
      })
    },
    getPeopleList(){
      this.insertSchedulingFlag = true
      this.getOperatorList()
      this.fastAddFlag = true
    },
    // 获取机修人员列表
    async getOperatorList () {
      this.detailData.bu = '2_01-Label'
      //默认查询 角色：机修人员
      let filterList = this.roleList.filter(item => item.roleName === '机修人员')
      if (filterList.length > 0) {
        this.detailData.roleId = filterList[0].roleId
      }
      // 查询人员
      await getOperatorList(this.detailData).then(({data}) => {
        if (data && data.code === 0) {
          this.itemList1 = data.rows
          let arrAdminId = []
          if (this.initFlag){
            this.dataList.forEach(data => {
              arrAdminId.push(data.adminId)
            })
          } else {
            this.peopleList.forEach(data => {
              arrAdminId.push(data.adminID)
            })
          }
          this.itemList1 = this.itemList1.filter(item =>
            !arrAdminId.includes(item.adminID)
          )
          if (this.itemList2.length > 0){
            arrAdminId = []
            this.itemList2.forEach(data => {
              arrAdminId.push(data.adminID)
            })
            this.itemList1 = this.itemList1.filter(item =>
              !arrAdminId.includes(item.adminID)
            )
          }
          // this.itemList1.forEach(val => {
          //   // 回显选中的人员
          //   if (tempDataList.includes(val.adminID)) {
          //     this.$nextTick(() => this.$refs.operatorTable.toggleRowSelection(val, true))
          //   }
          // })
        } else {
          this.$alert(data.msg, '错误', {
            confirmButtonText: '确定'
          })
        }
      })
    },
    BUChanged(){
      let split = this.queryParams.bu.split('_')
      let params;
      if (split.length < 2){
        params = {
          site: null,
          buNo: null
        }
      }else {
        params = {
          site: split[0],
          buNo: split[1]
        }
      }
      getClassesList(params).then(({data}) => {
        if (data.code === 0) {
          this.classesList = data.rows
        } else {
          this.$message.warning(data.msg)
        }
      }).catch((error)=>{
        this.$message.error(error)
      })
    },
    insertBUChanged(){
      let split = this.saveData.bu.split('_')
      let params;
      if (split.length < 2){
        params = {
          site: null,
          buNo: null
        }
      }else {
        params = {
          site: split[0],
          buNo: split[1]
        }
      }
      getClassesList(params).then(({data}) => {
        if (data.code === 0) {
          this.classesList2 = data.rows
        } else {
          this.$message.warning(data.msg)
        }
      }).catch((error)=>{
        this.$message.error(error)
      })
    },
    getClassesList() {
      let params = {
        site: null,
        buNo: null
      }
      getClassesList(params).then(({data}) => {
        if (data.code === 0) {
          this.classesList = data.rows
        } else {
          this.$message.warning(data.msg)
        }
      }).catch((error)=>{
        this.$message.error(error)
      })
    },
    changeData(row){
      this.queryLoading = true
      this.queryLineRow = JSON.parse(JSON.stringify(row));
      querySaveSchedulingRecord(this.queryLineRow).then((data)=>{
        this.dataList = data.data.rows
        this.queryLoading = false
      }).catch((error)=>{
        this.$message.error(error)
        this.queryLoading = false
      })
    },
    handleQuery(){
      // 点击查询时，清空子表数据
      this.dataList = []
      this.queryLoading = true
      querySchedulingList(this.queryParams).then(({data})=>{
        if (data && data.code === 0) {
          this.dataListHead = data.rows
          this.totalHead = data.total
        } else {
          this.$message.warning(data.msg)
        }
        this.queryLoading = false
      }).catch((error)=>{
        this.$message.error(error)
        this.queryLoading = false
      })
    },
    // 关闭后刷新列表
    refreshDetailList () {
      searchSamplingProgrammeDetails(this.detailData).then(({data}) => {
        this.detailList = data.rows
      })
    },
    // 可选项目
    itemClickRow1 (row) {
      this.$refs.itemTable1.toggleRowSelection(row)
    },

    // 已有项目
    itemClickRow2 (row) {
      this.$refs.itemTable2.toggleRowSelection(row)
    },
    selectionItem1 (val) {
      this.itemSelections1 = val
    },

    selectionItem2 (val) {
      this.itemSelections2 = val
    },
    selectFlag () {
      return true
    },
    // 添加矩阵
    addItem () {
      if (this.itemSelections1 == null || this.itemSelections1.length === 0) {
        this.$message.warning('请选择可选人员！')
        return
      }
      let arrAdminId = []
      this.itemSelections1.forEach(data => {
        arrAdminId.push(data.adminID)
      })
      this.itemList1 = this.itemList1.filter(item =>
        !arrAdminId.includes(item.adminID)
      );
      if (this.insertSchedulingFlag) {
        this.peopleList2 = this.itemSelections1
        this.itemList2 = this.itemSelections1
        this.peopleList2.forEach(row => {
          row.isHoliday = 'N'; // 默认选中第一个选项
        });
      } else {
        this.itemList2 = this.itemSelections1
        this.peopleList = this.itemSelections1
      }
      // let inData = {
      //   samplingProgrammeNo: this.detailData.samplingProgrammeNo,
      //   planList: this.itemSelections1,
      //   site: this.detailData.site,
      //   buNo: this.detailData.buNo,
      //   updateBy: this.$store.state.user.name,
      // }
      // saveSamplingProgrammeDetails(inData).then(({data}) => {
      //   if (data && data.code === 0) {
      //     getPlanLists(this.detailData).then(({data}) => {
      //       this.itemList1 = data.row1
      //       this.itemList2 = data.row2
      //     })
      //     this.itemSelections1 = []
      //   } else {
      //     this.$alert(data.msg, '错误', {
      //       confirmButtonText: '确定'
      //     })
      //   }
      // })
    },

    // 删除矩阵
    deleteItem () {
      if (this.itemSelections2 == null || this.itemSelections2.length === 0) {
        this.$message.warning('请选择已有人员！')
        return
      }
      this.itemList1.push(...this.itemSelections2)
      this.itemList2 = this.itemList2.filter(item => !this.itemSelections2.includes(item))
      this.peopleList = this.itemList2
      this.peopleList2 = this.itemList2
    },
    deletePeopleList(row){
      this.peopleList = this.peopleList.filter(item => row.adminID != item.adminID);
    },
    saveScheduling(){
      this.saveData = {}
      this.peopleList = []
      this.classesList2 = []
      this.saveSchedulingFlag = true;
    },
    async saveHeaderFunction(){
      if (this.saveData.bu == null || this.saveData.bu === ''){
        this.$message.warning("请选择BU")
        return
      }
      if (this.saveData.classesCode == null || this.saveData.classesCode === ''){
        this.$message.warning("请选择班次")
        return
      }
      if (this.saveData.startDate == null || this.saveData.startDate === ''){
        this.$message.warning("请选择开始日期")
        return
      }
      if (this.saveData.endDate == null || this.saveData.endDate === ''){
        this.$message.warning("请选择结束日期")
        return
      }
      if (this.saveData.endDate < this.saveData.startDate){
        this.$message.warning("结束日期不能小于开始日期")
        return
      }
      this.queryLoading= true;
      let tempData = {
        ...this.saveData,
        peopleList: this.peopleList,
      }
      await saveSchedulingHeader(tempData).then(({data})=>{
        if (data.code==0){
          this.$message.success(data.msg)
          this.queryLoading = false
        } else {
          this.$message.error(data.msg)
          this.saveErrorFlag = true
          this.queryLoading = false
        }
      })
      if (this.saveErrorFlag){
        return
      }
      this.saveSchedulingFlag = false;
      this.queryLoading = false
      this.handleQuery();
    },
    handleQueryBySize(val){
      this.queryParams.size = val;
      this.handleQuery();
    },
    handleQueryByPage(val){
      this.queryParams.no = val;
      this.handleQuery();
    },
    addPeopleModal () {
      this.insertSchedulingFlag = false
      this.itemSelections1 = null
      this.itemSelections2 = null
      this.itemList2 = this.peopleList
      this.getOperatorList()
      this.fastAddFlag = true
    },
    editCancel(row){
      this.schedulingRecordData.editId = 1
      this.schedulingRecordData.id = row.id
      this.schedulingRecordData.adminId = row.adminId
      this.schedulingRecordData.adminName = row.adminName
      this.$set(this.schedulingRecordData,'isHoliday',row.isHoliday)
      this.insertSchedulingFlag = false
      this.initFlag = false
      this.editFlag = true
    },
    editSureCancel(){
      if (this.schedulingRecordData.adminId == null || this.schedulingRecordData.adminId === ''){
        if (this.peopleList2.length<1){
          this.$message.warning("请选择新增人员")
          return
        }
      }
      let params = {
        ...this.schedulingRecordData,
        peopleList : this.peopleList2
      }
      editSaveSchedulingRecord(params).then(({data})=>{
        this.$message.success(data.msg)
      })
      this.handleQuery()
      this.changeData(this.queryLineRow)
      this.editFlag = false
      this.schedulingRecordData = {}
    },
    deletePeopleList2(row){
      this.peopleList2 = this.peopleList2.filter(item => row.adminID != item.adminID);
      this.itemList2 = this.peopleList2
    },
    deleteCancel(row){
      this.$confirm('确定删除该条记录吗？',{
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(()=>{
        deleteSchedulingRecord(row).then(({data})=>{
          if (data && data.code === 0) {
            this.$message.success(data.msg)
            this.handleQuery()
            this.changeData(this.queryLineRow)
          } else {
            this.$message.warning(data.msg)
          }
        }).catch((error)=>{
          this.$message.error(error)
        })
      })
    },
    insertSchedulingRecord(){
      if (this.queryLineRow.id==null||this.queryLineRow.id==''){
        this.$message.warning("请先选中您要新增的排班")
        return
      }
      this.itemList1 = null
      this.itemList2 = null
      this.itemSelections1 = null
      this.itemSelections2 = null
      this.schedulingRecordData = {
        editId: 0,
        adminId: '',
        adminName: '',
        isHoliday: 'N',
        headId: this.queryLineRow.id
      }
      this.peopleList2 = []
      this.initFlag = true
      this.editFlag = true
    },
    async exportExcel() {
      if(this.queryLineRow.id==null||this.queryLineRow.id==''){
        this.$message.warning("请先选中您要导出的采购订单")
        return
      }
      ExportUtil.export(
        "/purchase/order/downloadPo",
        this.queryLineRow, this.queryLineRow.purchaseOrderNo+"采购单.xlsx"
      );
      this.handleQuery()
    },
  },
  watch:{
    queryLoading(newVal,oldVal){
      if (newVal === true){
        setTimeout(()=>{
          this.queryLoading=false
        },3000)
      }
    }
  },
  created() {
    this.getBuList();
    this.handleQuery();
    this.getClassesList();
    this.getUserRoleList();
  }
}
</script>

<template>
  <div class="box-container">
    <el-form label-position="top" :model="queryParams" >
      <el-row :gutter="10">
        <el-col :span="span">
          <el-form-item label="BU" prop="bu" >
            <el-select v-model="queryParams.bu" placeholder="请选择" clearable @change="BUChanged()" style="width: 221px">
              <el-option
                v-for = "i in userBuList"
                :key = "i.buNo"
                :label = "i.sitename"
                :value = "i.buNo">
                <span style="float: left;width: 100px">{{ i.sitename }}</span>
                <span style="float: right; color: #8492a6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; font-size: 11px;width: 60px">
                {{ i.buDesc }}
            </span>
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="span" style="margin-left: 70px">
          <el-form-item label="班次">
            <el-select v-model="queryParams.classesCode" placeholder="请选择" clearable >
              <el-option
                v-for = "i in classesList"
                :key = "i.code"
                :label = "i.code +' '+i.description"
                :value = "i.code">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="span*2">
          <el-form-item label="日期区间">
            <el-date-picker
              style="width: 47.5%"
              v-model="queryParams.startDate"
              type="date"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              placeholder="选择日期">
            </el-date-picker>
            <span style="text-align: center">-</span>
            <el-date-picker
              style="width: 47.5%"
              v-model="queryParams.endDate"
              type="date"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              placeholder="选择日期">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="span">
          <el-form-item label=" ">
            <el-button type="primary" @click="handleQuery">查询</el-button>
            <el-button type="primary" @click="saveScheduling">新增</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <!--  主表信息-->
    <div style="height: 40%">
      <el-table :data="dataListHead" border
                highlight-current-row
                height="100%" ref="table"
                v-loading="queryLoading"
                @row-click="changeData">
        <el-table-column
          v-for="(item,index) in columns_head" :key="index"
          :sortable="item.columnSortable"
          :prop="item.columnProp"
          :header-align="item.headerAlign"
          :show-overflow-tooltip="item.showOverflowTooltip"
          :align="item.align"
          :fixed="item.fixed===''?false:item.fixed"
          :min-width="item.columnWidth"
          :label="item.columnLabel">
          <template slot-scope="scope">
            <span v-if="!item.columnHidden">{{ scope.row[item.columnProp] }}</span>
            <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span>
          </template>
        </el-table-column>
        <!--      <el-table-column label="操作" align="center" width="100">-->
        <!--        <a @click="exportExcel()" type="primary" style="margin-left: 2px">{{'导出'}}</a>-->
        <!--      </el-table-column>-->
      </el-table>
    </div>
    <!--  子表明细-->
    <el-tabs style="font-size: 12px;" class="customer-tab" v-model="activeName"   type="border-card">
      <el-tab-pane label="明细" name="detail">
<!--        <el-button @click="exportExcel()" type="primary" style="margin-left: 2px;margin-top: 0px">{{'导出'}}</el-button>-->
        <el-button @click="insertSchedulingRecord()" type="primary" style="margin-left: 2px;margin-top: 0px">{{'新增'}}</el-button>
        <el-table
          :data="dataList" border
          v-loading="queryLoading"
          height="390px"
          ref="table">
          <el-table-column
            v-for="(item,index) in columns" :key="index"
            :sortable="item.columnSortable"
            :prop="item.columnProp"
            :header-align="item.headerAlign"
            :show-overflow-tooltip="item.showOverflowTooltip"
            :align="item.align"
            :fixed="item.fixed==''?false:item.fixed"
            :min-width="item.columnWidth"
            :label="item.columnLabel">
            <template slot-scope="scope">
              <template v-if="item.columnProp === 'ttlAmount' || item.columnProp === 'sumPrice'">
                <span>{{!!scope.row[item.columnProp]?scope.row[item.columnProp].toFixed(2):''}}</span>
              </template>
              <template v-else>
                <span v-if="!item.columnHidden">{{ scope.row[item.columnProp] }}</span>
                <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span>
              </template>
            </template>
          </el-table-column>
          <el-table-column label="操作" align="center" width="100">
            <template slot-scope="scope">
              <a  @click="editCancel(scope.row)">编辑</a>
              <a  @click="deleteCancel(scope.row)">删除</a>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>

    </el-tabs>

    <!--      新增dialog-->
    <el-dialog :close-on-click-modal="false" :close-on-press-escape="false" v-drag title="新增班次" :visible.sync="saveSchedulingFlag" width="420px">
      <el-form :inline="true" label-position="top">
        <el-form-item label="BU" prop="bu" >
          <el-select v-model="saveData.bu" placeholder="请选择" @change="insertBUChanged()" style="width: 221px">
            <el-option
              v-for = "i in userBuList"
              :key = "i.buNo"
              :label = "i.sitename"
              :value = "i.buNo">
              <span style="float: left;width: 100px">{{ i.sitename }}</span>
              <span style="float: right; color: #8492a6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; font-size: 11px;width: 60px">
                {{ i.buDesc }}
              </span>
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="班次">
          <el-select v-model="saveData.classesCode" placeholder="请选择" clearable >
            <el-option
              v-for = "i in classesList2"
              :key = "i.code"
              :label = "i.code+' '+i.description"
              :value = "i.code">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <el-form :inline="true" label-position="top">
        <el-form-item label="开始日期" >
          <el-date-picker
            v-model="saveData.startDate"
            type="date"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="  " >
          <el-checkbox v-model="saveData.checkbox1">包含周六</el-checkbox>
        </el-form-item>
        <el-form-item label="结束日期" >
          <el-date-picker
            v-model="saveData.endDate"
            type="date"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="  " >
          <el-checkbox v-model="saveData.checkbox2">包含周日</el-checkbox>
        </el-form-item>
      </el-form>
      <el-form :inline="true" label-position="top">
        <el-form-item :label="' '">
          <el-button type="primary" @click="addPeopleModal()">新增</el-button>
        </el-form-item>
      </el-form>
      <el-table
        :height="300"
        :data="peopleList"
        v-loading="queryLoading"
        border
        style="width: 100%;">
        <el-table-column
          v-for="(item,index) in column_people" :key="index"
          :sortable="item.columnSortable"
          :prop="item.columnProp"
          :header-align="item.headerAlign"
          :show-overflow-tooltip="item.showOverflowTooltip"
          :align="item.align"
          :fixed="item.fixed==''?false:item.fixed"
          :min-width="item.columnWidth"
          :label="item.columnLabel">
          <template slot-scope="scope">
            <span v-if="!item.columnHidden">{{ scope.row[item.columnProp] }}</span>
            <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span>
          </template>
        </el-table-column>
        <el-table-column
          fixed="right"
          header-align="center"
          align="center"
          width="80"
          label="操作">
          <template slot-scope="scope">
            <a type="text" size="small" @click="deletePeopleList(scope.row)">删除</a>
          </template>
        </el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
          <el-button @click="saveSchedulingFlag = false">取消</el-button>
          <el-button type="primary"  @click="saveHeaderFunction()">确定</el-button>
        </span>
    </el-dialog>

    <!-- 人员详情->快速新增 -->
    <el-dialog title="新增" @close="refreshDetailList" :close-on-click-modal="false" v-drag :visible.sync="fastAddFlag" width="900px">
      <div style="font-size: 12px">
        <el-form :inline="true" label-position="top" :model="detailData">
          <el-form-item :label="'所属角色'">
            <el-select v-model="detailData.roleId" placeholder="请选择" style="width: 120px">
              <el-option
                v-for = "i in roleList"
                :key = "i.roleId"
                :label = "i.roleName"
                :value = "i.roleId">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="'人员编码'">
            <el-input v-model="detailData.adminID" clearable style="width: 120px"></el-input>
          </el-form-item>
          <el-form-item :label="'人员姓名'">
            <el-input v-model="detailData.adminName" clearable style="width: 120px"></el-input>
          </el-form-item>
          <el-form-item :label="' '">
            <el-button type="primary" @click="getOperatorList">查询</el-button>
          </el-form-item>
        </el-form>
      </div>
      <el-container style="margin-top: 0px;">
        <el-main style="width: 400px;padding: 0px">
          <span style="font-size: 12px" >可选人员：</span>
          <el-table
            height="400px"
            :data="itemList1"
            border
            ref="itemTable1"
            @row-click="itemClickRow1"
            @selection-change="selectionItem1"
            highlight-current-row
            style="width: 100%">
            <el-table-column
              type="selection"
              header-align="center"
              align="center"
              :selectable="selectFlag"
              width="50">
            </el-table-column>
            <el-table-column
              prop="adminID"
              header-align="center"
              align="center"
              min-width="110"
              label="人员编码">
            </el-table-column>
            <el-table-column
              prop="adminName"
              header-align="center"
              align="center"
              min-width="170"
              label="人员名称">
            </el-table-column>
          </el-table>
        </el-main>
        <el-main style="width: 100px;padding: 0px">
          <div style="margin-top: 182px;margin-left: 18px">
            <el-button type="primary" @click="addItem()">添加>></el-button>
          </div>
          <div style="margin-top: 15px;margin-left: 18px">
            <el-button type="primary" @click="deleteItem()">删除<<</el-button>
          </div>
        </el-main>
        <el-main style="width: 400px;padding: 0px">
          <span style="font-size: 12px">选中人员：</span>
          <el-table
            height="400px"
            :data="itemList2"
            border
            ref="itemTable2"
            @row-click="itemClickRow2"
            @selection-change="selectionItem2"
            highlight-current-row
            style="width: 100%">
            <el-table-column
              type="selection"
              header-align="center"
              align="center"
              :selectable="selectFlag"
              width="50">
            </el-table-column>
            <el-table-column
              prop="adminID"
              header-align="center"
              align="center"
              min-width="110"
              label="人员编码">
            </el-table-column>
            <el-table-column
              prop="adminName"
              header-align="center"
              align="center"
              min-width="170"
              label="人员名称">
            </el-table-column>
          </el-table>
        </el-main>
      </el-container>
      <el-footer style="height:40px;margin-top: 20px;text-align:center">
        <el-button type="primary" @click="fastAddFlag = false">关闭</el-button>
      </el-footer>
    </el-dialog>

    <el-dialog :title="initFlag?'新增':'编辑'" :close-on-click-modal="false" :close-on-press-escape="false" v-drag :visible.sync="editFlag" width="420px">
      <el-form :inline="true" label-position="top">
        <el-button type="primary" v-if="initFlag" @click="getPeopleList">新增</el-button>
        <el-form-item label="人员编码" prop="adminID" v-if="!initFlag">
          <el-input v-model="schedulingRecordData.adminId" disabled style="width: 221px"></el-input>
        </el-form-item>
        <el-form-item label="人员名称" v-if="!initFlag">
          <el-input v-model="schedulingRecordData.adminName" disabled style="width: 221px"></el-input>
        </el-form-item>
        <el-form-item label="是否请假" v-if="!initFlag">
          <el-select filterable v-model="schedulingRecordData.isHoliday" style="width: 100px">
            <el-option label="请假" value="Y"></el-option>
            <el-option label="工作" value="N"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <el-table
        v-if="initFlag"
        :height="300"
        :data="peopleList2"
        v-loading="queryLoading"
        border
        style="width: 100%;">
        <el-table-column
          v-for="(item,index) in column_people" :key="index"
          :sortable="item.columnSortable"
          :prop="item.columnProp"
          :header-align="item.headerAlign"
          :show-overflow-tooltip="item.showOverflowTooltip"
          :align="item.align"
          :fixed="item.fixed==''?false:item.fixed"
          :min-width="item.columnWidth"
          :label="item.columnLabel">
          <template slot-scope="scope">
            <span v-if="!item.columnHidden">{{ scope.row[item.columnProp] }}</span>
            <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span>
          </template>
        </el-table-column>
        <el-table-column label="是否请假" align="center" width="100">
          <template slot-scope="scope">
            <el-select filterable v-model="scope.row.isHoliday" style="width: 100px">
              <el-option label="请假" value="Y"></el-option>
              <el-option label="工作" value="N"></el-option>
            </el-select>
          </template>
        </el-table-column>
        <el-table-column
          fixed="right"
          header-align="center"
          align="center"
          width="80"
          label="操作">
          <template slot-scope="scope">
            <a type="text" size="small" @click="deletePeopleList2(scope.row)">删除</a>
          </template>
        </el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
          <el-button @click="editFlag = false;initFlag=false">取消</el-button>
          <el-button type="primary" @click="editSureCancel()">确定</el-button>
      </span>
    </el-dialog>


  </div>
</template>

<style scoped>

</style>