boss/pages/main/index/account_manager.vue

<template>
  <div>
    <div>
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="客户经理评级" name="grade">
          <el-table :data="gradeData" border style="width: 100%">
            <el-table-column
              prop=""
              label="评价者">
              <template slot-scope="scope">
          <span class="lblue point">
            <a target="_blank" :href="scope.row.host+'/wo/'+scope.row.user_id">{{
                scope.row.user_id_name + '(' + scope.row.user_id + ')'
              }}</a>
          </span>
              </template>
            </el-table-column>
            <el-table-column
              prop=""
              label="被评价者">
              <template slot-scope="scope">
          <span class="lblue point">
            <a target="_blank" :href="scope.row.host+'/wo/'+scope.row.manager_uid">{{
                scope.row.manager_uid_name + '(' + scope.row.manager_uid + ')'
              }}</a>
          </span>
              </template>
            </el-table-column>
            <el-table-column
              prop=""
              label="评价等级">
              <template slot-scope="scope">
                <span class="lblue point">
                   <el-rate  :value="scope.row.grade" disabled></el-rate>
                </span>
                <span>
                  {{scope.row.grade_name}}
                </span>
              </template>
            </el-table-column>
            <el-table-column prop="create_time" label="评价标签">
              <template slot-scope="scope">
                <span v-for="item in scope.row.labels" style="margin-left: 5px">
                  <el-tag size="mini" type="info">{{item}}</el-tag>
                </span>
              </template>
            </el-table-column>
            <el-table-column prop="create_time" label="评价时间">
              <template slot-scope="scope">
                <span>{{ formatDate(scope.row.create_time, 'Y-m-d H:i') }}</span>
              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="更改客户经理" name="change">
          <el-table :data="changeData" border style="width: 100%">
            <el-table-column
              prop=""
              label="申请者">
              <template slot-scope="scope">
          <span class="lblue point">
            <a target="_blank" :href="scope.row.host+'/wo/'+scope.row.apply_uid">{{
                scope.row.apply_uid_name + '(' + scope.row.apply_uid + ')'
              }}</a>
          </span>
              </template>
            </el-table-column>
            <el-table-column
              prop=""
              label="原客户经理">
              <template slot-scope="scope">
          <span class="lblue point">
            <a target="_blank" :href="scope.row.host+'/wo/'+scope.row.before_uid">{{
                scope.row.before_uid_name + '(' + scope.row.before_uid + ')'
              }}</a>
          </span>
              </template>
            </el-table-column>
            <el-table-column
              prop=""
              label="更换后客户经理">
              <template slot-scope="scope">
          <span class="lblue point">
            <a target="_blank" :href="scope.row.host+'/wo/'+scope.row.this_uid">{{
                scope.row.this_uid_name + '(' + scope.row.this_uid + ')'
              }}</a>
          </span>
              </template>
            </el-table-column>
            <el-table-column prop="create_time" label="申请时间">
              <template slot-scope="scope">
                <span>{{ formatDate(scope.row.create_time, 'Y-m-d H:i') }}</span>
              </template>
            </el-table-column>
            <el-table-column label="状态">
              <template slot-scope="scope">
                <span v-if="scope.row.status ===  '0'">待处理</span>
                <span v-else-if="scope.row.status ===  '1'">已处理</span>
                <span v-else>--</span>
              </template>
            </el-table-column>
            <el-table-column label="备注">
              <template slot-scope="scope">
                <span>{{ scope.row.remark }}</span>
              </template>
            </el-table-column>
            <el-table-column label="操作">
              <template slot-scope="scope">
                <el-button type="text" @click="onRemark(scope.row.id)">添加备注</el-button>
                <el-button type="text" v-if="scope.row.status === '0'" @click="onUpdateManager(scope.row)">立即处理</el-button>
                <el-button type="text" v-else disabled>已处理</el-button>

              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>
      </el-tabs>

    </div>

    <div class="page">
      <el-pagination
        class="order-footer"
        background
        layout="total, prev, pager, next"
        :page-size="20"
        :total="total"
        @current-change="handleCurrentChange"
      />
    </div>

    <el-dialog title="添加备注" :visible.sync="remarkModel">
      <div>
        <el-input
          type="textarea"
          :rows="5"
          placeholder="请输入内容"
          v-model="remarkData.content">
        </el-input>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="remarkModel = false">取 消</el-button>
        <el-button type="primary" :loading="loading" @click="onRemarkSave">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "user_cards_list",
  data() {
    return {
      page: 1,
      total: 0,
      loading: false,
      remarkData: {id: '0', content: ''},
      activeName: 'grade',
      remarkModel: false,
      gradeData: [],
      changeData: [],

    }
  },
  mounted() {
    this.getData()
  },
  methods: {
    getData() {
      if (this.activeName === 'change') {
        this.getChangeList();
      } else if (this.activeName === 'grade') {
        this.getGradeList();
      }
    },
    handleClick(tab, event) {
      this.activeName = tab.name;
      this.getData();
    },
    async getChangeList() {
      const page = this.page;
      const data = {
        page
      };
      let res = await this.$post("/api/admin/accountManager/getChangeManagerList", data);
      if (res && res.status === 1) {
        this.changeData = res.data.list || [];
        this.total = res.data.total * 1;
      }
    },
    async getGradeList() {
      const page = this.page;
      const data = {
        page
      };
      let res = await this.$post("/api/admin/accountManager/getGradeList", data);
      if (res && res.status === 1) {
        this.gradeData = res.data.list || [];
        this.total = res.data.total * 1;
      }
    },
    onRemark(id) {
      this.remarkData.id = id;
      this.remarkModel = true;
    },
    async onRemarkSave() {
      this.loading = true;
      if (this.remarkData.content === '' || this.remarkData.id === '0') {
        this.$message.error('请输入内容')
        this.loading = false
        return false
      }
      let data = {content: this.remarkData.content, id: this.remarkData.id}
      let res = await this.$post("/api/admin/accountManager/saveRemark", data);
      if (res && res.status === 1) {
        this.$message.success('备注成功')
        this.remarkModel = false
        this.getData()
      }
      this.loading = false
    },
    async onUpdateManager(row) {
      let data = {id: row.id}
      let res = await this.$post("/api/admin/accountManager/updateManager", data);
      if (res && res.status === 1) {
        this.$message.success('已备注')
        this.getData();
      }
    },
    handleCurrentChange(val) {
      this.page = val;
      this.getData();
    },
    formatDate(time, format = '') {
      if (time === "0") {
        return "--";
      }
      let now = new Date(time * 1000);
      let year = now.getFullYear();
      let month = now.getMonth() + 1;
      let date = now.getDate();
      let hour = now.getHours();
      let minute = now.getMinutes();
      let second = now.getSeconds();
      if (hour < 10) {
        hour = "0" + hour;
      }
      if (minute < 10) {
        minute = "0" + minute;
      }
      if (second < 10) {
        second = "0" + second;
      }
      return (format == '' ?
          year +
          "-" +
          month +
          "-" +
          date +
          " " +
          hour +
          ":" +
          minute +
          ":" +
          second
          :
          year +
          "-" +
          month +
          "-" +
          date +
          " " +
          hour +
          ":" +
          minute
      );
    },

  }

}
</script>

<style scoped>

.page {
  margin-top: 10px;
}
</style>