feat: #0000 单个删除+批量删除

src/views/setting/user/index.vue

@@ -59,7 +59,7 @@
 					<status-indicator v-else pulse type="danger"></status-indicator>
 				</template>
 
-				<template #actionSlot="">
+				<template #actionSlot="scope">
 					<el-tooltip content="编辑" placement="bottom" effect="light">
 						<el-icon class="ibt0">
 							<Edit />
@@ -103,71 +103,59 @@ const activeData = ref({})
 const formOptions = ref({
 	forms: [
 		{
-			prop: 'custName',
+			prop: 'username',
 			label: '登录账号',
 			itemType: 'input',
 			placeholder: '用于登录系统',
 			rules: [{ required: true, message: '请输入登录账号', trigger: 'blur' }]
 		},
 		{
-			prop: 'custName1',
+			prop: 'password',
 			label: '登录密码',
 			itemType: 'input',
 			rules: [{ required: true, message: '请输入登录密码', trigger: 'blur' }]
 		},
 		{
-			prop: 'custName2',
+			prop: 'password2',
 			label: '确认密码',
 			itemType: 'input',
 			rules: [{ required: true, message: '请再次输入密码', trigger: 'blur' }]
 		},
 		{
-			prop: 'custName3',
+			prop: 'nickName',
 			label: '昵称',
 			itemType: 'input'
 		},
 		{
-			prop: 'custName4',
+			prop: 'realName',
 			label: '姓名',
 			itemType: 'input'
 		},
 		{
-			prop: 'custName5',
+			prop: 'sex',
 			label: '性别',
 			itemType: 'radio',
 			options: [
-				{ value: '0', label: '男' },
-				{ value: '1', label: '女' }
+				{ value: '男', label: '男' },
+				{ value: '女', label: '女' }
 			]
 		},
 		{
-			prop: 'switch',
-			// label: '状态',
-			t_label: '状态',
+			prop: 'status',
+			label: '状态',
 			itemType: 'switch',
-			slots: {
-				label: 'slot_label_test'
-			},
 			activeText: '是',
-			inactiveText: '否',
-			change(value, options, params) {
-				console.warn('dataType change  value, options, params', value, options, params)
-			}
+			inactiveText: '否'
 		},
 		{
-			prop: 'select多选',
+			prop: 'roleIds',
 			label: '所属角色',
 			itemType: 'select',
 			multiple: true,
 			collapseTags: true,
 			maxCollapseTags: 1,
 			filterable: true,
-			itemWidth: '200px',
-			options: [
-				{ value: '类型one', label: '类型一' },
-				{ value: '类型two', label: '类型二' },
-				{ value: '类型three', label: '类型三' }
-			]
+			options: []
 		}
 	],
 	labelWidth: 120,
@@ -176,7 +164,7 @@ const formOptions = ref({
 	formConfig: {
 		submitLoading: false
 	}
-})
+}) // 新增的表单
 const showGroupLoading = ref(false)
 const groupFilterText = ref('')
 const treeRef = ref<InstanceType<typeof ElTree>>()
@@ -202,16 +190,26 @@ const getGroup = async () => {
 	treeData.value = data // console.log('获取左侧菜单数据')
 }
 
+// 获取全部的角色列表
+const getRolesList = async () => {
+	try {
+		const data = await role.roleListAllApi()
+		formOptions.value.forms[7].options = data.map(item => {
+			return { value: item.id, label: item.name }
+		})
+	} catch (e) {
+		console.log(e)
+	}
+}
+
 // 左侧菜单点击
 const roleClick = data => {
 	console.log(data.id, 'data.id')
 	// 修改search参数 watch 变更 自动刷新 列表
 	searchData.value = { ...searchData.value, data: { roleId: data.id ? data.id : null } }
-	// queryList()
-	// 刷新右侧的表格
 }
 
-// 搜索条件
+// 表格搜索条件
 const forms = ref([
 	{
 		prop: 'name',
@@ -314,11 +312,6 @@ const { searchData, tableOpts, checkedColumns, activeColumns } = useTablePage(
 		options: {
 			showIndex: false
 		},
-		// searchParams: {
-		// 	// page: 1,
-		// 	// size: 10,
-		// 	test: 1
-		// },
 		// 需要展示的列
 		columns,
 		// 控制列配置
@@ -334,16 +327,42 @@ const { searchData, tableOpts, checkedColumns, activeColumns } = useTablePage(
 // // 列接口请求后 进行赋值
 // checkedColumns.value = columns
 // 删除
+const deleteItem = async ids => {
+	try {
+		await user.userDeleteApi(ids)
+	} catch (e) {
+		console.log('删除失败')
+		ElMessage.error(`删除失败~`)
+	}
+}
+
+// 单个删除
 const table_del = row => {
-	// 删除
+	deleteItem([row.id])
 }
 
 //批量删除
-const batch_del = () => {}
+const batch_del = () => {
+	const id = checkedColumns.value.map(item => item.id)
+	deleteItem(id)
+}
 
 // 弹窗事件
-const submitHandler = params => {
-	ElMessage.success(`${isCreate.value ? '新增' : '修改'}成功~`)
+const submitHandler = async params => {
+	formOptions.value.formConfig.submitLoading = true
+	try {
+		params.status = params.status ? 1 : 0
+		await user.userAddOrEditSaveApi(params)
+		ElMessage.success(`${isCreate.value ? '新增' : '修改'}成功~`)
+		visible.value = false
+		tableOpts.searchParams = {
+			...(tableOpts.searchParams as SearchParams),
+			page: 1
+		}
+	} catch (e) {
+		console.log(e)
+		formOptions.value.formConfig.submitLoading = false
+	}
 }
 
 const addHandler = () => {
@@ -354,6 +373,7 @@ const addHandler = () => {
 
 nextTick(() => {
 	getGroup()
+	getRolesList()
 	queryList()
 })