hjq/mart-admin
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'main' of http://129.211.33.98:3210/hjq/mart-admin

Browse Source
This commit is contained in:
夕阳微笑1 2025-01-21 15:55:32 +08:00
commit 841945f77c
17 changed files with 1179 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/api/attachment/index.ts
View File

@ -9,6 +9,7 @@ import { baseUrlHost } from '../baseUrlHost';
* @method getAttachmentList 分页查询附件
* @method getAttachmentDetail 查看单个附件
* @method downloadFiles 批量文件下载
* @method uploadByType 公开附件上传
*/
export function attachmentApi() {
@ -32,6 +33,14 @@ export function attachmentApi() {
method: 'get',
responseType: 'blob',
})
},
uploadByType: (data: object) => {
return request({
url: baseUrlHost + '/enAttachment/uploadByType',
method: 'post',
data,
headers: { 'Content-Type': 'application/x-www-form-urlencoded'}
})
}
};
}

11
src/api/photos/index.ts
View File

@ -14,6 +14,7 @@ import { baseUrlHost } from '../baseUrlHost';
* @method updatePhotos 更新图片
* @method deletePhotos 删除图片
* @method uploadFile 上传图片
* @method uploadPictrue 公开图片上传，返回图片id
*/
export function photosApi() {
@ -70,6 +71,14 @@ export function photosApi() {
data,
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
})
}
},
uploadPictrue:(data: object) => {
return request({
url: baseUrlHost + '/cpPhoto/uploadPictrue',
method: 'post',
data,
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
})
},
};
}

23
src/api/service/recommend/index.ts
View File

@ -7,6 +7,9 @@ import { pixelUrlHost } from '/@/api/baseUrlHost';
*
* 登录api接口集合
* @method getRecommendList 获取推荐作品列表
* @method saveRecommend 保存推荐作品
* @method deleteRecommend 删除推荐作品
* @method updateRecommend 修改推荐作品
*/
export function recommendApi() {
@ -18,5 +21,25 @@ export function recommendApi() {
params,
});
},
saveRecommend: (data: object) => {
return request({
url: pixelUrlHost + '/paRecommend',
method: 'post',
data,
})
},
deleteRecommend: (id: Number) => {
return request({
url: pixelUrlHost + `/paRecommend/${id}`,
method: 'delete',
})
},
updateRecommend: (data: object) => {
return request({
url: pixelUrlHost + '/paRecommend',
method: 'put',
data,
})
},
};
}

52
src/api/service/wall/index.ts Normal file
View File

@ -0,0 +1,52 @@
import request from '/@/utils/request';
import { pixelUrlHost } from '/@/api/baseUrlHost';
/**
* （不建议写成 request.post(xxx)，因为这样 post 时，无法 params 与 data 同时传参）
* 注意在写get请求时，参数是params，而不是data，要标注好
*
* 登录api接口集合
* @method getWallList 获取作品墙列表
* @method saveWall 保存作品墙推荐作品
* @method deleteWall 删除作品墙推荐作品
* @method updateWall 修改作品墙推荐作品
* @method singleWall 获取作品墙作品详情
*/
export function recommendWallApi() {
return {
getWallList: (params: object) => {
return request({
url: pixelUrlHost + '/paPictureWall',
method: 'get',
params,
});
},
saveWall: (data: object) => {
return request({
url: pixelUrlHost + '/paPictureWall',
method: 'post',
data,
})
},
deleteWall: (id: Number) => {
return request({
url: pixelUrlHost + `/paPictureWall/${id}`,
method: 'delete',
})
},
updateWall: (data: object) => {
return request({
url: pixelUrlHost + '/paPictureWall',
method: 'put',
data,
})
},
singleWall: (id: Number) => {
return request({
url: pixelUrlHost + `/paPictureWall/${id}`,
method: 'get',
})
},
};
}

1
src/i18n/lang/en.ts
View File

@ -108,6 +108,7 @@ export default {
apply: 'apply',
shares: 'shares',
recommend: 'recommend',
recommendWall: 'recommendWall',
/**
* 业务模块end

1
src/i18n/lang/zh-cn.ts
View File

@ -111,6 +111,7 @@ export default {
apply: '应用管理',
shares: '发布管理',
recommend: '推荐管理',
recommendWall: '作品墙',
/**
* 业务模块end

1
src/i18n/lang/zh-tw.ts
View File

@ -108,6 +108,7 @@ export default {
apply: '應用管理',
shares: '發佈管理',
recommend: '推薦管理',
recommendWall: '作品墻',
/**
* 业务模块end

17
src/router/route.ts
View File

@ -306,6 +306,23 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
icon: 'ele-Upload',
},
},
// 推荐管理
{
path: '/recommendWall',
name: 'recommendWall',
component: () => import('/@/views/service/wall/index.vue'),
meta: {
title: 'message.router.recommendWall',
isLink: '',
isHide: false,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin', 'user'],
icon: 'ele-Upload',
},
},
/**
* 业务模块end

2
src/views/article/component/upload.vue
View File

@ -245,7 +245,7 @@ const articleFormRef = ref();
// 保存文章
const onSubmitForm = () => {
articleFormRef.value.validate((valid: boolean) => {
if (valid && state.coverHide){
if (valid){
const form = {...state.data,top:state.data.top ? 1 : 0};
if(state.coverFile.type === undefined){
realSubmit(form);

10
src/views/article/index.vue
View File

@ -74,7 +74,7 @@
</template>
<script setup lang="ts" name="article">
import { onMounted, reactive, ref } from 'vue';
import { onActivated, onMounted, reactive, ref } from 'vue';
import { articleApi } from '/@/api/article';
import { ElMessage, ElMessageBox, TableColumnCtx } from 'element-plus';
import { useRouter } from 'vue-router';
@ -190,7 +190,7 @@ const toEditArticle = (row: any) => {
const copyLink = (row: any) => {
if(row.id == null||row.id == ''){ ElMessage.warning('链接为空');return;}
var aux = document.createElement("input");
aux.setAttribute("value", `${viteUrl}vueAdmin/#article/content?id=${row.id}`);
aux.setAttribute("value", `${viteUrl}pixelAdmin/#article/content?id=${row.id}`);
document.body.appendChild(aux);
aux.select();
document.execCommand("copy");
@ -206,7 +206,7 @@ const toShowDetail = (row: any) => {
// 预览
const toPreview = (row: any) => {
window.open(`${viteUrl}vueAdmin/#article/content?id=${row.id}`);
window.open(`${viteUrl}pixelAdmin/#article/content?id=${row.id}`);
}
// 文章删除
@ -255,6 +255,10 @@ const onHandleCurrentChange = (val: number) => {
getTableData();
};
onActivated(() => {
getTableData();
})
onMounted(() => {
getTableData();
getModuleList();

2
src/views/photos/index.vue
View File

@ -328,7 +328,7 @@ const jpgFormatter = (row: any) => {
// } else {
// newPath = row.path.replaceAll('\\\\', '/')
// }
newPath = newPath.includes('://')?newPath : encodeURI(newPath);
newPath = newPath.includes('://')?newPath : newPath;
return `${newPath}`;
}

9
src/views/service/apply/dialog.vue
View File

@ -72,7 +72,7 @@
<el-col :xs="24" :sm="16" :md="16" :lg="16" :xl="16" class="mb20" v-if="state.data.options&&state.data.options.length>0">
<el-form-item label="选项：">
<div class="tags-option">
<el-tag v-for="option in state.data.options" :key="option.id" :disable-transitions="false">{{ option.optionName }}</el-tag>
<el-tag v-for="option in state.data.options" :title="option.optionName" :key="option.id" :disable-transitions="false">{{ option.optionName }}</el-tag>
</div>
</el-form-item>
</el-col>
@ -119,7 +119,7 @@ const state:any = reactive({
name: { required: true, message: '请输入应用名称', trigger: 'blur' },
api: { required: true, message: '请输入接口名', trigger: 'blur' },
tips: { required: true, message: '请输入提示词', trigger: 'blur' },
price: { required: true, message: '请输入价格', trigger: 'blur' },
// price: { required: true, message: '请输入价格', trigger: 'blur' },
position: { required: true, message: '请输入排序号', trigger: 'blur' },
type: { required: true, message: '请选择应用类型', trigger: 'blur' },
},
@ -320,5 +320,10 @@ defineExpose({
grid-template-columns: repeat(auto-fill, minmax(50px,100px) );
grid-gap: 0.4em 0.8em;
// grid-auto-flow: column dense;
::v-deep .el-tag__content{
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
}
</style>

23
src/views/service/apply/index.vue
View File

@ -129,8 +129,8 @@ const state: any = reactive({
id: 1,
children: [
{id: '-1',label: '全部',active: true,},
{id: '0',label: '上架',active: false,},
{id: '1',label: '下架',active: false,}
{id: '1',label: '上架',active: false,},
{id: '0',label: '下架',active: false,}
],
}
],
@ -154,9 +154,19 @@ const onSelItem = (val: FilteringRowType, v: FilteringChilType) => {
val.children.map((v: FilteringChilType) => (v.active = false));
v.active = true;
state.tableData.loading = true;
setTimeout(() => {
state.tableData.loading = false;
}, 500);
const isd = Number(v.id);
if(val.id === 0){
state.tableData.param.type = isd;
isd === -1 ? delete state.tableData.param.type : '' ;
}else{
state.tableData.param.publish = isd;
isd === -1 ? delete state.tableData.param.publish : '' ;
}
state.tableData.param.current = 1;
getTableData();
// setTimeout(() => {
// state.tableData.loading = false;
// }, 500);
};
// 当前列表项点击
const onTableItemClick = (v: FilterListType) => {
@ -311,7 +321,7 @@ onMounted(() => {
}
.card-item-left{
width: 80px;
width: 84px;
height: 80px;
img{
width: 100%;
@ -327,6 +337,7 @@ onMounted(() => {
overflow: hidden;
white-space: nowrap;
.cir-one{
line-height: 1.3em;
font-size: 1.3em;
font-weight: bold;
color: rgba($color: #000000, $alpha: 0.8);

328
src/views/service/recommend/index.vue
View File

@ -4,9 +4,9 @@
<div class="system-dept-search mb15">
<!-- 发布者：<el-input size="default" placeholder="请输入发布用户名称" v-model="state.tableData.param.userName"
class="ml10 mr10" style="max-width: 180px" clearable></el-input> -->
作品类型：<el-select size="default" v-model="state.tableData.param.serviceId" placeholder="请选择作品类型"
clearable class="ml10 mr10" style="max-width: 180px">
<el-option v-for="(item,index) in state.special.data" :key="index" :label="item.name" :value="item.id"></el-option>
作品类型：<el-select size="default" v-model="state.tableData.param.serviceName" placeholder="请选择作品类型"
clearable class="ml10 mr10" style="max-width: 180px" filterable>
<el-option v-for="(item,index) in state.special.data" :key="index" :label="item.name" :value="item.name"></el-option>
</el-select>
<el-button @click="getTableData" size="default" type="primary" class="ml10">
@ -21,21 +21,35 @@
</el-icon>
重置
</el-button>
<el-button @click="state.recommend.show = true" size="default" type="success" class="ml10">
<el-icon>
<ele-FolderAdd />
</el-icon>
添加推荐作品
</el-button>
</div>
<el-table :data="state.tableData.data" v-loading="state.tableData.loading" style="width: 100%">
<el-table-column align="center" type="index" label="序号" width="100"/>
<el-table-column align="center" prop="name" label="作品">
<el-table-column align="center" prop="sourcePath" label="原图">
<template #default="scope">
<el-image :src="scope.row.path" lazy
preview-teleported="true" :preview-src-list="[scope.row.path]"/>
<el-image v-if="scope.row.sourcePath" :src="getImagePath(scope.row.sourcePath)" lazy
preview-teleported="true" :preview-src-list="[getImagePath(scope.row.sourcePath)]"/>
<div v-else>暂无</div>
</template>
</el-table-column>
<el-table-column prop="serviceName" align="center" label="服务名" show-overflow-tooltip></el-table-column>
<el-table-column align="center" prop="path" label="作品">
<template #default="scope">
<el-image :src="getImagePath(scope.row.path)" lazy
preview-teleported="true" :preview-src-list="[getImagePath(scope.row.path)]"/>
</template>
</el-table-column>
<el-table-column prop="serviceName" align="center" label="作品类型" show-overflow-tooltip></el-table-column>
<el-table-column prop="createtime" align="center" label="时间" :formatter="dateFormatter" show-overflow-tooltip></el-table-column>
<el-table-column label="操作" width="200" align="center">
<template #default="scope">
<!-- <el-button size="small" text type="primary" @click="toShowDetail(scope.row.id)">查看详情</el-button> -->
<el-button size="small" text type="danger" @click="toPublic(scope.row)">取消推荐</el-button>
<el-button size="small" text type="primary" @click="reviewRecommend(scope.row)">修改</el-button>
<el-button size="small" text type="danger" @click="deleteRecommend(scope.row.id)">删除</el-button>
<!-- <el-button size="small" v-else text type="primary" @click="audit(scope.row)">重新审核</el-button> -->
</template>
</el-table-column>
@ -69,6 +83,83 @@
</el-form>
</div>
</el-dialog>
<!-- 添加推荐作品 -->
<el-dialog :title="state.recommend.title" v-model="state.recommend.show" width="400px">
<el-form v-loading="state.recommend.loading" ref="recommendFormRef" :model="state.recommend.form" :rules="state.recommend.rules" size="default" label-width="100px">
<el-row :gutter="35">
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
<el-form-item label="作品类型：" prop="serviceName">
<el-select size="default" v-model="state.recommend.form.serviceName" placeholder="请选择作品类型" clearable filterable>
<el-option v-for="(item,index) in state.special.data" :key="index" :label="item.name" :value="item.name"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
<el-form-item label="排序号：" prop="number">
<el-input placeholder="请输入排序号" min="0" v-model="state.recommend.form.number" type="number"></el-input>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
<el-form-item label="原图：" class="iconImg">
<!-- 上传文件 -->
<el-upload ref="ordUploadRef" class="h100 personal-user-left-upload" action="#" list-type="picture-card"
:auto-upload="false" :limit="1" :class="{ hide: state.recommend.picture.ordHide }" @change="handleOrdUploadChange" accept='image/*'>
<template #default>
<el-icon><Plus /></el-icon>
</template>
<template #file="{ file }">
<div>
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
<span class="el-upload-list__item-actions">
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
<el-icon><zoom-in /></el-icon>
</span>
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleOrdRemove(file)">
<el-icon><Delete /></el-icon>
</span>
</span>
</div>
</template>
</el-upload>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
<el-form-item label="效果图：" class="iconImg">
<!-- 上传文件 -->
<el-upload ref="effUploadRef" class="h100 personal-user-left-upload" action="#" list-type="picture-card"
:auto-upload="false" :limit="1" :class="{ hide: state.recommend.picture.effHide }" @change="handleEffUploadChange" accept='image/*'>
<template #default>
<el-icon><Plus /></el-icon>
</template>
<template #file="{ file }">
<div>
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
<span class="el-upload-list__item-actions">
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
<el-icon><zoom-in /></el-icon>
</span>
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleEffRemove(file)">
<el-icon><Delete /></el-icon>
</span>
</span>
</div>
</template>
</el-upload>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="onCancel" size="default">取 消</el-button>
<el-button type="primary" @click="onSubmit" size="default">确 定</el-button>
</span>
</template>
</el-dialog>
<!-- 封面预览弹窗 -->
<el-dialog v-model="dialogVisible">
<img width="100%" w-full :src="dialogImageUrl" alt="预览" />
</el-dialog>
</div>
</template>
@ -76,7 +167,9 @@
import { defineAsyncComponent, onMounted, reactive, ref } from 'vue';
import { recommendApi } from '/@/api/service/recommend';
import { applyApi } from '/@/api/service/apply';
import { ElMessage, ElMessageBox, TableColumnCtx } from 'element-plus';
import { photosApi } from '/@/api/photos';
import { ElMessage, ElMessageBox, TableColumnCtx, UploadFile, UploadFiles } from 'element-plus';
import { Delete, Plus, ZoomIn } from '@element-plus/icons-vue';
// 表格数据
const state = reactive<any>({
@ -87,7 +180,9 @@ const state = reactive<any>({
param: {
current: 1,
size: 10,
serviceId: ''
serviceName: '',
isBackend: 1,
number: ''
},
},
special: {
@ -101,13 +196,43 @@ const state = reactive<any>({
},
show: false,
title: '作品审核',
message: '',
},
recommend: {
loading: false,
form: {},
rules: {
// photoSourceId: { required: true, message: '请输入应用名称', trigger: 'blur' },
photoTargetId: { required: false, message: '请上传推荐作品', trigger: 'blur' },
serviceName: { required: true, message: '请选择作品类型', trigger: 'blur' },
number: { required: true, message: '请输入排序号', trigger: 'blur' }
},
show: false,
title: '新增推荐作品',
picture:{
ordFile: {},
ordHide: false,
effFile: {},
effHide: false
}
}
});
// 引入 api 请求接口
const redApi = recommendApi();
const aplApi = applyApi();
const photoApi = photosApi();
// 图标弹窗
const dialogImageUrl = ref('');
const dialogVisible = ref(false);
// 定义变量内容
const recommendFormRef = ref();
const ordUploadRef = ref();
const effUploadRef = ref();
// 图标上传禁用
const disabled = ref(false);
// 获取专题列表
const getSpecialList = async() => {
@ -125,6 +250,13 @@ const getSpecialList = async() => {
}
};
// 图片格式化
const getImagePath = (path: string) => {
if(!path) return;
let index = path?.indexOf('?');
return path?.includes('://') ? path.substring(0,(!index||index===-1) ? path.length : index) : encodeURI(path);
}
// 获取表格数据
const getTableData = async() => {
try {
@ -137,23 +269,179 @@ const getTableData = async() => {
ElMessage.error('推荐作品列表获取失败！');
}
} catch (error) {
ElMessage.error('推荐作品列表获取失败！');
} finally {
state.tableData.loading = false;
}
};
// 修改排序号
const reviewRecommend = (row:any) => {
ElMessageBox.prompt('排序号','编辑',{
inputValue: `${row.number}`,
inputPattern:/^(0|[1-9][0-9]*)$/,
inputErrorMessage: '请输入大于等于0的数字',
inputPlaceholder: '请输入排序号'
}).then(async({ value }) => {
let res = await redApi.updateRecommend({id: row.id,number: Number(value)});
if(res?.success){
// getTableData();
row.number = Number(value);
ElMessage.success('修改成功！');
}else{
ElMessage.error('修改失败！');
}
})
.catch(() => {})
}
// 删除推荐
const deleteRecommend = (id:Number) =>{
ElMessageBox.confirm('是否确定删除该推荐?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
})
.then(async() => {
try {
state.tableData.loading = true;
let res = await redApi.deleteRecommend(id);
if(res?.success){
await getTableData();
ElMessage.success('推荐作品删除成功！');
} else ElMessage.error('推荐作品删除失败！');
} catch(e) {
ElMessage.error('处理失败！');
} finally {
state.tableData.loading = false;
}
})
}
// 重置
const reset = () =>{
state.tableData.param = {
current: 1,
size: 10,
serviceId: ''
serviceName: '',
isBackend: 1
}
getTableData();
}
// 关闭弹窗
const closeDialog = () => {
setTimeout(() => {
state.recommend.show = false;
state.recommend.form = {};
handleOrdRemove();
handleEffRemove();
}, 300)
};
// 取消
const onCancel = () => {
closeDialog();
};
// 上传文件
const uploadImageFile = async(file: any,type: any) => {
try {
state.recommend.loading = true;
const formdata = new FormData();
formdata.append('file', file);
let res = await photoApi.uploadPictrue(formdata);
if(res?.success){
type === 'ord' ? state.recommend.form.photoSourceId = res.data.id : state.recommend.form.photoTargetId = res.data.id ;
state.recommend.loading = false;
}else{
ElMessage.error('图片上传失败！');
state.recommend.loading = false;
}
} catch (error) {
state.recommend.loading = false;
ElMessage.error('图片上传失败！');
}
}
// 图标删除——原图
const handleOrdRemove = (file?: UploadFile) => {
state.recommend.picture.ordFile = {};
state.recommend.form.photoSourceId = '';
ordUploadRef.value.clearFiles();
state.recommend.picture.ordHide = false;
}
// 图标删除——效果图
const handleEffRemove = (file?: UploadFile) => {
state.recommend.picture.effFile = {};
state.recommend.form.photoTargetId = '';
effUploadRef.value.clearFiles();
state.recommend.picture.effHide = false;
}
// 图标图片更改——原图
const handleOrdUploadChange = (uploadFile: UploadFile, uploadFiles: UploadFiles) => {
if(uploadFile.raw.type.includes('image')){
const file:any = uploadFile.raw;
state.recommend.picture.ordFile = file;
state.recommend.picture.ordHide = true;
uploadImageFile(file,'ord');
}else{
ElMessage.error('请上传图片文件！');
ordUploadRef.value.clearFiles();
}
}
// 图标图片更改——效果图
const handleEffUploadChange = (uploadFile: UploadFile, uploadFiles: UploadFiles) => {
if(uploadFile.raw.type.includes('image')){
const file:any = uploadFile.raw;
state.recommend.picture.effFile = file;
state.recommend.picture.effHide = true;
uploadImageFile(file,'eff');
}else{
ElMessage.error('请上传图片文件！');
effUploadRef.value.clearFiles();
}
}
// 图标预览
const handlePictureCardPreview = (file: UploadFile) => {
dialogImageUrl.value = file.url!
dialogVisible.value = true
}
const replayFormRef = ref();
// 提交
const onSubmit = () => {
recommendFormRef.value.validate(async(valid: boolean) => {
if (valid && state.recommend.picture.effHide){
try {
state.recommend.loading = true;
let res = await redApi.saveRecommend(state.recommend.form);
if(res?.success){
ElMessage.success('推荐作品新增成功！');
closeDialog(); // 关闭弹窗
state.tableData.param.current = 1;
getTableData();
}else{
ElMessage.error('推荐作品新增失败！');
}
} catch (error) {
ElMessage.error('处理失败！');
} finally {
state.recommend.loading = false;
}
}else{
ElMessage.error(state.recommend.form.number ? '请上传效果图！' :
(state.recommend.form.serviceName ? '请输入排序号！' : '请选择作品类型！'));
}
});
};
// 取消推荐
const toPublic = (row: any) => {
ElMessageBox.confirm('确定要取消该作品推荐吗?', '提示', {
@ -181,12 +469,13 @@ const toPublic = (row: any) => {
// 日期格式化
const dateFormatter = (row: any, column: TableColumnCtx<String>) => {
if(row.createtime === null) return '暂无';
let mount = row.createtime[1];
let day = row.createtime[2];
let hour = row.createtime[3];
let minute = row.createtime[4];
let second = row.createtime[5];
return `${row.createtime[0]}-${mount < 10 ? '0' : ''}${mount}-${day < 10 ? '0' : ''}${day} ${hour < 10 ? '0' : ''}${hour}:${minute < 10 ? '0' : ''}${minute}:${second < 10 ? '0' : ''}${second}`;
let date = new Date(row.createtime);
let mount = date.getMonth() + 1;
let day = date.getDate();
let hour = date.getHours();
let minute = date.getMinutes();
let second = date.getSeconds();
return `${date.getFullYear()}-${mount < 10 ? '0' : ''}${mount}-${day < 10 ? '0' : ''}${day} ${hour < 10 ? '0' : ''}${hour}:${minute < 10 ? '0' : ''}${minute}:${second < 10 ? '0' : ''}${second}`;
}
// 分页改变
@ -220,6 +509,9 @@ onMounted(() => {
}
}
}
.iconImg :deep(.hide .el-upload--picture-card) {
display: none;
}
.dialog-content{
padding: 0;
display: flex;

65
src/views/service/shares/index.vue
View File

@ -35,9 +35,11 @@
<el-table-column prop="reviewStatus" align="center" label="审核结果" show-overflow-tooltip>
<template #default="scope">
<el-tag v-if="scope.row.reviewStatus === 1" type="warning">审核中</el-tag>
<el-tag v-else-if="scope.row.reviewStatus === 2" type="success">通过</el-tag>
<el-tag v-else-if="scope.row.reviewStatus === 3" type="danger">未通过</el-tag>
<el-tag v-else>未发布</el-tag>
<el-tag v-else-if="scope.row.reviewStatus === null||scope.row.reviewStatus === 0">未发布</el-tag>
<el-tag v-else-if="scope.row.reviewStatus === 2" type="success">通过</el-tag>
<el-tag v-else-if="scope.row.reviewStatus === 4" type="success">已推荐</el-tag>
<el-tag v-else-if="scope.row.reviewStatus === 5" type="warning">取消推荐</el-tag>
</template>
</el-table-column>
<el-table-column prop="createtime" align="center" label="时间" :formatter="dateFormatter" show-overflow-tooltip></el-table-column>
@ -46,8 +48,9 @@
<!-- <el-button size="small" text type="primary" @click="toShowDetail(scope.row.id)">查看详情</el-button> -->
<el-button size="small" v-if="scope.row.reviewStatus === 1" text type="primary" @click="audit(scope.row)">审核</el-button>
<el-button size="small" v-else-if="scope.row.reviewStatus === null||scope.row.reviewStatus === 0" text type="primary" @click="toPublic(scope.row)">发布</el-button>
<el-button size="small" v-else text type="primary" @click="audit(scope.row)">重新审核</el-button>
<!-- <el-button size="small" v-if="scope.row.reviewStatus === 2" text type="primary" @click="toPublicHome(scope.row)">首页推荐</el-button> -->
<el-button size="small" v-else-if="scope.row.reviewStatus === 2||scope.row.reviewStatus === 3||scope.row.reviewStatus === 5" text type="primary" @click="audit(scope.row)">重新审核</el-button>
<el-button size="small" v-if="scope.row.reviewStatus === 2||scope.row.reviewStatus === 5" text type="primary" @click="toPublicHome(scope.row)">首页推荐</el-button>
<el-button size="small" v-else-if="scope.row.reviewStatus === 4" text type="danger" @click="toCancelPublic(scope.row)">取消推荐</el-button>
</template>
</el-table-column>
</el-table>
@ -123,6 +126,8 @@ const statusList = ref([
{label: '审核中', value: 1},
{label: '通过', value: 2},
{label: '未通过', value: 3},
{label: '已推荐', value: 4},
{label: '取消推荐', value: 5},
]);
// 引入 api 请求接口
@ -185,6 +190,32 @@ const toPublic = (row: any) => {
})
}
// 取消推荐
const toCancelPublic = (row: any) => {
ElMessageBox.confirm('是否确定取消推荐该作品?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
})
.then(async() => {
try {
state.auditDialog.form.id = row.id;
state.auditDialog.form.status = 5;
state.tableData.loading = true;
let res = await shareApi.auditRelease(state.auditDialog.form);
if(res?.success){
ElMessage.success('作品取消推荐成功！');
state.auditDialog.show = false;
getTableData();
}else{ElMessage.error('作品取消推荐失败！');}
} catch(e) {
ElMessage.error('处理失败！');
} finally {
state.tableData.loading = false;
}
})
}
// 首页推荐
const toPublicHome = (row: any) => {
ElMessageBox.confirm('确定要推荐该作品吗?', '提示', {
@ -194,18 +225,15 @@ const toPublicHome = (row: any) => {
})
.then(async() => {
try {
state.auditDialog.form.id = row.id;
state.auditDialog.form.status = 4;
state.tableData.loading = true;
const form = {
labelName: '首页推荐',
moduleName: '首页推荐',
path: row.path
}
console.log(form);
// let res = await shareApi.saveRelease({ creationId: row.creationId });
// if(res?.success){
// ElMessage.success('推荐成功！');
// } else ElMessage.error('推荐失败！');
let res = await shareApi.auditRelease(state.auditDialog.form);
if(res?.success){
ElMessage.success('作品推荐成功！');
state.auditDialog.show = false;
getTableData();
}else{ElMessage.error('作品推荐失败！');}
} catch(e) {
ElMessage.error('处理失败！');
} finally {
@ -244,7 +272,12 @@ const commitAudit = async() => {
const dateFormatter = (row: any, column: TableColumnCtx<String>) => {
if(row.createtime === null) return '暂无';
let date = new Date(row.createtime);
return `${date.getFullYear()}-${date.getMonth()+1}-${date.getDate()} ${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`;
let mount = date.getMonth() + 1;
let day = date.getDate();
let hour = date.getHours();
let minute = date.getMinutes();
let second = date.getSeconds();
return `${date.getFullYear()}-${mount < 10 ? '0' : ''}${mount}-${day < 10 ? '0' : ''}${day} ${hour < 10 ? '0' : ''}${hour}:${minute < 10 ? '0' : ''}${minute}:${second < 10 ? '0' : ''}${second}`;
}
// 分页改变

670
src/views/service/wall/index.vue Normal file
View File

@ -0,0 +1,670 @@
<template>
<div class="system-dept-container layout-padding">
<el-card shadow="hover" class="layout-padding-auto">
<div class="system-dept-search mb15">
<span>标签:</span>
<el-select @change="handleChangeLabel" size="default" v-model="state.tableData.param.labelName" placeholder="请选择" filterable clearable class="ml10" style="max-width: 180px;margin:0 10px;">
<el-option v-for="(item,index) in labelList" :key="index" :label="item.name" :value="item.name" />
</el-select>
<span>应用服务:</span>
<el-select size="default" v-model="state.tableData.param.serviceName" placeholder="请选择" filterable clearable class="ml10" style="max-width: 180px;margin:0 10px;">
<el-option v-for="(item,index) in state.special.data" :key="index" :label="item.name" :value="item.name" />
</el-select>
<el-button @click="getTableData" size="default" type="primary" class="ml10" style="margin-right: 15px;">
<el-icon>
<ele-Search />
</el-icon>
查询
</el-button>
<el-button @click="reset" size="default" type="primary" class="ml10" style="margin-right: 15px;">
<el-icon>
<ele-RefreshRight />
</el-icon>
重置
</el-button>
<el-button @click="switchDrawer(0)" size="default" type="primary" class="ml10">
<el-icon>
<ele-FolderAdd />
</el-icon>
添加图片
</el-button>
</div>
<div class="system-dept-search mb15" style="cursor: pointer;" @click="copyAddress" title="点击复制">
栏目地址：{{ viteUrl + state.lamAddress + (state.lamAddressId ? ('?id=' + state.lamAddressId) : '') }}
</div>
<el-table :data="state.tableData.data" v-loading="state.tableData.loading" style="width: 100%" class="custom-table">
<el-table-column type="selection" width="55" />
<el-table-column prop="name" label="图片名称" :formatter="commonFormatter" show-overflow-tooltip></el-table-column>
<el-table-column label="水印图" align="center">
<template #default="scope">
<el-image lazy :src="jpgFormatter(scope.row.watermarkPath)" preview-teleported="true" :preview-src-list="[jpgFormatter(scope.row.watermarkPath)]"/>
</template>
</el-table-column>
<el-table-column label="原图" align="center">
<template #default="scope">
<el-image lazy :src="jpgFormatter(scope.row.originalPath)" preview-teleported="true" :preview-src-list="[jpgFormatter(scope.row.originalPath)]"/>
</template>
</el-table-column>
<el-table-column prop="serviceName" label="应用服务" show-overflow-tooltip align="center"></el-table-column>
<el-table-column prop="number" label="排序" :formatter="commonFormatter" show-overflow-tooltip align="center"></el-table-column>
<el-table-column prop="price" label="价格" show-overflow-tooltip align="center"></el-table-column>
<el-table-column prop="uploadName" label="上传者" :formatter="commonFormatter" show-overflow-tooltip align="center"></el-table-column>
<el-table-column prop="createtime" label="创建时间" :formatter="dateFormatter" show-overflow-tooltip align="center"></el-table-column>
<el-table-column label="操作" align="center">
<template #default="scope">
<el-button text type="primary" @click="switchDrawer(1,scope.row.id)">
<el-icon>
<ele-Edit />
</el-icon>
</el-button>
<el-button text type="primary" @click="deleteBanner(scope.row.id)">
<el-icon>
<ele-Delete />
</el-icon>
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 新增或编辑弹窗 -->
<el-drawer
v-model="dialog"
:title="changeTitle()"
@close="resetForm"
direction="rtl"
size="45%"
>
<div class="demo-drawer__content">
<el-form
ref="ruleFormRef"
style="max-width: 85%"
:model="state.formData"
:rules="state.rules"
label-width="110px"
class="demo-ruleForm"
:size="formSize"
status-icon
v-loading="state.formData.loading"
:disabled="isForbidden"
>
<el-form-item label="标签:" prop="cpLabelId">
<el-select size="default" v-model="state.formData.cpLabelId" placeholder="请选择" clearable filterable>
<el-option
v-for="(item,index) in labelList"
:key="index"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="应用服务:" prop="serviceId">
<el-select size="default" v-model="state.formData.serviceId" placeholder="请选择服务类型"
clearable filterable>
<el-option v-for="(item,index) in state.special.data" :key="index" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="图片名称:" prop="name" >
<el-input v-model="state.formData.name" />
</el-form-item>
<el-form-item label="水印图:" prop="fileList">
<el-upload ref="uploadRef" action="#" list-type="picture-card" :class="{disabled:uploadDisabled}"
:limit="1" :file-list="state.formData.fileList" :on-change="handleChange" :auto-upload="false">
<el-icon><Plus /></el-icon>
<template #file="{ file }">
<div>
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
<span class="el-upload-list__item-actions">
<span
class="el-upload-list__item-preview"
@click="handlePictureCardPreview(file)"
>
<el-icon><zoom-in /></el-icon>
</span>
<span
v-if="!disabled"
class="el-upload-list__item-delete"
@click="handleRemove(file)"
>
<el-icon><Delete /></el-icon>
</span>
</span>
</div>
</template>
</el-upload>
</el-form-item>
<el-form-item label="原图:" prop="ordFileList">
<el-upload ref="ordUploadRef" action="#" list-type="picture-card" :class="{disabled:ordUploadDisabled}"
:limit="1" :file-list="state.formData.ordFileList" :on-change="handleOrdChange" :auto-upload="false">
<el-icon><Plus /></el-icon>
<template #file="{ file }">
<div>
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
<span class="el-upload-list__item-actions">
<span
class="el-upload-list__item-preview"
@click="handlePictureCardPreview(file)"
>
<el-icon><zoom-in /></el-icon>
</span>
<span
v-if="!disabled"
class="el-upload-list__item-delete"
@click="handleOrdRemove(file)"
>
<el-icon><Delete /></el-icon>
</span>
</span>
</div>
</template>
</el-upload>
</el-form-item>
<el-form-item label="排序号：" prop="number">
<el-input placeholder="请输入排序号" min="0" v-model="state.formData.number" type="number"></el-input>
</el-form-item>
<el-form-item label="价格：" prop="price">
<el-input placeholder="请输入价格" min="0" v-model="state.formData.price" type="number"></el-input>
</el-form-item>
<el-dialog v-model="dialogVisible">
<img :src="dialogImageUrl" style="width: 100%" alt="Preview Image" />
</el-dialog>
</el-form>
<div class="demo-drawer__footer">
<el-button v-show="isHide" @click="submitForm(flag)" :loading="loading" style="margin-right: 30px;" >
{{ loading ? '保存 ...' : '保存' }}
</el-button>
<el-button type="primary" @click="resetForm">取消</el-button>
</div>
</div>
</el-drawer>
<!-- 分页器 -->
<el-pagination
@size-change="onHandleSizeChange"
@current-change="onHandleCurrentChange"
class="mt15"
:pager-count="5"
:page-sizes="[10, 20, 30]"
v-model:current-page="state.tableData.param.current"
background
v-model:page-size="state.tableData.param.size"
layout="total, sizes, prev, pager, next, jumper"
:total="state.tableData.total"
>
</el-pagination>
</el-card>
</div>
</template>
<script setup lang="ts" name="recommendWall">
import { onMounted, reactive, ref } from 'vue';
import { ElDrawer, ElMessage, ElMessageBox, TableColumnCtx, timePickerDefaultProps } from 'element-plus';
import { Delete, Plus, ZoomIn } from '@element-plus/icons-vue'
import type { ComponentSize, FormInstance, FormRules, UploadFile, UploadProps, UploadUserFile } from 'element-plus'
import { photosApi } from '/@/api/photos';
import { recommendWallApi } from '/@/api/service/wall';
import { applyApi } from '/@/api/service/apply';
import { attachmentApi } from '/@/api/attachment';
// 数据
const state = reactive({
tableData: {
data: [],
total: 0,
loading: false,
param: {
labelName: '',
serviceName: '',
current: 1,
size: 10,
},
},
special: {
data: [],
},
formData: {
cpLabelId: '',
serviceId: '',
number: '',
name: '',
originalPath: '',
watermarkPath: '',
price: '',
fileList: [],
ordFileList: [],
loading: false
},
rules: {
name: [
{ required: true, message: '请输入名称', trigger: 'blur' }
],
fileList: [
{ required: true, message: '请选择水印图', trigger: 'blur' }
],
ordFileList: [
{ required: true, message: '请选择原图', trigger: 'blur' }
],
serviceId: [
{ required: true, message: '请选择应用服务', trigger: 'blur' },
],
cpLabelId: [
{ required: true, message: '请选择标签', trigger: 'blur' },
],
number: [{ required: true, message: '请输入排序号', trigger: 'blur' }],
price: [{ required: true, message: '请输入价格', trigger: 'blur' }],
},
lamAddress: '#/pages/mobile_web/wall/detail',
lamAddressId: '',
});
// 图片基本路径
const viteUrl = import.meta.env.DEV ? 'http://8.138.171.103/pixel/' : import.meta.env.VITE_API_URL;
// 引入 api 请求接口
const photoApi = photosApi();
const wallApi = recommendWallApi();
const aplApi = applyApi();
const attApi = attachmentApi();
// 标签列表
const labelList = ref([]);
// 复制地址
const copyAddress = () =>{
var aux = document.createElement("input");
aux.setAttribute("value", viteUrl + state.lamAddress + (state.lamAddressId ? ('?id=' + state.lamAddressId) : ''));
document.body.appendChild(aux);
aux.select();
document.execCommand("copy");
document.body.removeChild(aux);
ElMessage.success('复制成功');
aux.remove();
}
// 切换搜索label
const handleChangeLabel = (name:any) => {
state.lamAddressId = labelList.value.find((item:any)=>item.name === name)?.id;
};
// 获取专题列表
const getSpecialList = async() => {
try {
state.tableData.loading = true;
let res = await aplApi.getAllServices();
if(res?.success){
state.special.data = res.data;
}else{
ElMessage.error('应用服务获取失败！');
}
} catch (error) {
} finally {
state.tableData.loading = false;
}
};
// 获取表格数据
const getTableData = async() => {
try {
state.tableData.loading = true;
let res = await wallApi.getWallList(state.tableData.param);
if(res?.success){
state.tableData.data = res.data.records;
state.tableData.total = res.data.total;
}else{
ElMessage.error('推荐作品获取失败！');
}
} catch (error) {
} finally {
state.tableData.loading = false;
}
};
// 重置
const reset = () =>{
state.tableData.param = {
current: 1,
serviceName: '',
labelName: '',
size: 10,
}
getTableData();
}
// 图片链接格式化
const jpgFormatter = (path: any) => {
return path?.includes('://')?path : path;
}
// 通用格式化
const commonFormatter = (row: any, column: TableColumnCtx<String>) => {
return row[column.property] || '暂无';
}
// 日期格式化
const dateFormatter = (row: any, column: TableColumnCtx<String>) => {
let date = new Date(row.createtime);
return `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
}
// 分页改变
const onHandleSizeChange = (val: number) => {
state.tableData.param.size = val;
getTableData();
};
// 分页改变
const onHandleCurrentChange = (val: number) => {
state.tableData.param.current = val;
getTableData();
};
// #endregion
// #region
const dialog = ref(false)
const flag = ref(false)
const formSize = ref<ComponentSize>('large')
const ruleFormRef = ref<FormInstance>()
const uploadDisabled = ref(false)
const ordUploadDisabled = ref(false)
const isHide = ref(false)
const headTitle = ref("")
const changeTitle = () => {
if (flag.value) {
headTitle.value="新增图片"
} else {
headTitle.value="编辑图片"
}
if (!isHide.value) {
headTitle.value="查看图片"
}
return headTitle.value;
}
// 获取图片详情
const singleWall = async (id: number) => {
state.formData.loading = true;
let res = await wallApi.singleWall(id)
if (res?.success) {
state.formData.fileList.push({ url: jpgFormatter(res.data.watermarkPath) });
state.formData.ordFileList.push({ url: jpgFormatter(res.data.originalPath) });
Object.assign(state.formData, res.data);
uploadDisabled.value = true;
ordUploadDisabled.value = true;
state.formData.loading = false;
} else {
ElMessage.error('获取图片详情失败！')
state.formData.loading = false;
}
}
const isForbidden = ref(false)
// 切换右侧边栏
const switchDrawer = async (staus:any,id: number) => {
if (staus == 1) {
flag.value = false;
isHide.value = true;
disabled.value = false;
singleWall(id);
} else {
console.log("添加图片");
flag.value = true;
isHide.value = true;
}
dialog.value = true;
}
// 添加图片
const disabled = ref(false)
const handleChange: UploadProps['onChange'] = async (file: uploadFile, uploadFiles) => {
state.formData.loading = true;
if (file.raw.type === 'image/png' || file.raw.type === 'image/jpeg' || file.raw.type === 'image/jpg' || file.raw.type === 'image/gif') {
state.formData.fileList = uploadFiles;
uploadDisabled.value = true;
try {
const formdata = new FormData();
formdata.append('file', file.raw);
formdata.append('type', 'picture');
let res = await attApi.uploadByType(formdata);
if(res?.success){
state.formData.watermarkPath = jpgFormatter(res.data);
ElMessage({message: '图片上传成功！',type: 'success',})
state.formData.loading = false;
}else{
ElMessage.error('图片上传失败！');
}
} catch (error) {
state.formData.loading = false;
ElMessage.error('图片上传失败！');
}
} else {
ElMessageBox.alert('图片的格式不正确，请重新选择！', '提示', {
confirmButtonText: '确定',
})
uploadFiles.pop()
uploadDisabled.value = false;
}
}
const handleOrdChange: UploadProps['onChange'] = async (file: uploadFile, uploadFiles) => {
state.formData.loading = true;
if (file.raw.type === 'image/png' || file.raw.type === 'image/jpeg' || file.raw.type === 'image/jpg' || file.raw.type === 'image/gif') {
state.formData.ordFileList = uploadFiles;
ordUploadDisabled.value = true;
try {
const formdata = new FormData();
formdata.append('file', file.raw);
formdata.append('type', 'picture');
let res = await attApi.uploadByType(formdata);
if(res?.success){
state.formData.originalPath = jpgFormatter(res.data);
ElMessage({message: '图片上传成功！',type: 'success',})
state.formData.loading = false;
}else{
ElMessage.error('图片上传失败！');
}
} catch (error) {
state.formData.loading = false;
ElMessage.error('图片上传失败！');
}
} else {
ElMessageBox.alert('图片的格式不正确，请重新选择！', '提示', {
confirmButtonText: '确定',
})
uploadFiles.pop()
ordUploadDisabled.value = false;
}
}
const dialogImageUrl = ref('')
const dialogVisible = ref(false)
const handlePictureCardPreview = (file: UploadFile,uploadFiles) => {
dialogImageUrl.value = file.url!
dialogVisible.value = true
}
const uploadRef = ref();
const ordUploadRef = ref();
const handleRemove = (file: UploadFile, uploadFiles) => {
uploadRef.value.clearFiles();
state.formData.watermarkPath = "";
state.formData.fileList = [];
uploadDisabled.value = false;
};
const handleOrdRemove = (file: UploadFile, uploadFiles) => {
ordUploadRef.value.clearFiles();
state.formData.originalPath = "";
state.formData.ordFileList = [];
ordUploadDisabled.value = false;
};
// 作品墙模块下的标签
const getLabelList = async() => {
try {
let res = await photoApi.getLabelList(4);
if(res?.success){
labelList.value = res.data;
}else{
ElMessage.error('标签列表获取失败！');
}
} catch (error) {
ElMessage.error('标签列表获取失败！');
} finally {
}
}
// 删除图片
const deleteBanner = (id: number) => {
ElMessageBox.confirm('确定要删除该作品吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
})
.then(async() => {
try {
state.tableData.loading = true;
let res = await wallApi.deleteWall(id);
if(res?.success){
await getTableData();
ElMessage.success('图片删除成功！');
} else ElMessage.error('图片删除失败！');
} catch(e) {
ElMessage.error('删除失败！');
} finally {
state.tableData.loading = false;
}
})
}
const loading = ref(false)
const submitForm = (decision:any) => {
ruleFormRef.value?.validate(async (valid) => {
if (valid) {
loading.value = true;
try {
const form = { ...state.formData };
let res;
if (decision) {
res = await wallApi.saveWall(form);
} else {
res = await wallApi.updateWall(form);
}
if (res?.success) {
ElMessage({
message: '保存成功！',
type: 'success',
});
loading.value = false;
getTableData();
dialog.value = false;
}
} catch (error) {
ElMessage.error('保存失败！');
loading.value = false;
}
} else {
ElMessage.error('请填写必要信息！');
loading.value = false;
}
});
};
const resetForm = () => {
dialog.value = false;
ruleFormRef.value?.resetFields();
state.formData.fileList.pop();
state.formData.ordFileList.pop();
uploadDisabled.value = false;
ordUploadDisabled.value = false;
isForbidden.value = false;
};
// #endregion
onMounted(() => {
getTableData();
getLabelList();
getSpecialList();
})
</script>
<style scoped lang="scss">
.system-dept-container {
:deep(.el-card__body) {
display: flex;
flex-direction: column;
flex: 1;
overflow: auto;
.el-table {
flex: 1;
width: 100%;
table-layout: fixed;
}
}
};
::v-deep .el-table th,
::v-deep .el-table td {
padding: 13px;
text-align: left; // 左对齐文字
}
::v-deep .el-table-column--center {
text-align: center; // 居中对齐特定列
}
::v-deep .el-table__header-wrapper {
background-color: #f5f7fa; // 为表头设置背景颜色
padding: 0; // 减少表头的内边距
}
::v-deep .el-table__body{
width: 100% !important;
}
::v-deep .el-image {
width: 75px; // 固定图片宽度
height: 75px; // 固定图片高度
object-fit: cover; // 图片居中剪裁
display: block;
}
::v-deep .el-drawer .el-drawer__header {
margin: 15px 0 20px 0!important;
border-bottom: 0!important;
}
::v-deep .el-drawer__title {
font-size: 28px!important;
}
::v-deep .el-form-item--large{
--font-size: 18px;
margin-bottom: 28px!important;
}
.demo-drawer__footer{
margin:40px 0 0 150px!important;
}
::v-deep .disabled{
.el-upload--picture-card{
display: none;
}
}
::v-deep .el-select--large .el-select__wrapper {
padding: 5px 10px;
min-height: 30px;
}
::v-deep .el-form {
margin: 0 19px;
}
</style>

5
src/views/statistics/index.vue
View File

@ -9,8 +9,9 @@
:xl="6"
v-for="(v, k) in state.homeOne"
:key="k"
:class="{ 'home-media home-media-lg': k > 1, 'home-media-sm': k === 1 }"
class="home-media-sm"
>
<!-- :class="{ 'home-media home-media-lg': k > 1, 'home-media-sm': k === 1 }" -->
<div class="home-card-item flex">
<div class="flex-margin flex w100" :class="` home-one-animation${k}`">
<div class="flex-auto">
@ -77,7 +78,7 @@
:sm="24"
:md="24"
:lg="24"
:xl="20"
:xl="24"
>
<div class="home-card-item">
<!-- 添加日期范围选择框 -->