smsb-web-develop/src/views/realm/settings/components/PowerConfigDialog.vue

<template>
  <confirm-dialog
    ref="configDialog"
    title="电源标签"
    @confirm="onSave"
  >
    <div class="c-grid-form auto u-align-self--center">
      <div class="c-grid-form__label">屏体电源标签</div>
      <el-input v-model.trim="config.power1" />
      <div class="c-grid-form__label">风机电源标签</div>
      <el-input v-model.trim="config.power2" />
    </div>
  </confirm-dialog>
</template>

<script>
import {
  POWERTYPE,
  getTenantAttribute,
  updateTenantAttribute
} from '../api'

export default {
  name: 'PowerConfigDialog',
  data () {
    return {
      config: {
        power1: '',
        power2: ''
      }
    }
  },
  methods: {
    show () {
      getTenantAttribute(POWERTYPE).then(({ data }) => {
        if (data) {
          this.$temp = data.attributeValue
          this.$temp.split(',').forEach((val, index) => {
            this.config[`power${index + 1}`] = val
          })
        } else {
          this.$temp = ''
        }
        this.$refs.configDialog.show()
      })
    },
    onSave (done) {
      if (!this.config.power1) {
        this.$message({
          type: 'warning',
          message: '请配置屏体电源标签'
        })
      }

      if (!this.config.power2) {
        this.$message({
          type: 'warning',
          message: '请配置风机电源标签'
        })
      }

      const val = [
        this.config.power1,
        this.config.power2
      ].join(',')

      if (this.$temp === val) {
        done()
        return
      }
      updateTenantAttribute(POWERTYPE, val).then(done)
    }
  }
}
</script>