<!--
 * @Description: 创建采购单-行项目信息组件查看
 * @Author: gmy
 * @Date: 2020-08-3 10:13:30
-->
<template>
  <div>
    <el-table :data="lineProjectData" class="mb16 tableLimit">
      <el-table-column
        type="index"
        label="序号"
        width="60"
        align="center"
      />
      <el-table-column
        header-align="center"
        align="left"
        prop="purchaseDesc"
        label="产品描述"
        min-width="230px"
      />
      <el-table-column
        header-align="center"
        label="行项目编号"
        prop="purchaseNo"
        align="center"
        width="140px"
      />
      <el-table-column
        header-align="center"
        align="center"
        prop="productNo"
        label="产品编码"
        width="120px"
      />
      <!-- <el-table-column
        header-align="center"
        align="center"
        min-width="60"
        label="类型"
      >
        <template slot-scope="scope">
          <p
            v-for="(item, index) in plan_purchase_typeList"
            v-if="scope.row.purchaseType === item.typecode"
            :key="index"
          >
            {{ item.typename }}
          </p>
        </template>
      </el-table-column> -->
      <el-table-column
        header-align="center"
        align="right"
        width="80"
        prop="quantity"
        label="数量"
      />
      <el-table-column header-align="center" align="left" min-width="150">
        <template slot="header">
          <span>税率</span>
        </template>
        <template slot-scope="scope">
          <span>{{ filterDictText(taxRate,scope.row.taxRate) }}</span>
        </template>
      </el-table-column>
      <el-table-column header-align="center" align="left" width="80" label="计量单位">
        <template slot-scope="scope">
          <span>{{ filterDictText(measuringUnitList,scope.row.unit) }}</span>
        </template>
      </el-table-column>
      <el-table-column
        header-align="center"
        align="right"
        min-width="100"
        label="预算单价(元)"
      >
        <template slot-scope="scope">
          <p>{{ transformMethods(scope.row.unitBudget) }}</p>
        </template>
      </el-table-column>
      <el-table-column
        header-align="center"
        align="right"
        prop="totalBudget"
        label="预算总额(元)"
        min-width="100"
      >
        <template slot-scope="scope">
          <p>{{ transformMethods(scope.row.totalBudget) }}</p>
        </template>
      </el-table-column>
      <!--交货时间 procFrameType  00采购项目 01框架项目-->
      <el-table-column
        header-align="center"
        align="center"
        prop="deliveryDate"
        label="交货时间"
        min-width="180"
      >
        <template slot-scope="scope">
          <div v-if="otherData.procFrameType==='00'">
            <!-- isEdit是否点击变更 默认 false 点击后为true deliveryDate -->
            <span v-if="!otherData.isEdit">{{ scope.row.deliveryDate }}</span>
            <el-date-picker
              v-else
              v-model="scope.row.deliveryDate"
              :value-format="elValueFormatDate"
              :picker-options="disabledPickerOptions"
              type="date"
              placeholder="选择日期时间"
              maxlength="20"
              style="width: 160px"
            />
          </div>
          <div v-if="otherData.procFrameType==='01'">
            已实际项目情况为准
          </div>
        </template>
      </el-table-column>
      <el-table-column
        header-align="center"
        align="left"
        label="交货地点"
        min-width="230"
      >
        <template slot-scope="scope">
          <span>{{ scope.row.deliveryAreaName }}{{ scope.row.deliveryAdress }}</span>
        </template>
      </el-table-column>
      <el-table-column
        header-align="center"
        align="left"
        prop="buyersName"
        label="采购单位"
        min-width="230"
      />
      <el-table-column
        header-align="center"
        align="left"
        prop="remark"
        label="备注"
        min-width="180"
      >
        <template slot-scope="scope">
          <span v-if="!otherData.isEdit">{{ scope.row.remark }}</span>
          <el-input v-else v-model="scope.row.remark" />
        </template>
      </el-table-column>
      <el-table-column
        header-align="center"
        label="附件"
        align="center"
        width="80"
      >
        <template slot-scope="scope">
          <el-link
            v-if="scope.row.isContainAttachment!=='1'&&otherData.isEdit"
            :underline="false"
            size="mini"
            plain
            type="primary"
            @click="lookMatter(scope.row)"
          >
            [上传]
          </el-link>
          <el-link
            v-if="scope.row.isContainAttachment==='1'"
            :underline="false"
            size="mini"
            plain
            type="primary"
            @click="lookMatter(scope.row)"
          >
            [查看]
          </el-link>
        </template>
      </el-table-column>
    </el-table>
    <!--   查看附件弹框-->
    <lookAccessory-dialog v-if="attachmentDialog.dialog" :dialog-data="attachmentDialog" />
  </div>
</template>

<script>
/* 组件*/
import lookAccessory from './lookLineItemInfoAccessory-dialog' // 查看行项目物资附件弹框
/* 公共方法*/
import { moneyFormat, filterDictText } from '@/assets/js/utils' // 金额转换千分位
import { procurementProjectGroupMixin } from '../mixins/procurementProjectGroupMixin'
import { procurementProjectMixins } from '../mixins/procurementProjectMixins'
export default {
  name: 'ProcurementProjectMaterialAddVue',
  components: {
    'lookAccessory-dialog': lookAccessory // 查看行项目物资附件弹框
  },
  mixins: [procurementProjectGroupMixin, procurementProjectMixins],
  props: {
    lineProjectData: {
      type: Array,
      required: true,
      default: function() {
        return []
      }
    },
    // 其他数据
    otherData: {
      type: Object,
      default: () => {
        return {
          isEdit: false, // 是否可编辑 默认false
          procFrameType: '00' // // 区分采购项目或者框架项目 00采购 01框架
        }
      }
    },
    // 变更后的新bizId集合
    subjectMatterChangeList: {
      type: Array,
      default: () => {
        return []
      }
    }
  },
  data() {
    return {
      // 查看行项目物资附件弹框-展示/隐藏状态 true 展示/false 隐藏
      attachmentDialog: {
        dialog: false,
        bizId: '',
        type: '00' // 查看附件
      },
      tenderOrgMethod: this.$route.query.tenderOrgMethod, // 项目组织形式 00 自采 01 代理采购
      deliveryDateAligin: 'content' // 交货时间文案位置显示 默认居中
    }
  },
  watch: {
    'attachmentDialog.dialog'(val) {
      if (!val) {
        this.attachmentDialog.bizId = ''
      }
    }
  },
  created() {
    // 查询项目字典
    this.inCodes()
    // 调用行项目信息字典方法
    this.initWebTypeGroup()
  },
  mounted() {
    // 根据是否是框架采购项目判断交货时间algin位置
    this.setdeliveryDateAligin()
  },
  methods: {
    filterDictText, // 字典
    // 开启查看物资附件弹框
    lookMatter(row) {
      // isEdit 布尔值 true表示点击变更后的状态 默认false
      if (this.otherData.isEdit) {
        this.attachmentDialog.type = ''
        this.changMatterBizid(row)
        return
      }
      // 获取文件上传id
      this.attachmentDialog.bizId = row.planDetailId
      // 打开弹框
      this.attachmentDialog.dialog = true
    },
    // 获取变更后后行项目对应的bizId
    changMatterBizid(row) {
      const newbizId = this.subjectMatterChangeList.find(item => item.subjectMatterId === row.id).subjectMatterRecordId
      // 获取变更后行项目对应的bizId
      this.attachmentDialog.bizId = newbizId
      // 开启弹框
      this.attachmentDialog.dialog = true
    },
    // 封装千分位转换方法
    transformMethods(num) {
      return moneyFormat(num)
    },
    /*
    * 根据是否是框架采购项目判断交货时间algin位置
    * procFrameType 00 采购项目 01框架采购项目
    */
    setdeliveryDateAligin() {
      if (this.otherData.procFrameType === '00') {
        this.deliveryDateAligin = 'content'
      } else if (this.otherData.procFrameType === '01') {
        this.deliveryDateAligin = 'left'
      }
    }
  }
}
</script>

<style lang="less" scoped>

</style>
