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_USER_MODEL2=AdminUser
VUE_APP_USER_MODEL=BaseAdmin
VUE_APP_USER_MODEL=AdminUser
VUE_APP_USER_MODEL2=BaseAdmin

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

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

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

@ -52,7 +52,7 @@ VXETable.formats.mixin({
},
formatDateTime({ cellValue }) {
return XEUtils.toDateString(cellValue, 'yyyy-MM-dd HH:ss:mm')
},
},
formatDate({ cellValue }) {
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
};
module.exports = config

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

@ -22,11 +22,8 @@
</template>
<template #logo="{}">
<div class="imagePanel">
<img :src="formOptions.data.logo || uploadDefaultImg" @click.stop="selectFile()">
</div>
<img :src="formOptions.data.logo || uploadDefaultImg" @click.stop="selectFile()">
</div>
</template>
</vxe-form>
@ -85,7 +82,7 @@ export default {
config_list: [],
currentBeid: 0,
uploadDefaultImg: "http://zjdaomiimgtest.oss-cn-hangzhou.aliyuncs.com/2022/16709016422295584.png",
uploadDefaultImg: null,
actions: {
create: `${BASE_URL.BASE_URL}/BaseCompany/v1/create`,
@ -235,6 +232,8 @@ export default {
},
created() {
this.uploadDefaultImg = this.$mk.config.uploadDefaultImg;
let dataId = this.getDataId();
if (dataId) {
@ -475,11 +474,11 @@ export default {
.imagePanel {
cursor: pointer;
padding: 10px;
width: 80px;
width: 100px;
img {
width: 60px;
height: 60px;
width: 80px;
height: 80px;
}
}
</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>
</div>
</template>
<template #logo="{ row }">
<img v-if="row.logo" :src="row.logo" style="width: 100px;"/>
<span v-else>无</span>
</template>
</vxe-grid>
</div>
@ -137,7 +142,7 @@ export default {
columns: [
{ type: 'checkbox', 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: 'auth_stop_date', width: 120, sortable: true, title: '授权截止日期', 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">
<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>
@ -34,6 +39,7 @@
<a-button @click="cancel">取消</a-button>
</div>
<input type="file" ref="imageInput" @change="upload()" style="display:none;">
</div>
</page-layout>
</template>
@ -76,6 +82,7 @@ export default {
serviceClose: `${BASE_URL.BASE_URL}/BaseConfig/v1/service/close`
},
uploadDefaultImg: null,
keyName: 'id',
isEdit: false,
formOptions: {
@ -95,7 +102,9 @@ export default {
"sub_title": "",
"en_sub_title": "",
"copy_right": "",
"en_copy_right": ""
"en_copy_right": "",
"slogan": "",
"en_slogan": ""
},
titleWidth: 100,
@ -114,14 +123,26 @@ export default {
{
title: '左侧',
children: [
{ field: 'title', title: '项目名称', span: 16, itemRender: { name: '$input', props: { placeholder: '请输入项目名' } } },
{ field: 'desc', title: '项目描述', span: 16, itemRender: { name: '$textarea', props: { placeholder: '请输入描述' } } },
{ field: 'logo', title: 'Logo', span: 20, itemRender: { name: '$input', props: { placeholder: '请输入LOGO' } } },
{ field: 'domain', title: '网址域名', span: 10, itemRender: { name: '$input' } },
{ field: 'devdomain', title: '开发域名', span: 10, itemRender: { name: '$input' } },
{ field: 'appid', title: 'AppID', span: 20, itemRender: { name: '$textarea' } },
{ field: 'appsecret', title: 'AppSecret', span: 20, itemRender: { name: '$textarea' } },
{ field: 'token', title: '项目Token', span: 20, itemRender: { name: '$textarea' } }
{ field: 'title', title: '项目名称', span: 12, itemRender: { name: '$input', props: { placeholder: '请输入项目名' } } },
{ field: 'en_title', title: '项目名称(英文)', span: 12, itemRender: { name: '$input', props: { placeholder: '请输入项目名' } } },
{ field: 'sub_title', title: '副标题', span: 12, itemRender: { name: '$input', props: { placeholder: '请输入副标题' } } },
{ field: 'en_sub_title', title: '副标题(英文)', span: 12, itemRender: { name: '$input', props: { placeholder: '请输入副标题' } } },
{ field: 'copy_right', title: '版权', span: 12, itemRender: { name: '$input', props: { placeholder: '请输入版权' } } },
{ field: 'en_copy_right', title: '版权(英文)', span: 12, itemRender: { name: '$input', props: { placeholder: '请输入版权' } } },
{ 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() {
this.uploadDefaultImg = this.$mk.config.uploadDefaultImg;
let dataId = this.getDataId();
if (dataId) {
this.$mk.post({
@ -206,7 +228,15 @@ export default {
// 函数
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) {
row.status = row.status ? 0 : 1;
this.$mk.post({
@ -327,7 +357,7 @@ export default {
height: 870,
dataId: 0,
callback: ({ data }) => {
if(!data || !data.length){
if (!data || !data.length) {
return;
}
let ids = [];
@ -364,7 +394,7 @@ export default {
</script>
<style scoped lang="less">
.page-body {
padding: 30px ;
padding: 30px;
background: @base-bg-color;
}
@ -380,4 +410,14 @@ export default {
.footerbar {
padding-left: 10px;
}
.imagePanel {
cursor: pointer;
padding: 10px;
width: 100px;
img {
width: 80px;
height: 80px;
}
}
</style>

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

@ -30,16 +30,21 @@
<!-- 表格区 -->
<div class="gridPanel">
<vxe-grid ref='xGrid' v-bind="gridOptions">
<template #status="{ row }">
<a-switch :checked="row.status ? true : false" @change="onSwitch(row, 'status')" />
</template>
<template #op="{ row }">
<div class="oplinks">
<template #status="{ row }">
<a-switch :checked="row.status ? true : false" @change="onSwitch(row, 'status')" />
</template>
<template #op="{ row }">
<div class="oplinks">
<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>
</template>
</vxe-grid>
</template>
<template #logo="{ row }">
<img v-if="row.logo" :src="row.logo" style="width: 100px;"/>
<span v-else>无</span>
</template>
</vxe-grid>
</div>
@ -48,7 +53,7 @@
<script>
import BASE_URL from '@/services/base/api.js';
export default {
name: 'BaseConfigList',
i18n: require('./i18n'),
@ -92,8 +97,12 @@ export default {
{ field: 'title', title: '标题', span: 5, itemRender: { name: '$input', props: { placeholder: '请输入标题' } } },
{ field: 'desc', title: '描述', span: 5, itemRender: { name: '$input', props: { placeholder: '请输入描述' } } },
{ 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: 'seq', width: 50 },
{ 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: 'token', sortable: true, title: 'token', 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: {
onDateChange(date) {
if (date && date.length) {
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 });
},
//add / log / setting
//add / log / setting
toolbarClick(e) {
if (e.name == "add") {
this.$openPage("/BaseConfig/BaseConfigAdd");
}
this.$openPage("/BaseConfig/BaseConfigAdd");
}
},
pageEdit(row) {
if (!row) {
this.$mk.msg("请选择行");
return;
@ -245,36 +254,36 @@ export default {
let rows = row ? [row] : this.$refs.xGrid.getCheckboxRecords();
let ids = [];
rows.forEach((row) => {
ids.push(row[this.keyName]);
let ids = [];
rows.forEach((row) => {
ids.push(row[this.keyName]);
});
});
if (!ids.length) {
this.$mk.error("请选择行");
return;
if (!ids.length) {
this.$mk.error("请选择行");
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() {
this.$refs.xGrid.commitProxy('query')
@ -289,19 +298,20 @@ export default {
</script>
<style scoped lang="less">
.page-body {
padding: 30px ;
padding: 30px;
background: @base-bg-color;
}
.gridPanel{
height: calc(100vh - 400px);
.gridPanel {
height: calc(100vh - 400px);
}
</style>
<style>
.oplinks svg {
width: 22px;
height:22px;
margin: 0 5px 0 0;
.oplinks svg {
width: 22px;
height: 22px;
margin: 0 5px 0 0;
}
</style>