|
@@ -0,0 +1,141 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <ListPage tableKey="businessbannerId" :column="listPageData.tableColumn" :tableApi="listPageData.tableApi"
|
|
|
+ :isSelect="listPageData.isSelect" :scopeBtns="listPageData.scopeBtns" :searchBtns="listPageData.searchBtns"
|
|
|
+ ref="userTableRef" />
|
|
|
+
|
|
|
+ <el-dialog :title="title" v-model="open" width="500" :before-close="cancel">
|
|
|
+ <div style="padding: 20px;">
|
|
|
+ <FileUpload :fileType="['png', 'jpg', 'jpeg']" @update:modelValue="fileUpdata" :modelValue="files"/>
|
|
|
+ </div>
|
|
|
+ <template #footer>
|
|
|
+ <div class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="submitForm">确 定</el-button>
|
|
|
+ <el-button @click="cancel">取 消</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { onMounted, ref, render } from 'vue';
|
|
|
+import ListPage from '@/views/components/ListPage/index.vue';
|
|
|
+import { add, list,delbanner } from "@/api/system/banner";
|
|
|
+
|
|
|
+const { proxy } = getCurrentInstance();
|
|
|
+
|
|
|
+const userTableRef = ref();
|
|
|
+const uploadRef = ref([]);
|
|
|
+const listPageData = reactive({
|
|
|
+ tableColumn: [
|
|
|
+ {
|
|
|
+ label: '创建人',
|
|
|
+ prop: 'createBy',
|
|
|
+ type:'input',
|
|
|
+ isSearch: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '创建时间',
|
|
|
+ prop: 'createTime',
|
|
|
+
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '图片',
|
|
|
+ prop: 'picture',
|
|
|
+ type: 'img',
|
|
|
+ },
|
|
|
+
|
|
|
+ ],
|
|
|
+ searchBtns: [
|
|
|
+ {
|
|
|
+ label: '新增',
|
|
|
+ func: () => {
|
|
|
+ console.log('新增')
|
|
|
+ openDialog();
|
|
|
+ },
|
|
|
+ key: 'add',
|
|
|
+ hasPermi: ['banner:add'],
|
|
|
+ icon: 'Plus',
|
|
|
+ type: 'primary'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ tableApi: list,//接口地址
|
|
|
+ isSelect: false,//是否勾选
|
|
|
+ scopeBtns: [
|
|
|
+ {
|
|
|
+ label: '编辑',
|
|
|
+ type: 'primary',
|
|
|
+ hasPermi: ['banner:edit'],
|
|
|
+ key: 'edit',
|
|
|
+ func: (row) => {
|
|
|
+ console.log(row)
|
|
|
+ openDialog(row);
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '删除',
|
|
|
+ type: 'danger',
|
|
|
+ hasPermi: ['banner:delete'],
|
|
|
+ key: 'edit',
|
|
|
+ func: (row) => {
|
|
|
+ console.log(row)
|
|
|
+ handleDelete([row.slideshowId])
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ]
|
|
|
+})
|
|
|
+
|
|
|
+const open = ref(false);
|
|
|
+const files = ref('');
|
|
|
+const fileUpdata = (file) => {
|
|
|
+ console.log(file);
|
|
|
+ files.value = file;
|
|
|
+}
|
|
|
+
|
|
|
+const openDialog = async (row) => {
|
|
|
+
|
|
|
+ try {
|
|
|
+ if(row){
|
|
|
+ files.value = row.picture;
|
|
|
+ }
|
|
|
+
|
|
|
+ } catch (error) {
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ } finally {
|
|
|
+ open.value = true;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const handleDelete = (ids) => {
|
|
|
+ console.log('ids', ids);
|
|
|
+
|
|
|
+ proxy.$modal.confirm('是否确认删除编号为"' + ids + '"的数据项?').then(function () {
|
|
|
+ return delbanner(ids)
|
|
|
+ }).then(() => {
|
|
|
+ userTableRef.value.resetForm();
|
|
|
+ }).catch(() => { });
|
|
|
+}
|
|
|
+const submitForm = () => {
|
|
|
+ console.log('submit', files.value);
|
|
|
+ const parmas = JSON.parse(JSON.stringify(files.value))
|
|
|
+ add({picture: parmas }).then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ proxy.$modal.msgSuccess("新增成功");
|
|
|
+ cancel()
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ proxy.$modal.msgSuccess(res.msg);
|
|
|
+ })
|
|
|
+}
|
|
|
+const cancel = () => {
|
|
|
+ userTableRef.value.resetForm();
|
|
|
+ files.value ='';
|
|
|
+ open.value = false;
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang='scss' scoped></style>
|