smsb-web-develop/src/views/external/box/settings/components/DeviceConfig/index.vue

<template>
  <div class="">
    <template v-if="isSuperAdmin">
      <div class="c-sibling-item--v u-font-size--sm u-bold">安全配置</div>
      <div class="c-sibling-item--v near l-grid--info mini">
        <button
          class="o-button"
          @click="onContentProtectionConfig"
        >
          内容保护
        </button>
      </div>
      <div class="c-sibling-item--v u-font-size--sm u-bold">属性配置</div>
      <div class="c-sibling-item--v near l-grid--info mini">
        <button
          class="o-button"
          @click="onAttributeConfig"
        >
          下发属性
        </button>
        <button
          class="o-button"
          @click="onAdConfig"
        >
          广告属性
        </button>
      </div>
    </template>
    <div class="c-sibling-item--v u-font-size--sm u-bold">播控器配置</div>
    <div class="c-sibling-item--v near l-grid--info mini">
      <button
        class="o-button"
        @click="onRecordConfig"
      >
        视频回采清晰度
      </button>
      <button
        class="o-button"
        @click="onSpacerConfig"
      >
        视频缓存垫片
      </button>
    </div>
    <div class="c-sibling-item--v u-font-size--sm u-bold">自动编排配置</div>
    <div class="c-sibling-item--v near l-grid--info mini">
      <button
        class="o-button"
        @click="onDatasetConfig"
      >
        填充素材包
      </button>
    </div>
    <attribute-config-dialog ref="attributeConfigDialog" />
    <content-protection-config-dialog ref="contentProtectionConfigDialog" />
    <ad-config-dialog ref="adConfigDialog" />
    <record-config-dialog ref="recordConfigDialog" />
    <spacer-config-dialog ref="spacerConfigDialog" />
    <dataset-config-dialog ref="datasetConfigDialog" />
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import AttributeConfigDialog from './components/AttributeConfigDialog.vue'
import ContentProtectionConfigDialog from './components/ContentProtectionConfigDialog.vue'
import AdConfigDialog from './components/AdConfigDialog.vue'
import RecordConfigDialog from './components/RecordConfigDialog.vue'

export default {
  name: 'DeviceNormalConfig',
  components: {
    AttributeConfigDialog,
    ContentProtectionConfigDialog,
    AdConfigDialog,
    RecordConfigDialog
  },
  props: {
    device: {
      type: Object,
      required: true
    }
  },
  computed: {
    ...mapGetters(['isSuperAdmin'])
  },
  methods: {
    onAttributeConfig () {
      this.$refs.attributeConfigDialog.show(this.device)
    },
    onContentProtectionConfig () {
      this.$refs.contentProtectionConfigDialog.show(this.device)
    },
    onAdConfig () {
      this.$refs.adConfigDialog.show(this.device)
    },
    onRecordConfig () {
      this.$refs.recordConfigDialog.show(this.device)
    },
    onSpacerConfig () {
      this.$refs.spacerConfigDialog.show({
        targetType: 3,
        targetKey: this.device.id
      })
    },
    onDatasetConfig () {
      this.$refs.datasetConfigDialog.show(this.device)
    }
  }
}
</script>