orbit-ch-web/src/components/xqchComponents/estimatePlan.vue

<template>
  <div class="xqch-content01">
    <div style="width:100%;height:100px"></div>
    <!-- 方案评估信息区域 -->
    <div class="planEstimate-area" v-if="commonFunction.getUserConfig($store.state.userOwnMenus,400).available">

      <div class="planEstimate-title"></div>
      <div class="planEstimate-bottonArea">
        <!-- <el-button class="planAdjustBtn" size="small" type="primary" @click="conflictCheck">冲突情况检测</el-button> -->
        <el-button class="planAdjustBtn" size="small" type="text">冲突情况检测</el-button>
      </div>
      <div class="planEstimate-table">
        <xqchPlanEstimateTable :xqchPlanEstimateData="xqchPlanEstimateData"></xqchPlanEstimateTable>
      </div>
    </div>
    <!-- 筹划方案区域 -->
    <div class="CHplan-area" v-if="commonFunction.getUserConfig($store.state.userOwnMenus,401).available">
      <div class="CHplan-title"></div>
      <div class="CHplan-table">
        <xqchCHplanTable :xqchCHplanData="xqchCHplanData"></xqchCHplanTable>
      </div>
    </div>
  </div>
</template>

<script>
import xqchPlanEstimateTable from '@/components/tables/xqch_planEstimateTableForEstimatePlan.vue'
import xqchCHplanTable from '@/components/tables/xqch_CHplanTable.vue'
import {getXQCHplanEstimate, getXQCHCHplan} from '@/api/xqchApi.js'

export default {
  name: "estimatePlan",
  components: {xqchCHplanTable, xqchPlanEstimateTable},
  data() {
    return {
      xqchPlanEstimateData: [],
      xqchPlanEstimateVisible: false,
      xqchCHplanData: [],
      xqchCHplanVisible: false,
    }
  },
  watch: {
    $route(to) {
      if (to.name === 'xqchPage') {
        this.getTablePlanEstimateDataFromBackend();
        this.getTableCHPlanDataFromBackend();
      }
    }
  },
  mounted() {
    this.getTablePlanEstimateDataFromBackend();
    this.getTableCHPlanDataFromBackend();
  },
  methods: {
    conflictCheck() {
      //   this.$router.push({name:'xqchPageMain'})
      this.$emit("sentConflictCheck", 1)
    },
    getTablePlanEstimateDataFromBackend() {
      getXQCHplanEstimate().then(res => {
        console.log("需求筹划第一页面，方案评估数据：", res.data);
        this.xqchPlanEstimateData = res.data;
        this.xqchPlanEstimateVisible = true;
      });
    },
    getTableCHPlanDataFromBackend() {
      getXQCHCHplan().then(res => {
        console.log("需求筹划第一页面，筹划方案数据：", res.data);
        this.xqchCHplanData = res.data;
        this.xqchCHplanVisible = true;
      });
    },
  },
};
</script>

<style lang='scss' scoped>
.xqch-content01 {
  width: 100%;
  height: 100%;
  color: #fff;

  .planEstimate-area {
    width: 690px;
    height: 300px;
    background: url('@/assets/ClipImage/dikuang/fanganpinggu.png');
    background-size: 100% 100%;
    position: relative;
    // margin: 124px auto 70px;
    margin: 0 auto 70px;

    .planEstimate-title {
      width: 690px;
      height: 38px;
      background: url('@/assets/ClipImage/biaoti/fanganpinggu.png');
      background-size: 100% 100%;
      position: absolute;
      top: -44px;
      display: flex;
      flex-direction: row-reverse;
      align-items: center;

    }

    .planEstimate-bottonArea {
      width: 680px;
      height: 40px;
      margin-left: 10px;
      display: flex;
      align-items: center;

      /deep/ .planAdjustBtn {
        height: 30px;
        width: 100px;
        background: #999;
        color: #ddd;
      }
    }

    .planEstimate-table {
      width: 690px;
      height: 260px;
      box-sizing: border-box;
      padding: 0 10px;
    }
  }

  .CHplan-area {
    width: 1510px;
    height: 300px;
    background: url('@/assets/ClipImage/dikuang/chouhuafangan.png');
    background-size: 100% 100%;
    position: relative;
    margin: 0 auto;

    .CHplan-title {
      width: 1510px;
      height: 38px;
      background: url('@/assets/ClipImage/biaoti/chouhuafangan.png');
      background-size: 100% 100%;
      position: absolute;
      top: -44px;
    }

    .CHplan-table {
      width: 1510px;
      height: 300px;
      box-sizing: border-box;
      padding: 10px;
    }
  }
}
</style>