Mes
/
middle-admin-ant
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

项目编辑、上传图片

This commit is contained in:
xielue 2022-12-14 16:59:07 +08:00
parent f7399f0c6a
commit 18f82ac984
8 changed files with 134 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.env.development
View File

@ -1,4 +1,4 @@
VUE_APP_API_BASE_URL=http://192.168.31.166:46000 VUE_APP_API_BASE_URL=http://192.168.31.166:46000
VUE_APP_USER_MODEL2=AdminUser VUE_APP_USER_MODEL=AdminUser
VUE_APP_USER_MODEL=BaseAdmin VUE_APP_USER_MODEL2=BaseAdmin

3
src/application/mk/config/index.js
View File

@ -3,6 +3,9 @@
export default { export default {
uploadDefaultImg: "http://zjdaomiimgtest.oss-cn-hangzhou.aliyuncs.com/2022/16709016422295584.png",
defaults: { defaults: {
gridOptions: { gridOptions: {

2
src/application/mk/index.js
View File

@ -52,7 +52,7 @@ VXETable.formats.mixin({
}, },
formatDateTime({ cellValue }) { formatDateTime({ cellValue }) {
return XEUtils.toDateString(cellValue, 'yyyy-MM-dd HH:ss:mm') return XEUtils.toDateString(cellValue, 'yyyy-MM-dd HH:ss:mm')
}, },
formatDate({ cellValue }) { formatDate({ cellValue }) {
return XEUtils.toDateString(cellValue, 'yyyy-MM-dd') return XEUtils.toDateString(cellValue, 'yyyy-MM-dd')
}, },

2
src/application/mk/libs/uploader/config.js
View File

@ -7,4 +7,4 @@ var config = {
maxSize: 128 * 1024 * 1024 //上传文件的大小限制,128mb maxSize: 128 * 1024 * 1024 //上传文件的大小限制,128mb
}; };
module.exports = config module.exports = config

17
src/pages/Middle/Base/BaseCompany/edit.vue
View File

@ -22,11 +22,8 @@
</template> </template>
<template #logo="{}"> <template #logo="{}">
<div class="imagePanel"> <div class="imagePanel">
<img :src="formOptions.data.logo || uploadDefaultImg" @click.stop="selectFile()"> <img :src="formOptions.data.logo || uploadDefaultImg" @click.stop="selectFile()">
</div>
</div>
</template> </template>
</vxe-form> </vxe-form>
@ -85,7 +82,7 @@ export default {
config_list: [], config_list: [],
currentBeid: 0, currentBeid: 0,
uploadDefaultImg: "http://zjdaomiimgtest.oss-cn-hangzhou.aliyuncs.com/2022/16709016422295584.png", uploadDefaultImg: null,
actions: { actions: {
create: `${BASE_URL.BASE_URL}/BaseCompany/v1/create`, create: `${BASE_URL.BASE_URL}/BaseCompany/v1/create`,
@ -235,6 +232,8 @@ export default {
}, },
created() { created() {
this.uploadDefaultImg = this.$mk.config.uploadDefaultImg;
let dataId = this.getDataId(); let dataId = this.getDataId();
if (dataId) { if (dataId) {
@ -475,11 +474,11 @@ export default {
.imagePanel { .imagePanel {
cursor: pointer; cursor: pointer;
padding: 10px; padding: 10px;
width: 80px; width: 100px;
img { img {
width: 60px; width: 80px;
height: 60px; height: 80px;
} }
} }
</style> </style>

7
src/pages/Middle/Base/BaseCompany/list.vue
View File

@ -39,6 +39,11 @@
<a @click.stop="pageDelete(row)" title="删除"><a-icon type="delete" /></a> <a @click.stop="pageDelete(row)" title="删除"><a-icon type="delete" /></a>
</div> </div>
</template> </template>
<template #logo="{ row }">
<img v-if="row.logo" :src="row.logo" style="width: 100px;"/>
<span v-else>无</span>
</template>
</vxe-grid> </vxe-grid>
</div> </div>
@ -137,7 +142,7 @@ export default {
columns: [ columns: [
{ type: 'checkbox', width: 50 }, { type: 'checkbox', width: 50 },
{ type: 'seq', width: 50 }, { type: 'seq', width: 50 },
{ field: 'logo', width: 120, sortable: true, title: '公司Logo', showHeaderOverflow: true }, { slots: { default: 'logo' }, width: 120, sortable: true, title: '公司Logo', showHeaderOverflow: true },
{ field: 'title', sortable: true, title: '公司名称' ,width:250}, { field: 'title', sortable: true, title: '公司名称' ,width:250},
{ field: 'auth_stop_date', width: 120, sortable: true, title: '授权截止日期', showHeaderOverflow: true }, { field: 'auth_stop_date', width: 120, sortable: true, title: '授权截止日期', showHeaderOverflow: true },
{ field: 'token', width: 120, sortable: true, title: 'token', showHeaderOverflow: true }, { field: 'token', width: 120, sortable: true, title: 'token', showHeaderOverflow: true },

66
src/pages/Middle/Base/BaseConfig/edit.vue
View File

@ -3,7 +3,12 @@
<div class="page-body"> <div class="page-body">
<vxe-form :data="formOptions.data" ref="xForm" :title-width="formOptions.titleWidth" <vxe-form :data="formOptions.data" ref="xForm" :title-width="formOptions.titleWidth"
:title-align="formOptions.titleAlign" :rules="formOptions.rules" :items="formOptions.items" titleColon> :title-align="formOptions.titleAlign" :rules="formOptions.rules" :items="formOptions.items" titleColon>
<template #logo="{}">
<div class="imagePanel">
<img :src="formOptions.data.logo || uploadDefaultImg" @click.stop="selectFile()">
</div>
</template>
</vxe-form> </vxe-form>
@ -34,6 +39,7 @@
<a-button @click="cancel">取消</a-button> <a-button @click="cancel">取消</a-button>
</div> </div>
<input type="file" ref="imageInput" @change="upload()" style="display:none;">
</div> </div>
</page-layout> </page-layout>
</template> </template>
@ -76,6 +82,7 @@ export default {
serviceClose: `${BASE_URL.BASE_URL}/BaseConfig/v1/service/close` serviceClose: `${BASE_URL.BASE_URL}/BaseConfig/v1/service/close`
}, },
uploadDefaultImg: null,
keyName: 'id', keyName: 'id',
isEdit: false, isEdit: false,
formOptions: { formOptions: {
@ -95,7 +102,9 @@ export default {
"sub_title": "", "sub_title": "",
"en_sub_title": "", "en_sub_title": "",
"copy_right": "", "copy_right": "",
"en_copy_right": "" "en_copy_right": "",
"slogan": "",
"en_slogan": ""
}, },
titleWidth: 100, titleWidth: 100,
@ -114,14 +123,26 @@ export default {
{ {
title: '左侧', title: '左侧',
children: [ children: [
{ field: 'title', title: '项目名称', span: 16, itemRender: { name: '$input', props: { placeholder: '请输入项目名' } } }, { field: 'title', title: '项目名称', span: 12, itemRender: { name: '$input', props: { placeholder: '请输入项目名' } } },
{ field: 'desc', title: '项目描述', span: 16, itemRender: { name: '$textarea', props: { placeholder: '请输入描述' } } }, { field: 'en_title', title: '项目名称(英文)', span: 12, itemRender: { name: '$input', props: { placeholder: '请输入项目名' } } },
{ field: 'logo', title: 'Logo', span: 20, itemRender: { name: '$input', props: { placeholder: '请输入LOGO' } } }, { field: 'sub_title', title: '副标题', span: 12, itemRender: { name: '$input', props: { placeholder: '请输入副标题' } } },
{ field: 'domain', title: '网址域名', span: 10, itemRender: { name: '$input' } }, { field: 'en_sub_title', title: '副标题(英文)', span: 12, itemRender: { name: '$input', props: { placeholder: '请输入副标题' } } },
{ field: 'devdomain', title: '开发域名', span: 10, itemRender: { name: '$input' } },
{ field: 'appid', title: 'AppID', span: 20, itemRender: { name: '$textarea' } }, { field: 'copy_right', title: '版权', span: 12, itemRender: { name: '$input', props: { placeholder: '请输入版权' } } },
{ field: 'appsecret', title: 'AppSecret', span: 20, itemRender: { name: '$textarea' } }, { field: 'en_copy_right', title: '版权(英文)', span: 12, itemRender: { name: '$input', props: { placeholder: '请输入版权' } } },
{ field: 'token', title: '项目Token', span: 20, itemRender: { name: '$textarea' } } { field: 'slogan', title: '标语', span: 12, itemRender: { name: '$input', props: { placeholder: '请输入标语' } } },
{ field: 'en_slogan', title: '标语(英文)', span: 12, itemRender: { name: '$input', props: { placeholder: '请输入标语' } } },
{ field: 'desc', title: '项目描述', span: 24, itemRender: { name: '$textarea', props: { placeholder: '请输入描述' } } },
{ field: 'en_desc', title: '项目描述(英文)', span: 24, itemRender: { name: '$textarea', props: { placeholder: '请输入描述' } } },
{ field: 'logo', title: 'Logo', slots: { default: 'logo' }, span: 24 },
{ field: 'domain', title: '网址域名', span: 12, itemRender: { name: '$input' } },
{ field: 'devdomain', title: '开发域名', span: 12, itemRender: { name: '$input' } },
{ field: 'appid', title: 'AppID', span: 24, itemRender: { name: '$input' } },
{ field: 'appsecret', title: 'AppSecret', span: 24, itemRender: { name: '$textarea' } },
{ field: 'token', title: '项目Token', span: 24, itemRender: { name: '$textarea' } }
] ]
} }
] ]
@ -185,6 +206,7 @@ export default {
}, },
created() { created() {
this.uploadDefaultImg = this.$mk.config.uploadDefaultImg;
let dataId = this.getDataId(); let dataId = this.getDataId();
if (dataId) { if (dataId) {
this.$mk.post({ this.$mk.post({
@ -206,7 +228,15 @@ export default {
// 函数 // 函数
methods: { methods: {
selectFile() {
this.$refs.imageInput.click();
},
upload() {
const imgFile = this.$refs.imageInput.files[0]
this.$mk.uploadFile(imgFile, 'png', (url) => {
this.formOptions.data.logo = url;
});
},
onSwitch(row) { onSwitch(row) {
row.status = row.status ? 0 : 1; row.status = row.status ? 0 : 1;
this.$mk.post({ this.$mk.post({
@ -327,7 +357,7 @@ export default {
height: 870, height: 870,
dataId: 0, dataId: 0,
callback: ({ data }) => { callback: ({ data }) => {
if(!data || !data.length){ if (!data || !data.length) {
return; return;
} }
let ids = []; let ids = [];
@ -364,7 +394,7 @@ export default {
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
.page-body { .page-body {
padding: 30px ; padding: 30px;
background: @base-bg-color; background: @base-bg-color;
} }
@ -380,4 +410,14 @@ export default {
.footerbar { .footerbar {
padding-left: 10px; padding-left: 10px;
} }
.imagePanel {
cursor: pointer;
padding: 10px;
width: 100px;
img {
width: 80px;
height: 80px;
}
}
</style> </style>

110
src/pages/Middle/Base/BaseConfig/list.vue
View File

@ -30,16 +30,21 @@
<!-- 表格区 --> <!-- 表格区 -->
<div class="gridPanel"> <div class="gridPanel">
<vxe-grid ref='xGrid' v-bind="gridOptions"> <vxe-grid ref='xGrid' v-bind="gridOptions">
<template #status="{ row }"> <template #status="{ row }">
<a-switch :checked="row.status ? true : false" @change="onSwitch(row, 'status')" /> <a-switch :checked="row.status ? true : false" @change="onSwitch(row, 'status')" />
</template> </template>
<template #op="{ row }"> <template #op="{ row }">
<div class="oplinks"> <div class="oplinks">
<a @click.stop="pageEdit(row)" title="编辑"><a-icon type="edit" /></a> <a @click.stop="pageEdit(row)" title="编辑"><a-icon type="edit" /></a>
<a @click.stop="pageDelete(row)" title="删除"><a-icon type="delete" /></a> <a @click.stop="pageDelete(row)" title="删除"><a-icon type="delete" /></a>
</div> </div>
</template> </template>
</vxe-grid>
<template #logo="{ row }">
<img v-if="row.logo" :src="row.logo" style="width: 100px;"/>
<span v-else>无</span>
</template>
</vxe-grid>
</div> </div>
@ -48,7 +53,7 @@
<script> <script>
import BASE_URL from '@/services/base/api.js'; import BASE_URL from '@/services/base/api.js';
export default { export default {
name: 'BaseConfigList', name: 'BaseConfigList',
i18n: require('./i18n'), i18n: require('./i18n'),
@ -92,8 +97,12 @@ export default {
{ field: 'title', title: '标题', span: 5, itemRender: { name: '$input', props: { placeholder: '请输入标题' } } }, { field: 'title', title: '标题', span: 5, itemRender: { name: '$input', props: { placeholder: '请输入标题' } } },
{ field: 'desc', title: '描述', span: 5, itemRender: { name: '$input', props: { placeholder: '请输入描述' } } }, { field: 'desc', title: '描述', span: 5, itemRender: { name: '$input', props: { placeholder: '请输入描述' } } },
{ span: 8, slots: { default: 'date' } }, { span: 8, slots: { default: 'date' } },
{ align: 'right', span: 4, itemRender: { name: '$buttons', children: [{ props: { type: 'submit', content: '搜索', status: 'primary' } }, {
{ props: { type: 'reset', content: '重置' } }] } } align: 'right', span: 4, itemRender: {
name: '$buttons', children: [{ props: { type: 'submit', content: '搜索', status: 'primary' } },
{ props: { type: 'reset', content: '重置' } }]
}
}
] ]
} }
], ],
@ -138,11 +147,11 @@ export default {
{ type: 'checkbox', width: 50 }, { type: 'checkbox', width: 50 },
{ type: 'seq', width: 50 }, { type: 'seq', width: 50 },
{ field: 'title', sortable: true, title: '标题' }, { field: 'title', sortable: true, title: '标题' },
{ field: 'logo', sortable: true, title: 'Logo', showHeaderOverflow: true }, { slots: { default: 'logo' }, width: 120, sortable: true, title: '公司Logo', showHeaderOverflow: true },
{ field: 'domain', sortable: true, title: '网址域名', showHeaderOverflow: true }, { field: 'domain', sortable: true, title: '网址域名', showHeaderOverflow: true },
{ field: 'token', sortable: true, title: 'token', showHeaderOverflow: true }, { field: 'token', sortable: true, title: 'token', showHeaderOverflow: true },
{ field: 'desc', sortable: true, title: '描述', showHeaderOverflow: true }, { field: 'desc', sortable: true, title: '描述', showHeaderOverflow: true },
{ title: '操作', slots: { default: 'op' },width:120 } { title: '操作', slots: { default: 'op' }, width: 120 }
] ]
} }
}; };
@ -168,7 +177,7 @@ export default {
// 函数 // 函数
methods: { methods: {
onDateChange(date) { onDateChange(date) {
if (date && date.length) { if (date && date.length) {
this.start_time = parseInt(date[0]._d.getTime() / 1000); this.start_time = parseInt(date[0]._d.getTime() / 1000);
@ -221,16 +230,16 @@ export default {
return this.$mk.getPagedData({ url: this.actions.getList, data: params }); return this.$mk.getPagedData({ url: this.actions.getList, data: params });
}, },
//add / log / setting //add / log / setting
toolbarClick(e) { toolbarClick(e) {
if (e.name == "add") { if (e.name == "add") {
this.$openPage("/BaseConfig/BaseConfigAdd"); this.$openPage("/BaseConfig/BaseConfigAdd");
} }
}, },
pageEdit(row) { pageEdit(row) {
if (!row) { if (!row) {
this.$mk.msg("请选择行"); this.$mk.msg("请选择行");
return; return;
@ -245,36 +254,36 @@ export default {
let rows = row ? [row] : this.$refs.xGrid.getCheckboxRecords(); let rows = row ? [row] : this.$refs.xGrid.getCheckboxRecords();
let ids = []; let ids = [];
rows.forEach((row) => { rows.forEach((row) => {
ids.push(row[this.keyName]); ids.push(row[this.keyName]);
}); });
if (!ids.length) { if (!ids.length) {
this.$mk.error("请选择行"); this.$mk.error("请选择行");
return; return;
}
this.$mk.confirm('您确定要删除吗？').then(type => {
if (type == 'confirm') {
this.$mk.post({
url: this.actions.delete,
loading: "删除中...",
data: {
ids: ids
}
}).then(() => {
this.$mk.success("删除成功");
this.onSearch();
}).catch((a) => {
this.$mk.error(a.data.msg);
});
} }
});
this.$mk.confirm('您确定要删除吗？').then(type => {
if (type == 'confirm') {
this.$mk.post({
url: this.actions.delete,
loading: "删除中...",
data: {
ids: ids
}
}).then(() => {
this.$mk.success("删除成功");
this.onSearch();
}).catch((a) => {
this.$mk.error(a.data.msg);
});
}
});
}, },
onSearch() { onSearch() {
this.$refs.xGrid.commitProxy('query') this.$refs.xGrid.commitProxy('query')
@ -289,19 +298,20 @@ export default {
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
.page-body { .page-body {
padding: 30px ; padding: 30px;
background: @base-bg-color; background: @base-bg-color;
} }
.gridPanel{
height: calc(100vh - 400px); .gridPanel {
height: calc(100vh - 400px);
} }
</style> </style>
<style> <style>
.oplinks svg { .oplinks svg {
width: 22px; width: 22px;
height:22px; height: 22px;
margin: 0 5px 0 0; margin: 0 5px 0 0;
} }
</style> </style>