s

src/components/pages/PaymentManagement/SetAdministrators.vue

+<template>
+  <div class="cashierManagement">
+    <a-button type="primary" style="margin-bottom: 20px" @click="choosePeople">添加管理员</a-button>
+    <div class="searchUserMessage" v-if="searchSource.UserMessage.emplId">
+      <div class="positionDiv"></div>
+      <div class="clearUserMessage"><a href="javascript:;" @click="clearUserMessage">清除</a></div>
+      <img v-if="searchSource.UserMessage.avatar" :src="searchSource.UserMessage.avatar" :alt="searchSource.UserMessage.name"/>
+      <img v-else :src="this.avatarCanvasFn(searchSource.UserMessage.name)" :alt="searchSource.UserMessage.name">
+      <span>{{ searchSource.UserMessage.name }}</span>
+    </div>
+    <a-table :columns="columns" :dataSource="cashierManagementList" size="default" rowKey="id" :pagination="pagination" @change="handleTableChange">
+      <span slot="name">成员</span>
+      <span slot="createDate" slot-scope="createDate">
+        {{ mwUtils.timeToStr(createDate) }}
+      </span>
+      <span slot="action" slot-scope="text, record, index">
+        <a v-if="record.status === '0'" href="javascript:;" @click="showModel(record, text, index)">删除</a>
+        <a v-else href="javascript:;" style="color:#cccccc">已删除</a>
+      </span>
+    </a-table>
+  </div>
+</template>
+
+<script>
+import { config } from './../../../api/config.js'
+import { $http } from './../../../api/axios.js'
+import { mwUtils } from './../../../lib/utils.js'
+export default {
+  name: 'cashierManagement',
+  data () {
+    return {
+      mwUtils: mwUtils,
+      searchSource: {
+        UserMessage: {
+          avatar: '',
+          emplId: '',
+          name: ''
+        },
+        status: '',
+        agentId: ''
+      },
+      columns: [{
+        title: '成员',
+        dataIndex: 'name'
+      }, {
+        title: '时间',
+        dataIndex: 'createDate',
+        scopedSlots: { customRender: 'createDate' }
+      }, {
+        title: '操作',
+        dataIndex: 'action',
+        scopedSlots: { customRender: 'action' }
+      }],
+      cashierManagementList: [],
+      pagination: {
+        current: 1,
+        defaultCurrent: 1,
+        defaultPageSize: 10,
+        hideOnSinglePage: true,
+        total: 0
+      }
+    }
+  },
+  watch: {},
+  computed: {},
+  created: function () {
+    this.getCashierList()
+  },
+  methods: {
+    showModel (record, text, index) {
+      const _that = this
+      this.$confirm({
+        title: '确认要删除该管理员吗？',
+        content: '删除后，该人员无法在后台管理系统上登录',
+        okText: '确定',
+        cancelText: '取消',
+        onOk () {
+          _that.deleteCashier(record)
+        }
+      })
+    },
+    deleteCashier (record) {
+      let DeleteCashierData = this.$qs.stringify({
+        ddUserId: record.userId,
+        cashierStatus: '1',
+        orgId: localStorage.getItem('orgId'),
+        userType: '1',
+        id: record.id
+      })
+      $http.get(`/cashier/delete_cashier?${DeleteCashierData}`).then((res) => {
+        if (res.data.resultCode === '0') {
+          this.$message.success('操作成功')
+          this.getCashierList()
+        } else {
+          this.$message.error(res.data.message)
+        }
+      }).catch(() => {
+        this.$message.error('删除失败')
+      })
+    },
+    getCashierList () {
+      let CashierListData = this.$qs.stringify({
+        pageNumber: this.pagination.defaultPageSize,
+        currentPage: this.pagination.current,
+        orgId: localStorage.getItem('orgId'),
+        userType: '1'
+      })
+      $http.get(`/cashier/list_cashier?${CashierListData}`).then((res) => {
+        this.pagination.total = parseInt(res.data.data.total)
+        this.cashierManagementList = res.data.data.list
+      }).catch(() => {
+        this.$message.error('获取收银员信息失败')
+      })
+    },
+    createTimeToStr (time) {
+      let timeData = new Date(parseInt(time))
+      let year = timeData.getFullYear()
+      let month = timeData.getMonth() + 1
+      let date = timeData.getDate()
+      let hour = timeData.getHours()
+      let minute = timeData.getMinutes()
+      return `${year}年${month}月${date}日 ${hour}:${minute}`
+    },
+    choosePeople () {
+      config.ddready('ddchooseOne').then((res) => {
+        let insertCashierData = this.$qs.stringify({
+          cashierName: res[0].name,
+          ddUserId: res[0].emplId,
+          cashierStatus: '0',
+          userType: '1',
+          orgId: localStorage.getItem('orgId')
+        })
+        $http.get(`/cashier/insert_cashier?${insertCashierData}`).then((res) => {
+          if (res.data.resultCode === '0') {
+            this.$message.success('添加成功')
+            this.getCashierList()
+          } else {
+            this.$message.error(res.data.message)
+          }
+        }).catch((err) => {
+          console.log(err)
+        })
+      })
+    },
+    handleTableChange (pagination, filters, sorter) {
+      this.pagination.current = pagination.current
+      this.getCashierList()
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.searchUserMessage{
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  font-size: 12px;
+  padding: 8px 8px;
+  border: 1px solid #cccccc;
+  margin-bottom: 15px;
+  border-radius: 8px;
+  position: relative;
+}
+.searchUserMessage img{
+  width: 32px;
+  height: 32px;
+  border-radius: 50%;
+  margin-bottom: 8px;
+}
+.positionDiv{
+  height: 12px;
+  width: 12px;
+  transform:rotate(45deg);
+  border-left: 1px solid #cccccc;
+  border-top: 1px solid #cccccc;
+  position: absolute;
+  top: -7px;
+  left: 30px;
+  background: white;
+  z-index: 99;
+}
+.clearUserMessage{
+  position: absolute;
+  right: 10px;
+}
+.peopleBox{
+  width: 100%;
+  border: 1px solid #d9d9d9;
+  min-height: 40px;
+  border-radius: 4px;
+  padding: 4px 11px;
+  font-size: 14px;
+  line-height: 1.5;
+  cursor: pointer;
+}
+</style>