kd-aiot-frontend/src/views/classifyManage/itemInformation/components/ItemDetail.vue

<template>
  <el-form label-width="90px" class="formBox">
    <el-form-item label="分类">
      <span>{{ customForm.categoryLevelPath }}</span>
    </el-form-item>
    <el-form-item label="物品编码">
      <span>{{ customForm.code }}</span>
    </el-form-item>
    <el-form-item label="物品名称">
      <span>{{ customForm.name }}</span>
    </el-form-item>
    <el-form-item label="计量单位">
      <span>{{ customForm.measuringUnit }}</span>
    </el-form-item>
    <el-form-item label="包装单位">
      <span>{{ customForm.packingUnit }}</span>
    </el-form-item>
    <el-form-item label="参考单价">
      <span
        >{{ customForm.univalence }} {{ univalenceUnit }}/{{
          customForm.measuringUnit
        }}</span
      >
    </el-form-item>
    <el-form-item label="保质期">
      <span>{{ customForm.expirationDate }} {{ expirationDateUnit }}</span>
    </el-form-item>
    <el-form-item label="安全库存">
      <span>{{ customForm.safeStock }}</span>
    </el-form-item>
    <el-form-item label="盘点模式" prop="itemMode">
      <span>{{ inventoryMode[customForm.takeStockPattern] }}</span>
    </el-form-item>
    <!-- <el-form-item label="允许转资产" prop="isTransferAssets">
             <span>{{customForm.isTransferAssets?'允许':'不允许'}}</span>
         </el-form-item> -->
    <el-form-item label="允许拆包" prop="unpack">
      <span>{{ customForm.unpack ? '允许' : '不允许' }}</span>
    </el-form-item>
    <el-form-item label="描述" prop="itemRemark">
      <span>{{ customForm.description }}</span>
    </el-form-item>
  </el-form>
</template>

<script>
  export default {
    props: {
      customForm: {
        type: Object,
        default: {}
      }
    },
    components: {},
    data () {
      return {
        inventoryMode: ['逐个盘点', '批量盘点', '混合模式'],
        priceList: [
          { id: 0, value: '元', name: 'yuan' },
          { id: 1, value: '万元', name: 'wanyuan' }
        ],
        dateList: [
          { id: 0, value: '分钟', name: 'minute' },
          { id: 1, value: '小时', name: 'hour' },
          { id: 2, value: '天', name: 'day' },
          { id: 3, value: '月', name: 'month' },
          { id: 4, value: '年', name: 'year' }
        ],
        univalenceUnit: '',
        expirationDateUnit: ''
      };
    },
    watch: {
      customForm (val) {
        if (val) {
          this.priceList.map((item) => {
            if (item.name == val.univalenceUnit) {
              this.univalenceUnit = item.value;
            }
          });
          this.dateList.map((item) => {
            if (item.name == val.expirationDateUnit) {
              this.expirationDateUnit = item.value;
            }
          });
        }
      }
    },
    created () {},
    methods: {}
  };
</script>

<style lang="scss" scoped>
  :deep(.formBox .el-form-item) {
    margin-bottom: 17px;
    .twobox {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    .w60.el-input--medium {
      width: 60%;
      margin-right: 5px;
    }
    .el-input--small .el-input__inner {
      height: 36px;
      line-height: 36px;
    }
    .el-select.el-select--medium {
      width: 100%;
    }
    .w40.el-select.el-select--medium {
      width: 40%;
    }
    .el-radio {
      display: block;
      margin-top: 10px;
    }
  }
</style>