yudao-init/src/views/produce/target/detail-or-updata.vue

<!--
 * @Author: zhp
 * @Date: 2023-11-06 15:15:30
 * @LastEditTime: 2024-06-14 10:41:23
 * @LastEditors: DY
 * @Description:
-->
<template>
  <el-drawer class="drawer" :visible.sync="visible" size="70%" @closed="$emit('destroy')">
    <small-title slot="title" :no-padding="true">
      <!-- {{ ftype === 0 ? '碲化镉工厂生产数据详情' : '铜铟镓硒工厂生产数据详情' }} -->
      生产目标详情
    </small-title>
    <div class="detailBox">
      <el-row :gutter="24">
        <el-col :span="8">
          <p class="title">工厂名称</p>
          <p class="text">{{ factoryList[dataForm.factory] }}</p>
        </el-col>
        <el-col :span="8">
          <p class="title">时间维度</p>
          <p class="text">{{ ['日', '周', '月', '年'][dataForm.targetType] }}</p>
        </el-col>
        <el-col :span="8">
          <p class="title">时间</p>
          <p class="text">{{ dataForm.targetTime}}</p>
        </el-col>
      </el-row>
      <el-divider></el-divider>
      <small-title style=" margin: 0;padding: 26px 32px 24px;margin-bottom: 22px;" :no-padding="false">
        {{ '芯片' }}
      </small-title>
      <el-row :gutter="24">
        <el-col :span="6">
          <p class="title">芯片产量(片)</p>
          <p class="text">{{ dataForm.chipYield }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">芯片良率(%)</p>
          <p class="text">{{ dataForm.chipYieldRate }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">芯片BOM</p>
          <p class="text">{{ dataForm.chipBom }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">芯片总功率(MW)</p>
          <p class="text">{{ dataForm.chipTotalPower }}</p>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :span="6">
          <p class="title">{{ ['FTO投入量(片)', '钼电极投入量(片)'][ftype] }}</p>
          <p class="text">{{ [dataForm.ftoInput, dataForm.molybdenumElectrodeInput][ftype] }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">{{ ['CSS稼动率(%)', 'PID6稼动率(%)'][ftype] }}</p>
          <p class="text">{{ dataForm.chipCssMarriageRate }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">芯片段OEE(%)</p>
          <p class="text">{{ dataForm.chipOee }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">芯片平均功率(W)</p>
          <p class="text">{{ dataForm.chipAveragePower }}</p>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :span="6">
          <p class="title">芯片人均产量(片/人)</p>
          <p class="text">{{ dataForm.chipAnnualAverageProduction }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">芯片产能利用率(%)</p>
          <p class="text">{{ dataForm.chipCapacityUtilizationRate }}</p>
        </el-col>
      </el-row>
      <small-title style=" margin: 0;padding: 26px 32px 24px;margin-bottom: 22px;" :no-padding="false">
        {{ '标准组件' }}
      </small-title>
      <el-row :gutter="24">
        <el-col :span="6">
          <p class="title">封装BOM</p>
          <p class="text">{{ dataForm.componentBom }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">封装线OEE(%)</p>
          <p class="text">{{ dataForm.componentOee }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">标准组件良率(%)</p>
          <p class="text">{{ dataForm.componentYieldRate }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">标准组件产量(片)</p>
          <p class="text">{{ dataForm.componentYield }}</p>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :span="6">
          <p class="title">标准组件总功率(MW)</p>
          <p class="text">{{ dataForm.componentTotalPower }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">封装产能利用率(%)</p>
          <p class="text">{{ dataForm.componentCapacityUtilizationRate }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">标准组件人均产量(片/人)</p>
          <p class="text">{{ dataForm.componentAnnualAverageProduction }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">标准组件平均功率(W)</p>
          <p class="text">{{ dataForm.componentAveragePower }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">标准组件转化效率</p>
          <p class="text">{{ dataForm.componentConversionEfficiency }}</p>
        </el-col>
      </el-row>
      <small-title style=" margin: 0;padding: 26px 32px 24px;margin-bottom: 22px;" :no-padding="false">
        {{ 'BIPV产品' }}
      </small-title>
      <el-row :gutter="24">
        <el-col :span="6">
          <p class="title">产品产量(㎡)</p>
          <p class="text">{{ dataForm.bipvProductOutput }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">人均产量(㎡/人)</p>
          <p class="text">{{ dataForm.bipvAnnualAverageProduction }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">芯片使用量(片)</p>
          <p class="text">{{ dataForm.bipvChipUsage }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">芯片利用率(%)</p>
          <p class="text">{{ dataForm.bipvChipUtilizationRate }}</p>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :span="6">
          <p class="title">内部材料成本(元/㎡)</p>
          <p class="text">{{ dataForm.bipvInsideMaterialCost }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">OEM及委外材料成本(元/㎡)</p>
          <p class="text">{{ dataForm.bipvOeeMaterialCost }}</p>
        </el-col>
        <el-col :span="6">
          <p class="title">综合材料成本(元/㎡)</p>
          <p class="text">{{ dataForm.bipvComprehensiveMaterialCost }}</p>
        </el-col>
      </el-row>
    </div>
  </el-drawer>

</template>

<script>
import { getProduceTargetDetail } from '@/api/produceData';
import SmallTitle from './SmallTitle';
import { factoryList } from "@/utils/constants";

export default {
  components: {
    SmallTitle,
  },
  props: {
    ftype: {
      type: Number,
      default: 0
    }
  },
  // mixins: [basicAdd],
  data() {
    return {
      factoryList,
      urlOptions: {
        isGetCode: false,
        // codeURL: getCode,
        // createURL: createQualityScrapLog,
        // updateURL: updateQualityScrapLog,
        // infoURL: getQualityScrapLog,
      },
      lineList: [],
      typeList: [],
      workOrderList: [],
      detList: [],
      teamList: [],
      sourceList: [
        {
          id: 1,
          name: '手动',
        },
        {
          id: 2,
          name: '自动',
        }
      ],
      sectionList: [],
      visible: false,
      dataForm: {}
    };
  },
  methods: {
    init(id) {
      this.visible = true
      console.log('打印', id)
      if (id) {
        getProduceTargetDetail(id).then(res => {
          this.dataForm = res.data
        })
      }
    }
  },
};
</script>
<style scoped>
  .drawer >>> .el-drawer {
  border-radius: 8px 0 0 8px;
}

.drawer >>> .el-form-item__label {
  padding: 0;
}

.drawer >>> .el-drawer__header {
  margin: 0;
  padding: 32px 32px 24px;
  border-bottom: 1px solid #dcdfe6;
  margin-bottom: 30px;
}
.detailBox p {
  margin: 0;
  padding: 0 32px;
}
.detailBox .title {
  /* width: 56px; */
  /* height: 14px; */
  font-family: Source Han Sans CN, Source Han Sans CN;
  font-weight: 400;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.85);
  line-height: 16px;
  text-align: left;
  font-style: normal;
  text-transform: none;
}
.detailBox .text {
  font-size: 14px;
  font-weight: 400;
  color: rgba(102,102,102,0.75);
  padding-bottom: 20px;
}
.detailBox {
  width: 98%;
}

</style>