<template>
  <div id="index">
    <admin-frame @search="search" :limit="limit" :total="total" topType="2" @back="back" :rightArrow="false" :useNav="false">
      <template v-slot:info>
        <van-col span="24" v-if="user.role == '1'" class="one">
          <van-button type="info" size="small" @click="toSearch()">查询条件</van-button>
          <van-button type="info" size="small" @click="toAdd()">添加用戶</van-button>
          <van-button type="info" size="small" @click="toImport()">批量注册</van-button>
          <van-button type="info" size="small" @click="tpExport()">批量导出</van-button>
        </van-col>
        <van-col span="24" class="two">
          <list-1 :list="list" @toEdit="toEdit" @toDel="toDel" @toPatent="toPatent" @toPsd="toPsd"></list-1>
        </van-col>
      </template>
    </admin-frame>
    <van-dialog
      class="dialog"
      v-model="dialog.show"
      :title="dialog.title"
      @confirm="onSearch"
      @cancel="unSearch"
      show-cancel-button
      cancelButtonText="重置查询"
      confirmButtonText="确认查询"
    >
      <div v-if="dialog.type == '1'">
        <van-form label-width="3em">
          <van-field v-model="searchInfo.phone" name="账号" label="账号" placeholder="请输入账号" />
          <van-field readonly clickable name="code" :value="searchInfo.code" label="邀请码" placeholder="点击选择邀请码" @click="oneShow = true" />
        </van-form>
      </div>
    </van-dialog>
    <van-popup v-model="oneShow" position="bottom">
      <van-picker show-toolbar :columns="adminList" value-key="name" @confirm="oneFim" @cancel="oneShow = false" />
    </van-popup>
  </div>
</template>

<script>
import list1 from './parts/list-1.vue';
import adminFrame from '@frame/src/components/mobile-frame/mobile-main.vue';
import { mapState, createNamespacedHelpers } from 'vuex';
const { mapActions: personal } = createNamespacedHelpers('personal');
const { mapActions: adminLogin } = createNamespacedHelpers('adminLogin');
export default {
  name: 'index',
  props: {},
  components: { adminFrame, list1 },
  data: function () {
    return {
      list: [],
      limit: 4,
      total: 0,
      searchInfo: {},
      // 邀请码
      adminList: [],
      oneShow: false,
      // 弹框
      dialog: { title: '查询条件', show: false, type: '1' },
    };
  },
  async created() {
    // 查询其他信息
    await this.searchOther();
    await this.search();
  },
  methods: {
    ...personal(['query', 'delete', 'export', 'updatePassword']),
    ...adminLogin({ aQuery: 'query' }),
    async search({ skip = 0, limit = this.limit, ...info } = {}) {
      if (this.user.role == '1') info.role = this.user.role;
      let res = await this.query({ skip, limit, code: this.user.code, ...this.searchInfo, ...info });
      if (this.$checkRes(res)) {
        this.$set(this, `list`, res.data);
        this.$set(this, `total`, res.total);
      }
    },
    // 添加查询条件
    toSearch() {
      this.dialog = { show: true, title: '查询条件', type: '1' };
    },
    // 确认选择
    oneFim(data) {
      this.$set(this.searchInfo, `code`, data.code);
      this.oneShow = false;
    },
    // 确认查询
    onSearch() {
      this.search();
    },
    // 重置查询
    unSearch() {
      this.$set(this, `searchInfo`, {});
      this.search();
    },
    // 添加用户
    toAdd() {
      this.$router.push({ path: `/account/users/detail` });
    },
    // 批量注册用户
    toImport() {
      this.$router.push({ path: `/account/users/import_user` });
    },
    // 批量导出用户
    async tpExport() {
      let res = await this.export();
      if (this.$checkRes(res)) {
        window.location.href = `${process.env.VUE_APP_HOST}/${res.data}`;
      }
    },
    // 编辑/审核
    toEdit(data) {
      this.$router.push({ path: `/account/users/detail`, query: { id: data.id } });
    },
    // 删除用户
    async toDel(data) {
      let res = await this.delete(data.id);
      if (this.$checkRes(res)) {
        this.$toast({ type: `success`, message: `操作完成` });
        this.search();
      }
    },
    // 专利信息
    toPatent(data) {
      this.$router.push({ path: `/account/patent/index`, query: { id: data._id } });
    },
    // 重置密码
    async toPsd(data) {
      let res = await this.updatePassword({ id: data.id, password: '123456' });
      if (this.$checkRes(res)) {
        this.$toast({ type: `success`, message: `重置密码完成` });
        this.search();
      }
    },
    // 返回
    back() {
      this.$router.push({ path: `/account/index` });
    },
    // 查询其他信息
    async searchOther() {
      let p1 = await this.aQuery({ role: '1' });
      if (this.$checkRes(p1)) {
        let data = [];
        for (const val of p1.data) {
          let p2 = await this.aQuery({ role: '2', pid: val.id });
          if (this.$checkRes(p2)) {
            data.push(...p2.data);
          }
        }
        this.$set(this, `adminList`, data);
      }
    },
  },
  computed: {
    ...mapState(['user']),
  },
  metaInfo() {
    return { title: this.$route.meta.title };
  },
  watch: {
    test: {
      deep: true,
      immediate: true,
      handler(val) {},
    },
  },
};
</script>

<style lang="less" scoped>
.one {
  background-color: #ffffff;
  text-align: center;
  padding: 10px 0;
  margin: 0 0 10px 0;
  .van-button {
    margin: 0 10px 5px 10px;
  }
}
</style>
