fix: 修改第二版

This commit is contained in:
lwh 2023-05-13 17:16:49 +08:00
parent 0b2974d90e
commit 71b2463d9f
7 changed files with 405 additions and 26 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

View File

@ -0,0 +1,147 @@
<template>
<el-dialog v-model="dialogVisible" title="添加首页作品" width="900px" @closed="closeDialog" @open="openDialog">
<el-form ref="formRef" :model="formData" :rules="rules">
<el-row>
<el-col :span="24">
<el-form-item label="作者类型" prop="home_works_author_type">
<el-select v-model="formData.home_works_author_type" clearable placeholder="请选择">
<el-option v-for="item in works_author_type" :key="item.dictionary_guid" :label="item.dictionary_name"
:value="item.dictionary_value"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span='12'>
<el-form-item :label-width='labelWidth' label='图片' prop='home_works_img'>
<UploadImage ref='uploadRef' v-model='formData.home_works_img' :data=uoloadData :limit='100' :fileSize='5'
:drag='true' :isShowTip='false' />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label-width="labelWidth" label="介绍" prop="home_works_intro">
<el-input v-model='formData.home_works_intro' type="textarea" :rows="5" placeholder='请输入介绍'></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button type="primary" @click="handleAddClick(formRef)">添加</el-button>
<el-button @click="handleResetClick(formRef)">重置</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
import { reactive, ref, watch } from "vue";
import { batchAddHomeWorks, getDictionary } from "~/service/home_works";
import { useLoginStore } from "~/store";
// --
// --
//
const works_author_type = ref([]);
async function get_works_author_type() {
await getDictionary({ dictionary_value: 'works_author_type' }).then((res) => {
works_author_type.value = res
})
}
// --
const store = useLoginStore();
const headers = {
Accept: "application/json",
...store.headers,
};
const isBtnLod = ref(false);
const formRef = ref();
const labelWidth = 90;
const props = defineProps({
modelValue: Boolean,
done: Function,
});
const emits = defineEmits(["update:modelValue"]);
const dialogVisible = ref(props.modelValue);
const formData = reactive({
// home_works_sort: 1
});
const uoloadData = ref({
dirName: "HomeWorks"
})
watch(props, (v) => {
dialogVisible.value = v.modelValue;
});
const rules = reactive({
home_works_author_type: [
{
required: true,
message: '作者类型不能为空'
}
],
home_works_img: [
{
required: true,
message: '图片不能为空'
}
],
});
// --
//
const openDialog = () => {
get_works_author_type()
};
const closeDialog = () => {
handleResetClick(formRef.value);
dialogVisible.value = false;
emits("update:modelValue", false);
};
const handleAddClick = async (formEl) => {
if (!formEl) return;
formEl.validate(async (valid) => {
if (!valid) {
return;
}
isBtnLod.value = true;
const { code } = await batchAddHomeWorks(formData);
if (code == 0) {
closeDialog();
props.done();
}
isBtnLod.value = flase;
});
};
const handleResetClick = async (formEl) => {
if (!formEl) return;
formEl.resetFields();
};
</script>
<style lang="less" scoped></style>

View File

@ -25,7 +25,10 @@
<el-col :span="1">
<el-button type="primary" @click="addHomeWorksDialogVisible = true"> 添加 </el-button>
</el-col>
<!-- 批量添加首页作品 -->
<el-col :span="1">
<el-button type="primary" @click="uploadHomeWorksDialogVisible = true"> 批量添加 </el-button>
</el-col>
<!-- 导出 -->
<el-button icon="ElIconDocument" @click="exportExcel(params)">导出</el-button>
@ -95,6 +98,8 @@
<!-- 添加首页作品 -->
<AddHomeWorksDialog v-model="addHomeWorksDialogVisible" :done="() => tableRef.reload()"></AddHomeWorksDialog>
<!-- 批量添加首页作品 -->
<UploadHomeWorksDialog v-model="uploadHomeWorksDialogVisible" :done="() => tableRef.reload()"></UploadHomeWorksDialog>
<!-- 编辑首页作品 -->
<EditHomeWorksDialog v-model="EditHomeWorksDialogVisible" :data="EditHomeWorksDialogRow"
:done="() => tableRef.reload()"></EditHomeWorksDialog>
@ -105,8 +110,9 @@
import { ArrowDown } from '@element-plus/icons-vue';
import { ref, reactive, watch } from 'vue';
import { useLoginStore } from "~/store";
import { getHomeWorksList, editHomeWorks , deleteHomeWorks, getDictionary, exportExcel } from '~/service/home_works';
import { getHomeWorksList, editHomeWorks, deleteHomeWorks, getDictionary, exportExcel } from '~/service/home_works';
import AddHomeWorksDialog from './components/AddHomeWorksDialog.vue';
import UploadHomeWorksDialog from './components/UploadHomeWorksDialog.vue';
import EditHomeWorksDialog from './components/EditHomeWorksDialog.vue';
import DetailHomeWorksDialog from './components/DetailHomeWorksDialog.vue';
@ -115,6 +121,7 @@ const selectionData = ref([]);
const store = useLoginStore();
const addHomeWorksDialogVisible = ref(false);
const uploadHomeWorksDialogVisible = ref(false);
const EditHomeWorksDialogVisible = ref(false);
const EditHomeWorksDialogRow = ref({});
const DetailHomeWorksDialogVisible = ref(false);

View File

@ -0,0 +1,188 @@
<template>
<el-dialog v-model="dialogVisible" title="批量添加作品" width="900px" @closed="closeDialog" @open="openDialog">
<el-form ref="formRef" :model="formData" :rules="rules">
<el-row>
<el-col :span="12">
<el-form-item :label-width="labelWidth" label="作品类型" prop="works_type_guid">
<el-cascader class="w100" filterable :options="dataList"
:props="{ checkStrictly: true, value: 'works_type_guid', label: 'works_type_name', emitPath: false }"
placeholder="请选择作品类型" clearable v-model="formData.works_type_guid">
<template #default="{ node, data }">
<span>{{ data.works_type_name }}</span>
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
</template>
</el-cascader>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item :label-width="labelWidth" label="作者类型" prop="works_author_type">
<el-select v-model="formData.works_author_type" clearable placeholder="请选择">
<el-option v-for="item in works_author_type" :key="item.dictionary_guid" :label="item.dictionary_name"
:value="item.dictionary_value"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span='24'>
<el-form-item :label-width='labelWidth' label='作品图片' prop='works_img'>
<UploadImage ref='uploadRef' v-model='formData.works_img' :data=uoloadData :limit='100' :fileSize='5'
:drag='true' :isShowTip='false' />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col>
<el-form-item :label-width="labelWidth" label="介绍" prop="works_intro">
<el-input rows="5" v-model='formData.works_intro' type="textarea" placeholder='请输入作品介绍'></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button type="primary" @click="handleAddClick(formRef)" :loading="isBtnLod">添加</el-button>
<el-button @click="handleResetClick(formRef)">重置</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
import { reactive, ref, watch } from "vue";
import { batchAddWorks } from "~/service/works";
import { getWorksTypeList, getDictionary } from "~/service/works_type"
import { useLoginStore } from "~/store";
// --
// --
//
const dataList = ref();
async function getList() {
getWorksTypeList({ limit: 10000 }).then((res) => {
if (res.code == 0) {
dataList.value = res.data
}
})
}
//
const works_author_type = ref([]);
async function get_works_author_type() {
await getDictionary({ dictionary_value: 'works_author_type' }).then((res) => {
works_author_type.value = res
})
}
// --
const store = useLoginStore();
const headers = {
Accept: "application/json",
...store.headers,
};
const formRef = ref();
const labelWidth = 90;
const props = defineProps({
modelValue: Boolean,
done: Function,
});
const emits = defineEmits(["update:modelValue"]);
const dialogVisible = ref(props.modelValue);
const formData = reactive({
works_likes_count: 0
});
const uoloadData = ref({
dirName: "Works"
})
watch(props, (v) => {
dialogVisible.value = v.modelValue;
});
const rules = reactive({
works_img: [
{
required: true,
message: '作品图片不能为空'
}
],
// works_intro: [
// {
// required: true,
// message: ''
// }
// ],
works_type_guid: [
{
required: true,
message: '作品类型'
}
],
works_likes_count: [
{
required: true,
message: '作品点赞数不能为空'
}
],
works_author_type: [
{
required: true,
message: '作者类型不能为空'
}
]
});
// --
//
const openDialog = () => {
getList()
get_works_author_type()
};
const closeDialog = () => {
handleResetClick(formRef.value);
dialogVisible.value = false;
emits("update:modelValue", false);
};
const isBtnLod = ref(false);
const handleAddClick = async (formEl) => {
if (!formEl) return;
formEl.validate(async (valid) => {
if (!valid) {
return;
}
isBtnLod.value = true;
const { code, msg } = await batchAddWorks(formData);
if (code == 0) {
closeDialog();
props.done();
ElMessage.success(msg);
} else {
ElMessage.error(msg);
}
isBtnLod.value = false;
});
};
const handleResetClick = async (formEl) => {
if (!formEl) return;
formEl.resetFields();
};
</script>
<style lang="less" scoped></style>

View File

@ -36,16 +36,21 @@
<el-col :span="1">
<el-button type="primary" @click="addWorksDialogVisible = true"> 添加 </el-button>
</el-col>
<!-- 批量添加首页环境 -->
<el-col :span="1">
<el-button type="primary" @click="uploadWorksDialogVisible = true"> 批量添加 </el-button>
</el-col>
<!-- 导出 -->
<el-button icon="ElIconDocument"
@click="exportExcel({ works_guids: selectionData.map(v => v.works_guid).join() })">导出</el-button>
<!-- 导入 -->
<el-upload class="upload-demo" :action="importExcel" :headers="headers" :on-success="handleExcelSuccess"
<!-- <el-upload class="upload-demo" :action="importExcel" :headers="headers" :on-success="handleExcelSuccess"
:on-progress="uploadLoading" :on-error="closeUploadLoading" :show-file-list="false">
<el-button type="primary">导入</el-button>
</el-upload>
</el-upload> -->
<!-- 下载导入模板 -->
<el-button icon="ElIconDownload" @click="downloadTemplate()">下载导入模板</el-button>
<!-- <el-button icon="ElIconDownload" @click="downloadTemplate()">下载导入模板</el-button> -->
<!-- 下拉操作 -->
<el-dropdown v-if="selectionData.length">
<el-button type="primary">
@ -115,6 +120,8 @@
<!-- 添加作品 -->
<AddWorksDialog v-model="addWorksDialogVisible" :done="() => tableRef.reload()"></AddWorksDialog>
<!-- 批量添加作品 -->
<UploadsWorksDialog v-model="uploadWorksDialogVisible" :done="() => tableRef.reload()"></UploadsWorksDialog>
<!-- 编辑作品 -->
<EditWorksDialog v-model="EditWorksDialogVisible" :data="EditWorksDialogRow" :done="() => tableRef.reload()">
</EditWorksDialog>
@ -126,8 +133,9 @@ import { ArrowDown } from '@element-plus/icons-vue';
import { ref, reactive, watch } from 'vue';
import { useLoginStore } from "~/store";
import { getWorksList, deleteWorks, downloadTemplate, importExcel, exportExcel, editWorks } from '~/service/works';
import { getWorksTypeList,getDictionary } from "~/service/works_type";
import { getWorksTypeList, getDictionary } from "~/service/works_type";
import AddWorksDialog from './components/AddWorksDialog.vue';
import UploadsWorksDialog from './components/UploadsWorksDialog.vue';
import EditWorksDialog from './components/EditWorksDialog.vue';
import DetailWorksDialog from './components/DetailWorksDialog.vue';
import createDraw from 'hyw-drag'
@ -137,6 +145,7 @@ const selectionData = ref([]);
const store = useLoginStore();
const addWorksDialogVisible = ref(false);
const uploadWorksDialogVisible = ref(false);
const EditWorksDialogVisible = ref(false);
const EditWorksDialogRow = ref({});
const DetailWorksDialogVisible = ref(false);

View File

@ -1,14 +1,14 @@
import { api, downloadFile, createApiUrl} from '~/utils/axios';
import { api, downloadFile, createApiUrl } from '~/utils/axios';
/**
* 导出首页作品
* @param {Object} data
* @return {Promise} api
*/
export function exportExcel(data) {
/**
* 导出首页作品
* @param {Object} data
* @return {Promise} api
*/
export function exportExcel(data) {
downloadFile(createApiUrl('Home.HomeWorks/exportExcel'), data);
}
}
@ -16,15 +16,15 @@ import { api, downloadFile, createApiUrl} from '~/utils/axios';
/**
/**
* 获取字典值
* @param {Object} data
* @return {Promise} api
*/
export function getDictionary(data) {
export function getDictionary(data) {
return api.post('Dictionary.Dictionary/getDictionary', data, {
});
}
}
/**
@ -61,6 +61,20 @@ export function addHomeWorks(data) {
errorMessageText: '添加失败'
});
}
/**
* 添加首页作品
* @param {Object} data
* @return {Promise} api
*/
export function batchAddHomeWorks(data) {
return api.post('Home.HomeWorks/batchAddHomeWorks', data, {
isTransformResponse: true,
isShowSuccessMessage: true,
errorMessageText: '添加失败'
});
}
/**
* 编辑首页作品
* @param {Object} data

View File

@ -64,6 +64,20 @@ export function addWorks(data) {
errorMessageText: '添加失败'
});
}
/**
* 批量添加作品
* @param {Object} data
* @return {Promise} api
*/
export function batchAddWorks(data) {
return api.post('Works.Works/batchAddWorks', data, {
// isTransformResponse: true,
// isShowSuccessMessage: true,
errorMessageText: '添加失败'
});
}
/**
* 编辑作品
* @param {Object} data