| | |
| | | </el-table-column> |
| | | <el-table-column prop="permissions" label="æé"> |
| | | <template #default="scope"> |
| | | <el-tag v-for="perm in scope.row.permissions" :key="perm" size="small" style="margin-right: 5px;"> |
| | | <el-tag v-for="perm in scope.row.permissionsList" :key="perm" size="small" style="margin-right: 5px;"> |
| | | {{ perm }} |
| | | </el-tag> |
| | | </template> |
| | |
| | | |
| | | <!-- å页 --> |
| | | <pagination |
| | | :total="pagination.total" |
| | | :total="total" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :page="pagination.currentPage" |
| | | :limit="pagination.pageSize" |
| | | :page="pagination.current" |
| | | :limit="pagination.size" |
| | | @pagination="handleCurrentChange" |
| | | /> |
| | | </el-card> |
| | |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { ref, reactive, computed, nextTick } from 'vue' |
| | | import { ref, reactive, computed,onMounted } from 'vue' |
| | | import { ElMessage, ElMessageBox } from 'element-plus' |
| | | import {listPage,add,update,deleteSalespersonManagement} from '@/api/salesManagement/salespersonManagement.js' |
| | | import { Plus, Search } from '@element-plus/icons-vue' |
| | | import Pagination from '@/components/PIMTable/Pagination.vue' |
| | | |
| | | const salespersonList = ref([]) |
| | | const total = ref(0) |
| | | |
| | | onMounted(() => { |
| | | getList() |
| | | }) |
| | | const getList = () => { |
| | | loading.value = true |
| | | listPage({...pagination,...searchForm}).then(res => { |
| | | salespersonList.value = res.data.records |
| | | total.value = res.data.total |
| | | loading.value = false |
| | | }) |
| | | } |
| | | |
| | | // ååºå¼æ°æ® |
| | | const loading = ref(false) |
| | |
| | | status: '' |
| | | }) |
| | | |
| | | const salespersonList = ref([ |
| | | { |
| | | id: 1, |
| | | name: 'éå¿å¼º', |
| | | phone: '13800138001', |
| | | email: 'chenzhiqiang@company.com', |
| | | department: 'éå®é¨', |
| | | position: 'éå®ç»ç', |
| | | hireDate: '2023-01-15', |
| | | status: 'å¨è', |
| | | permissions: ['订å管ç', '客æ·ç®¡ç', 'è´¢å¡ç®¡ç'] |
| | | }, |
| | | { |
| | | id: 2, |
| | | name: 'åé
å©·', |
| | | phone: '13800138002', |
| | | email: 'liuyating@company.com', |
| | | department: 'å¸åºé¨', |
| | | position: 'å¸åºä¸å', |
| | | hireDate: '2023-03-20', |
| | | status: 'å¨è', |
| | | permissions: ['客æ·ç®¡ç', 'æ¥è¡¨æ¥ç'] |
| | | }, |
| | | { |
| | | id: 3, |
| | | name: 'ç建å½', |
| | | phone: '13800138003', |
| | | email: 'wangjianguo@company.com', |
| | | department: '客æé¨', |
| | | position: '客æä¸»ç®¡', |
| | | hireDate: '2022-11-10', |
| | | status: 'å¨è', |
| | | permissions: ['客æ·ç®¡ç', 'å货管ç'] |
| | | } |
| | | ]) |
| | | |
| | | const pagination = ref({ |
| | | total: 3, |
| | | currentPage: 1, |
| | | pageSize: 10 |
| | | |
| | | const pagination = reactive({ |
| | | current: 1, |
| | | size: 10 |
| | | }) |
| | | |
| | | const dialogVisible = ref(false) |
| | |
| | | } |
| | | |
| | | const handleSearch = () => { |
| | | getList() |
| | | // æç´¢é»è¾å·²å¨computedä¸å¤ç |
| | | } |
| | | |
| | |
| | | cancelButtonText: 'åæ¶', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | const index = salespersonList.value.findIndex(item => item.id === row.id) |
| | | if (index > -1) { |
| | | salespersonList.value.splice(index, 1) |
| | | pagination.value.total-- |
| | | ElMessage.success('å 餿å') |
| | | } |
| | | let ids = [row.id] |
| | | deleteSalespersonManagement(ids).then(res => { |
| | | if(res.code === 200){ |
| | | ElMessage.success('å 餿å') |
| | | getList() |
| | | } |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | const handlePermissions = (row) => { |
| | | currentSalesperson.value = row |
| | | currentPermissions.value = [...row.permissions] |
| | | currentPermissions.value = row.permissions.split(",") |
| | | permissionDialogVisible.value = true |
| | | } |
| | | |
| | | const savePermissions = () => { |
| | | const index = salespersonList.value.findIndex(item => item.id === currentSalesperson.value.id) |
| | | if (index > -1) { |
| | | salespersonList.value[index].permissions = [...currentPermissions.value] |
| | | ElMessage.success('æé设置æå') |
| | | permissionDialogVisible.value = false |
| | | let splice = currentPermissions.value; |
| | | if(splice[0] === ''){ |
| | | splice.splice(0,1) |
| | | } |
| | | currentSalesperson.value.permissions = splice.join(",") |
| | | update(currentSalesperson.value).then(res => { |
| | | if(res.code === 200){ |
| | | ElMessage.success('æé设置æå') |
| | | permissionDialogVisible.value = false |
| | | getList() |
| | | } |
| | | }) |
| | | } |
| | | |
| | | const handleSubmit = () => { |
| | |
| | | if (valid) { |
| | | if (isEdit.value) { |
| | | // ç¼è¾ |
| | | const index = salespersonList.value.findIndex(item => item.id === editId.value) |
| | | if (index > -1) { |
| | | salespersonList.value[index] = { ...form, id: editId.value } |
| | | ElMessage.success('ç¼è¾æå') |
| | | } |
| | | } else { |
| | | // æ°å¢ |
| | | const newId = Math.max(...salespersonList.value.map(item => item.id)) + 1 |
| | | salespersonList.value.push({ |
| | | ...form, |
| | | id: newId, |
| | | permissions: [] |
| | | update(form).then(res => { |
| | | if(res.code === 200){ |
| | | ElMessage.success('ç¼è¾æå') |
| | | dialogVisible.value = false |
| | | getList() |
| | | } |
| | | }) |
| | | pagination.value.total++ |
| | | ElMessage.success('æ°å¢æå') |
| | | } else { |
| | | add(form).then(res => { |
| | | if(res.code === 200){ |
| | | ElMessage.success('æ°å¢æå') |
| | | dialogVisible.value = false |
| | | getList() |
| | | } |
| | | }) |
| | | |
| | | } |
| | | dialogVisible.value = false |
| | | |
| | | } |
| | | }) |
| | | } |