eln_web/src/views/business/comps/select/SelectBalanceValue.vue

<template>
  <div>
    <div style="display: flex;">
      <el-select v-model="type" :placeholder="$t('form.placeholderSelect')"  @change="typeChange"   style="width: 200px;">
        <el-option :label="$t('page.business.resource.resource.common.tj')" :value="1"></el-option>
        <el-option :label="$t('page.business.resource.resource.common.zl')" :value="3"></el-option>
      </el-select>
      <template v-if="type == 1">
        <el-input v-model="srz" :placeholder="$t('form.placeholderInput')" maxlength="20" @change="inputChange">
          <template slot="append">{{ dw||'' }}
          </template>
        </el-input>
      </template>
      <template v-if="type == 3">
        <div>
          <el-input v-model="tpName" :placeholder="$t('form.xztp')" readonly @click.native="showSelectBalance"
            style="width: 80px;" />
        </div>
        <div>
          <el-input v-model="tpz" :placeholder="$t('form.placeholderInput')" maxlength="20" @change="tpzChange">
            <template slot="append">{{ tpdw||'' }}
            </template>
          </el-input>
        </div>
        <div>
          <el-button type="primary" @click="getBalanceValue">{{ $t('form.hqz') }}</el-button>
        </div>
      </template>
    </div>
    <SelectInstrumentDialog ref="selectInstrumentDialog" @change="selectInstrumentChange" />
  </div>
</template>

<script>
import SelectInstrumentDialog from '@/views/business/comps/select/SelectInstrumentDialog';
import { getBalance } from "@/utils/tpph";
export default {
  name: "SelectBalanceValue",
  components: { SelectInstrumentDialog },
  props: {
    value: {
      type: [Number, String],
      default: ''
    },
    selectkey: {
      type: String,
      default: ''
    },
    dw: {
      type: String,
      default: ''
    },
  },
  watch: {
    value: {
      immediate: true,
      handler(v) {
        this.tpz = v || ''
      }
    }
  },
  data() {
    return {
      type: '',
      srz: '',
      tpName: '',
      tpz: '',
      tpdw: '',
      yq: {}
    };
  },
  mounted() {
  },
  methods: {
    showSelectBalance() {
      this.$refs.selectInstrumentDialog.show()
    },
    selectInstrumentChange(val, row) {
      this.tpName = row.mc
      this.yq = row
    },
    async getBalanceValue() {
      if (!this.yq || !this.yq.bh) {
        this.$message.error('请选择仪器')
        return
      }
      this.tpz = ''
      let x = await getBalance({ yq: this.yq, dw: null })
      if (x && x.success) {
        this.tpz = x.value
        this.tpdw = x.unit
      } else {
        this.$message.error(x.message || '获取值失败')
      }
      this.tpzChange()
    },
    tpzChange() {
      this.$emit('change', { tpz: this.tpz, dw: this.tpdw,selectkey:this.selectkey})
      this.$emit('input', this.tpz)
    },
    inputChange() {
      this.$emit('change', { tpz: this.srz, dw: this.dw,selectkey:this.selectkey })
      this.$emit('input', this.srz)
    },
    typeChange(){
      this.$emit('change', null)
      this.$emit('input', null)
      this.srz=null
      this.tpz=null
      this.tpdw=null
    }
  }
};
</script>