diff --git a/src/pages/workplace/configuration/components/Banner.vue b/src/pages/workplace/configuration/components/Banner.vue
index 753def6..724c960 100644
--- a/src/pages/workplace/configuration/components/Banner.vue
+++ b/src/pages/workplace/configuration/components/Banner.vue
@@ -5,9 +5,6 @@
-
-
-
新增轮播
@@ -30,29 +27,21 @@
{{ item.formatter(scope.row) }}
-
- {{ scope.row[item.prop] }}
+
+ {{ scope.row[item.prop!] }}
-
-
+
@@ -63,6 +52,7 @@ import { BU_DOU_CONFIG } from '@/config';
// API接口
import { bannerGet, bannerDelete } from '@/api/workplace/banner';
+
/**
* 表格
*/
@@ -105,12 +95,17 @@ const column = reactive([
{
prop: 'operation',
label: '操作',
+ width: 150,
align: 'center',
render: (scope: any) => {
return (
- 编辑
- onDelBanner(scope.row)}>删除
+ onBannerEidt(scope.row)}>
+ 编辑
+
+ onDelBanner(scope.row)}>
+ 删除
+
);
}
@@ -118,8 +113,6 @@ const column = reactive([
]);
const tableData = ref([]);
const loadTable = ref(false);
-// 分页
-const total = ref(0);
// 查询
const queryFrom = reactive({
@@ -135,21 +128,23 @@ const getTableList = () => {
});
};
-// 分页page-size
-const onSizeChange = (size: number) => {
- queryFrom.page_size = size;
- getTableList();
-};
-
-// 分页page-size
-const onCurrentChange = (current: number) => {
- queryFrom.page_index = current;
- getTableList();
-};
-
// 新增轮播
const bannerDialogValue = ref(false);
+const bannerDialogTitle = ref('新增轮播');
+const bannerDialogType = ref<'add' | 'edit'>('add');
const onBannerDialogValue = () => {
+ bannerDialogTitle.value = `新增轮播`;
+ bannerDialogType.value = 'add';
+ bannerDialogValue.value = true;
+};
+
+// 编辑轮播
+
+const bannerDialogData = ref({});
+const onBannerEidt = (item: any) => {
+ bannerDialogTitle.value = `编辑${item.title}`;
+ bannerDialogData.value = item;
+ bannerDialogType.value = 'edit';
bannerDialogValue.value = true;
};
@@ -170,7 +165,7 @@ const onDelBanner = (item: any) => {
getTableList();
ElMessage({
type: 'success',
- message: `轮播群组成功!`
+ message: `轮播删除成功!`
});
})
.catch(err => {
diff --git a/src/pages/workplace/configuration/components/BannerDialog.vue b/src/pages/workplace/configuration/components/BannerDialog.vue
index 07f90b2..7c85a9e 100644
--- a/src/pages/workplace/configuration/components/BannerDialog.vue
+++ b/src/pages/workplace/configuration/components/BannerDialog.vue
@@ -7,7 +7,7 @@
:close-on-press-escape="false"
:draggable="true"
:z-index="99"
- title="新增轮播"
+ :title="title"
@close="onClose"
>
@@ -50,7 +50,7 @@
取消
- 保存
+ 保存
@@ -62,23 +62,28 @@ import { ElMessage } from 'element-plus';
import { Plus } from '@element-plus/icons-vue';
import { useUserStore } from '@/stores/modules/user';
// API 接口
-import { bannerPost } from '@/api/workplace/banner';
+import { bannerPost, bannerPut } from '@/api/workplace/banner';
import { feileGet } from '@/api/file';
import { BU_DOU_CONFIG } from '@/config';
interface IProps {
value: boolean;
+ title: string;
+ type: 'add' | 'edit';
+ data: object;
}
const userStore = useUserStore();
const props = withDefaults(defineProps(), {
- value: false
+ value: false,
+ title: '新增轮播',
+ type: 'add'
});
const content = ref('');
const loaging = ref(false);
-const formData = reactive({
+const formData = ref({
cover: '',
title: '',
description: '',
@@ -94,7 +99,18 @@ const emits = defineEmits<{
watch(
() => props.value,
(n, _o) => {
- props.value = n;
+ if (n && props.type === 'edit') {
+ formData.value = props.data as any;
+ }
+ if (!n) {
+ formData.value = {
+ cover: '',
+ title: '',
+ description: '',
+ route: '',
+ jump_type: 0
+ };
+ }
}
);
// 上传图片
@@ -116,17 +132,17 @@ const beforeAvatarUpload = async (rawFile: any) => {
}
};
const handleAvatarSuccess = (response: any, _uploadFile: any) => {
- console.log(response);
- formData.cover = response.path;
+ formData.value.cover = response.path;
};
// 取消
const onClose = () => {
emits('update:value', false);
};
-// 发送
-const onSend = () => {
+
+// 新增轮播
+const addBanner = () => {
loaging.value = true;
- bannerPost(formData)
+ bannerPost(formData.value)
.then((res: any) => {
loaging.value = false;
if (res.status == 200) {
@@ -143,6 +159,36 @@ const onSend = () => {
}
});
};
+
+// 编辑轮播
+const editBanner = () => {
+ loaging.value = true;
+ bannerPut(formData.value)
+ .then((res: any) => {
+ loaging.value = false;
+ if (res.status == 200) {
+ ElMessage.success('编辑成功!');
+ content.value = '';
+ onClose();
+ emits('ok', true);
+ }
+ })
+ .catch(err => {
+ loaging.value = false;
+ if (err.status == 400) {
+ ElMessage.error(err.msg);
+ }
+ });
+};
+// 发送
+const onConfirm = () => {
+ if (props.type === 'add') {
+ addBanner();
+ }
+ if (props.type === 'edit') {
+ editBanner();
+ }
+};