live-mobile/src/views/adminCenter/user/parts/userlist.vue

<template>
  <div id="auditList">
    <el-row>
      <el-col :span="24" class="info">
        <el-col :span="24" class="newuser"><van-button type="info" size="small" @click="usersubmit()">新建用户</van-button> </el-col>
        <el-col :span="24" class="list" v-for="(item, index) in list" :key="index">
          <p class="textOver">
            <span class="textOver">{{ item.name }}</span>
            <span style="float:right"> <van-button type="danger" size="small" @click="toDelete(item)">删除</van-button></span>
            <span style="float:right"
              ><van-button type="info" size="small" @click="submit(item)">{{
                item.status == '0' ? '审核' : item.status == '1' ? '查看' : '未识别'
              }}</van-button>
            </span>
          </p>
          <p>
            <span class="ptwo"><span>电话:</span>{{ item.phone || '暂无' }}</span>
            <span class="ptwo">
              <span>用户类型:</span>{{ item.role == '2' ? '个人用户' : item.role == '3' ? '企业用户' : item.role == '6' ? '专家用户' : '临时用户' }}</span
            >
          </p>
          <p class="newptwo">
            <span>状态：</span>{{ item.status == '0' ? '待审核' : item.status == '1' ? '审核成功' : item.status == '2' ? '审核拒绝' : '待认证' }}
          </p>
        </el-col>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { mapState, createNamespacedHelpers } from 'vuex';
const { mapActions: exportuser } = createNamespacedHelpers('exportuser');
const { mapActions: user } = createNamespacedHelpers('user');
export default {
  name: 'auditList',
  props: {},
  components: {},
  data: function() {
    return {
      list: [],
    };
  },
  created() {
    this.search();
  },
  methods: {
    ...user(['query', 'delete', 'update']),
    ...exportuser({ exportuserQuery: 'query' }),
    async search() {
      if (this.user.code.length == 3) {
        const res = await this.query();
        const resTwo = await this.exportuserQuery();
        var newData = res.data.concat(resTwo.data);
        if (this.$checkRes(newData)) {
          var arr = newData.filter(item => item.pid == undefined && item.status != '3');
          this.$set(this, `list`, arr);
        }
      } else {
        const res = await this.query({ code: this.user.code });

        const resTwo = await this.exportuserQuery({ code: this.user.code });
        console.log(resTwo);

        var newData = res.data.concat(resTwo.data);
        console.log(newData);

        if (this.$checkRes(newData)) {
          var arr = newData.filter(item => item.pid == undefined && item.status != '3');
          this.$set(this, `list`, arr);
        }
      }
    },
    async submit(item) {
      this.$router.push({ path: './detail', query: { id: item.id, role: item.role } });
    },
    usersubmit() {
      this.$router.push({ path: './detail' });
    },
    async toDelete(item) {
      const res = await this.delete(item.id);
      if (this.$checkRes(res, '删除成功', res.errmsg || '删除失败')) this.search();
    },
  },
  computed: {
    ...mapState(['user']),
    pageTitle() {
      return `${this.$route.meta.title}`;
    },
  },
  metaInfo() {
    return { title: this.$route.meta.title };
  },
};
</script>

<style lang="less" scoped>
.newuser {
  text-align: center;
  padding: 10px 0 10px 10px;
}
.info {
  border-top: 1px solid #f5f5f5;
  .list {
    background: #fff;
    padding: 0 10px;
    border-bottom: 1px solid #ccc;
    p {
      font-size: 14px;
      color: #000;
      padding: 5px 0;
    }
    p:first-child {
      font-size: 16px;
      span:first-child {
        width: 60%;
        display: inline-block;
      }
    }
    p:nth-child(2) .ptwo {
      display: inline-block;
      width: 50%;
    }
    p:nth-child(2) .ptwo span:first-child {
      color: #ccc;
    }
    p:last-child span {
      color: #ccc;
    }
  }
}
.content {
  padding: 16px 16px 160px;
  height: 160px;
  background-color: aqua;
}
.newptwo {
  color: #ccc !important;
}
/deep/.van-button--small {
  min-width: 60px;
  height: 30px;
  padding: 0 8px;
  font-size: 12px;
  margin: 0 5px 0 0;
}
</style>