DTok/dtok-vue/src/views/base/Device.vue

<template>
  <v-container fluid>
    <CommonQueryCard :query-model="queryModel" v-on:searchDone="search" :col="4"></CommonQueryCard>

    <v-card style="margin-top: 15px" tile>
      <v-card-title>设备
        <v-spacer></v-spacer>
        <!--        <v-btn @click="addOpen" elevation="0" tile dark color="primary" class="mr-2">-->
        <!--          <v-icon left>-->
        <!--            mdi-plus-->
        <!--          </v-icon>-->
        <!--          新增-->
        <!--        </v-btn>-->
        <v-btn icon slot="widget-header-action" @click="search(null)">
          <v-icon class="text--secondary">mdi-refresh</v-icon>
        </v-btn>
      </v-card-title>
      <v-divider/>
      <v-data-table
        :headers="headers"
        :items="desserts"
        loading-text="加载中..."
        :loading="loading"
        class="elevation-1"
        :items-per-page="50"
      >
        <template v-slot:item.account="{ item }">
          {{ item.accountObj.username }}[{{ item.accountObj.name }}]
        </template>
        <template v-slot:item.deviceName="{ item }">
          {{ item.deviceBrand }}
        </template>
        <template v-slot:item.option="{item}">
          <v-btn elevation="0" tile @click="unBoundingDialogOpen(item)" dark color="red" class="mr-2">
            <v-icon left>
              mdi-alert-remove
            </v-icon>
            解绑
          </v-btn>
        </template>
      </v-data-table>
    </v-card>
    <CommonDialog
      title="确认解绑设备?"
      ref="unBoundingDialog"
      v-on:done="unBoundingDone"
    ></CommonDialog>
    <!--    <RoleAuthDialog v-on:done="search" :roles="roles" :user="currentUser" ref="roleDialog"></permissionAuthDialog>-->
  </v-container>
</template>

<script>
// import RoleAuthDialog from '../../components/dialog/permissionAuthDialog'
// import CommonForm from '../../components/dialog/CommonForm'
import CommonDialog from '../../components/dialog/CommonDialog'
import request from '../../axios/request'
import CommonQueryCard from '../../components/dialog/CommonQueryCard.vue'
import Device from '../../data/system/device/Device'

export default {
  name: 'Device',
  components: {
    CommonQueryCard,
    // RoleAuthDialog,
    CommonDialog
  },
  data () {
    return {
      show: false,
      headers: [
        {
          text: 'uuid',
          align: 'center',
          sortable: false,
          value: 'uuid'
        },
        {
          text: '所属用户',
          align: 'center',
          sortable: false,
          value: 'account'
        },
        {
          text: '手机型号',
          align: 'center',
          sortable: false,
          value: 'deviceName'
        },
        {
          text: 'IMEI标识',
          align: 'center',
          sortable: false,
          value: 'androidId'
        },
        {
          text: '注册时间',
          align: 'center',
          sortable: false,
          value: 'registerAt'
        },
        {
          text: '操作',
          align: 'center',
          sortable: false,
          value: 'option'
        }
      ],
      desserts: [],
      loading: true,
      query: {
        username: ''
      },
      temp: null,
      type: 'add',
      formModel: [
        {
          code: 'packageName',
          name: '包名',
          formType: 'text',
          value: '',
          notNull: true,
          option: [],
          col: 6
        },
        {
          code: 'name',
          name: 'App名称',
          formType: 'text',
          value: '',
          notNull: true,
          option: [],
          col: 6
        },
        {
          code: 'supportVersion',
          name: '支持版本',
          formType: 'json',
          mode: 'text',
          value: '',
          notNull: true,
          option: [],
          col: 6
        }
      ],
      file: null,
      importLoading: false,
      queryModel: Device.queryModel
    }
  },
  methods: {
    unBoundingDialogOpen (item) {
      this.temp = item
      this.$refs.unBoundingDialog.show()
    },
    unBoundingDone () {
      request({
        url: '/api/unBundleDevice/' + this.temp.uuid,
        method: 'get'
      })
        .then((resp) => {
          this.search(null)
          this.$refs.unBoundingDialog.close()
        })
        .catch((resp) => {

        })
    },

    search (params) {
      if (!this.$util.isNullOrUndefined(params)) {
        this.$util.replaceNull(params)
        this.query = params
      }
      this.loading = true
      request({
        url: '/device/search',
        method: 'get',
        params: {
          userId: this.query.username
        }
      })
        .then((resp) => {
          this.loading = false
          this.desserts = resp.data
        })
        .catch((resp) => {

        })
    }
  },
  created () {
    this.search()
  }
}
</script>

<style scoped>

</style>