gjerp_ui/src/views/jhzx/symxCX_1.vue

<template>
  <el-container>
    <el-header style="width: 100%; height: 35px;font-size: 12px">
      <el-form :inline="true" label-width="65px" label-position="left">
        <el-row>
          <el-col :span="15">
            <el-form-item>
              <span  style="font-size: 13px;color: #606266; margin-left: 4px;margin-right: 4px">小组需求时间范围:</span>
              <el-date-picker v-model="queryParam.beginTime" value-format="yyyy/MM/dd" fromat="yyyy/MM/dd"  type="month"  style="width: 33%;" />
              <span  style="font-size: 13px;color: #606266; margin-left: 4px;margin-right: 4px">至</span>
              <el-date-picker v-model="queryParam.endTime" value-format="yyyy/MM/dd" fromat="yyyy/MM/dd"  type="month" style="width: 33%" />
            </el-form-item>
          </el-col>
          <el-col :span="9">
            <el-form-item style="float: right">
              <el-button type="success" @click="initList">查询</el-button>
              <el-button type="success" @click="tqSygd">提交三月滚动</el-button>
              <el-button type="success" @click="钢料需求倒排三月滚动计划">三月滚动计划编制</el-button>
              <el-button type="success" @click="三月滚动计划数据读取">读取三月滚动</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-header>
    <el-container style="padding-top: 0px">
      <el-main>
        <MyTabs ref="myTabsRef" :height="height" :queryParam="queryParam" />
      </el-main>
    </el-container>
    <SelectShipModal ref="selectShipModalRef"/>
    <ShowDetailModal ref="showDetailModalRef"/>
  </el-container>
</template>
<script>
import router from "@/router";
import {getList, tqSygd, 排产, 获取排产结果} from '@/api/jhzx/sygd'
import {mapGetters} from 'vuex'
import XEUtils from 'xe-utils'
import MyTabs from "@/views/jhzx/components/sygdpc/MyTabs.vue";
import SelectShipModal from "@/views/jhzx/components/sygdpc/SelectShipModal.vue";
import ShowDetailModal from "@/views/jhzx/components/sygdpc/ShowDetailModal.vue";

export default {
  name: 'SymxCX',
  components: {ShowDetailModal, SelectShipModal, MyTabs},
  data() {
    return {
      isUser:true,
      queryParam: {
        beginTime: '',
        endTime: ''
      },
      dictData: [],
      height: '500px',
    }
  },
  computed: {
    ...mapGetters(['name', 'bmbm','yhdm'])
  },
  created() {
    window.addEventListener('resize', this.getHeight)
    this.getHeight()
    this.initBase()
    if(this.yhdm=='UserAdmin'||this.yhdm=='user02'){
      this.isUser=false
    }
  },
  watch: {
    'queryParam.beginTime'(newValue, Value){
      if (newValue){
        this.format(newValue);
      }
    }
  },
  methods: {
    钢料需求倒排三月滚动计划(){
      console.log(111)
      const data={from:this.queryParam.beginTime,to:this.queryParam.endTime}
      排产(data).then(res=>{
        this.三月滚动计划数据读取()
      })
    },
    三月滚动计划数据读取(){
      const data={from:this.queryParam.beginTime,to:this.queryParam.endTime}
      获取排产结果(data).then(res=>{
        this.activeName="sygdjh"
        console.log(res)
      })
    },
    //提交三月滚动
    tqSygd() {
      console.log(111)
      const list=this.$refs.myTabsRef.getSelectData();
      if (list.length===0){
        this.$message.warning('请先选择三月滚动计划明细数据！');
        return
      }
      tqSygd(this.list).then((res) => {
        if (res.data) {
          router.push({
            name: 'SygdWH',
            params: {
              list: res.data
            }
          })
        } else {
          this.$message.warning('请先提取明细！');
        }
      })
    },
    //转码信息
    initBase() {
      this.queryParam.beginTime = XEUtils.toDateString(XEUtils.getWhatMonth(new Date(), 0, 1),'yyyy/MM/dd')
    },
    initList() {
      if (this.queryParam.beginTime === '' || this.queryParam.endTime === '') {
        this.$message.warning('选择时间范围')
        return
      }
      getList(this.queryParam).then((res) => {
        this.activeName = 'sygdjhDetail'
        this.$refs.myTabsRef.initData('sygdjhDetail',res.data.list)
      })
    },
    format (val) {
      this.queryParam.endTime=XEUtils.toDateString(XEUtils.getWhatMonth(val, 2, 'last'),'yyyy/MM/dd')
    },
    getHeight() {
      this.height = window.innerHeight - 200
    },
  }
}
</script>
<style lang="scss" scoped>

.el-header {
  margin: 0;
  padding: 5px;
  height: auto;

  .el-input {
    width: 140px;
  }

  .el-select {
    width: 140px;
  }

}

.el-container {
  padding: 0;
  margin: 0;
}

.el-main {
  padding: 0;
}

.el-col {
  padding: 0;
  height: 32px;
}

.el-aside {
  background: #fff;
  padding: 0
}

.el-container {
  padding: 0
}

.el-row {
}

.el-row:last-child {
  margin-bottom: 0;
}

.tableStyles {
  background: #0a76a4;
}

.my-dropdown {
  width: 400px;
  height: 400px;
  background-color: #fff;
  border: 1px solid #dcdfe6;
  box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
  font-size: 12px;

}

.mytable1 {

}

.borderClass {

}

.vxe-input {
  display: inline-block !important;
  position: relative !important;
  width: auto;
}

.el-input {
  display: inline-block !important;
  position: relative !important;
  width: auto;
}

.keyword-lighten {
  color: #000;
  background-color: #FFFF00;
}

.vxe-textarea--inner {
  line-height: inherit;
}

.el-form-item__label-wrap {
  margin-left: 0px !important;
  float: left;
}

.fontClass {
  font-size: 12px;
  font-weight: bold;
}


</style>