优化
This commit is contained in:
parent
eaffe7571a
commit
6bb2e359da
@ -3,8 +3,8 @@
|
||||
"baseUrl": ".",
|
||||
"jsx": "preserve",
|
||||
"paths": {
|
||||
"@/*": ["src/*"],
|
||||
},
|
||||
"@/*": ["src/*"]
|
||||
}
|
||||
},
|
||||
"exclude": ["node_modules", "dist"],
|
||||
"exclude": ["node_modules", "dist"]
|
||||
}
|
||||
|
@ -3,7 +3,7 @@
|
||||
* @Author: zenghua.wang
|
||||
* @Date: 2023-06-20 11:48:41
|
||||
* @LastEditors: zenghua.wang
|
||||
* @LastEditTime: 2025-01-23 16:13:59
|
||||
* @LastEditTime: 2025-01-25 10:49:41
|
||||
*/
|
||||
import { createRouter, createWebHistory } from 'vue-router';
|
||||
import { qiankunWindow } from 'vite-plugin-qiankun/dist/helper';
|
||||
@ -50,7 +50,7 @@ export const constantRoutes = [
|
||||
* @Title notFoundRouter(找不到路由)
|
||||
*/
|
||||
export const notFoundRouter = {
|
||||
path: '/sub-government-affairs-service/:pathMatch(.*)',
|
||||
path: '/:pathMatch(.*)',
|
||||
name: 'notFound',
|
||||
redirect: '/404',
|
||||
};
|
||||
|
@ -1,37 +1,19 @@
|
||||
import Layout from '@/layouts/index.vue';
|
||||
|
||||
export default [
|
||||
{
|
||||
path: '/demo',
|
||||
name: 'demo',
|
||||
component: Layout,
|
||||
redirect: '/demo-table',
|
||||
meta: { title: '案例管理', icon: 'icon-test' },
|
||||
children: [
|
||||
{
|
||||
path: '/demo-table',
|
||||
component: () => import('@/views/demo/table.vue'),
|
||||
name: 'table',
|
||||
meta: { title: '列表', icon: 'Document' },
|
||||
},
|
||||
{
|
||||
path: '/demo-echart',
|
||||
component: () => import('@/views/demo/echart.vue'),
|
||||
name: 'echart',
|
||||
meta: { title: '图表', icon: 'Document' },
|
||||
},
|
||||
{
|
||||
path: '/demo-svg',
|
||||
component: () => import('@/views/demo/svg.vue'),
|
||||
name: 'svg',
|
||||
meta: { title: 'svg图标', icon: 'Document' },
|
||||
},
|
||||
{
|
||||
path: '/demo-editor',
|
||||
component: () => import('@/views/demo/editor.vue'),
|
||||
name: 'editor',
|
||||
meta: { title: '富文本编辑器', icon: 'Document' },
|
||||
},
|
||||
],
|
||||
},
|
||||
// {
|
||||
// path: '/demo',
|
||||
// name: 'demo',
|
||||
// component: Layout,
|
||||
// redirect: '/demo-table',
|
||||
// meta: { title: '案例管理', icon: 'icon-test' },
|
||||
// children: [
|
||||
// {
|
||||
// path: '/demo-table',
|
||||
// component: () => import('@/views/demo/table.vue'),
|
||||
// name: 'table',
|
||||
// meta: { title: '列表', icon: 'Document' },
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
];
|
||||
|
@ -1,52 +0,0 @@
|
||||
const colors = ['#4db6ac', '#ffb74d', '#64b5f6', '#e57373', '#9575cd', '#a1887f', '#90a4ae', '#4dd0e1', '#81c784', '#ff8a65'];
|
||||
export const getData = (() => {
|
||||
let dottedBase = +new Date();
|
||||
const barDataSource = [];
|
||||
const barMultiData = [];
|
||||
const barLineData = [];
|
||||
const barLineColors = [];
|
||||
|
||||
for (let i = 0; i < 20; i++) {
|
||||
let obj = { name: '', value: 0 };
|
||||
const date = new Date((dottedBase += 1000 * 3600 * 24));
|
||||
obj.name = [date.getFullYear(), date.getMonth() + 1, date.getDate()].join('-');
|
||||
obj.value = Math.random() * 200;
|
||||
barDataSource.push(obj);
|
||||
}
|
||||
|
||||
for (let j = 0; j < 2; j++) {
|
||||
for (let i = 0; i < 20; i++) {
|
||||
let obj = { name: '', value: 0, type: 2010 + j + '' };
|
||||
const date = new Date(dottedBase + 1000 * 3600 * 24 * i);
|
||||
obj.name = [date.getFullYear(), date.getMonth() + 1, date.getDate()].join('-');
|
||||
obj.value = Math.random() * 200;
|
||||
barMultiData.push(obj);
|
||||
}
|
||||
}
|
||||
const pieData = [
|
||||
{ value: 335, name: '客服电话' },
|
||||
{ value: 310, name: '奥迪官网' },
|
||||
{ value: 234, name: '媒体曝光' },
|
||||
{ value: 135, name: '质检总局' },
|
||||
{ value: 105, name: '其他' },
|
||||
];
|
||||
const radarData = [
|
||||
{ value: 75, name: '政治', type: '文综', max: 100 },
|
||||
{ value: 65, name: '历史', type: '文综', max: 100 },
|
||||
{ value: 55, name: '地理', type: '文综', max: 100 },
|
||||
{ value: 74, name: '化学', type: '文综', max: 100 },
|
||||
{ value: 38, name: '物理', type: '文综', max: 100 },
|
||||
{ value: 88, name: '生物', type: '文综', max: 100 },
|
||||
];
|
||||
for (let j = 0; j < 2; j++) {
|
||||
for (let i = 0; i < 15; i++) {
|
||||
let obj = { name: '', value: 0, type: 2010 + j + '', seriesType: j >= 1 ? 'line' : 'bar' };
|
||||
const date = new Date(dottedBase + 1000 * 3600 * 24 * i);
|
||||
obj.name = [date.getFullYear(), date.getMonth() + 1, date.getDate()].join('-');
|
||||
obj.value = Math.random() * 200;
|
||||
barLineData.push(obj);
|
||||
}
|
||||
barLineColors.push(colors[j]);
|
||||
}
|
||||
return { barDataSource, barMultiData, pieData, barLineData, barLineColors, radarData };
|
||||
})();
|
@ -1,23 +0,0 @@
|
||||
<template>
|
||||
<div class="p-4">
|
||||
<el-card :bordered="false" style="height: 100%">
|
||||
<el-tabs v-model="activeKey" class="demo-tabs" @tab-click="tabChange">
|
||||
<el-tab-pane label="柱状图" name="1">
|
||||
<custom-echart-bar :chart-data="barDataSource" height="50vh" :option="{ title: { text: '销售额排行', left: 'center' } }" />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { getData } from './chartdemo.data';
|
||||
|
||||
const activeKey = ref('1');
|
||||
const { barDataSource } = getData;
|
||||
//tab切换
|
||||
function tabChange(key) {
|
||||
console.log('切换的key:', key);
|
||||
}
|
||||
</script>
|
@ -1,11 +0,0 @@
|
||||
<template>
|
||||
<div style="width: 800px">
|
||||
<custom-rich-editor :value="state.richText" :read-only="false" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup name="editor">
|
||||
import { reactive } from 'vue';
|
||||
const state = reactive({
|
||||
richText: `<p>这是一个富文本编辑器</p>`,
|
||||
});
|
||||
</script>
|
@ -1,5 +0,0 @@
|
||||
<template>
|
||||
<div>svg</div>
|
||||
<svg-icon name="tree" class-name="icon" size="20" title="tree" />
|
||||
</template>
|
||||
<script setup name="table"></script>
|
@ -1,243 +0,0 @@
|
||||
<template>
|
||||
<div class="custom-page">
|
||||
<avue-crud
|
||||
v-model="state.form"
|
||||
v-model:search="state.query"
|
||||
v-model:page="state.page"
|
||||
:table-loading="state.loading"
|
||||
:data="state.data"
|
||||
:option="state.options"
|
||||
@refresh-change="refreshChange"
|
||||
@search-reset="searchChange"
|
||||
@search-change="searchChange"
|
||||
@on-load="loadData"
|
||||
@sort-change="sortChange"
|
||||
@selection-change="selectionChange"
|
||||
@row-click="rowClick"
|
||||
@row-save="rowSave"
|
||||
@row-update="rowUpdate"
|
||||
@row-del="rowDel"
|
||||
>
|
||||
<template #menu-left>
|
||||
<el-button type="danger" @click="onDel">批量删除</el-button>
|
||||
</template>
|
||||
|
||||
<template #menu-right>
|
||||
<el-button type="success" icon="download">导出</el-button>
|
||||
</template>
|
||||
|
||||
<template #key-search="{ column }">
|
||||
<el-input v-model="state.query[column.prop]" placeholder="请输入关键字" />
|
||||
</template>
|
||||
|
||||
<template #pic="{ row, index }"> {{ row.pic }}-{{ index }} </template>
|
||||
|
||||
<template #pic-form="{ column, value }">
|
||||
<!-- {{ column }}---{{ value }} -->
|
||||
<el-upload
|
||||
class="custom-form__uploader"
|
||||
action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
|
||||
:show-file-list="false"
|
||||
:on-success="() => {}"
|
||||
:before-upload="() => {}"
|
||||
>
|
||||
<img v-if="column.pic" :src="column.pic" class="custom-form__uploader__img" />
|
||||
<el-icon v-else class="custom-form__uploader__icon"><Plus /></el-icon>
|
||||
</el-upload>
|
||||
</template>
|
||||
</avue-crud>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
// https://avuejs.com/crud/crud-doc.html
|
||||
import { reactive } from 'vue';
|
||||
import { useApp } from '@/hooks';
|
||||
import { sleep } from '@/utils';
|
||||
|
||||
const app = useApp();
|
||||
const state = reactive({
|
||||
loading: false,
|
||||
query: {},
|
||||
form: {},
|
||||
selection: [],
|
||||
options: {
|
||||
// height: 300,
|
||||
index: true,
|
||||
selection: true,
|
||||
// selectionWidth: 100,
|
||||
align: 'center',
|
||||
headerAlign: 'center',
|
||||
// border: true,
|
||||
// stripe: true,
|
||||
gridBtn: false,
|
||||
// printBtn: true,
|
||||
// excelBtn: true,
|
||||
defaultSort: {
|
||||
prop: 'datetime',
|
||||
order: 'descending',
|
||||
},
|
||||
column: [
|
||||
{
|
||||
label: '关键字',
|
||||
prop: 'key',
|
||||
hide: false,
|
||||
display: false,
|
||||
search: true,
|
||||
searchRules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '姓名',
|
||||
prop: 'name',
|
||||
width: 200,
|
||||
fixed: true,
|
||||
search: true,
|
||||
searchRules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入姓名',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '性别',
|
||||
prop: 'sex',
|
||||
type: 'select',
|
||||
search: true,
|
||||
filters: true,
|
||||
dicData: [
|
||||
{
|
||||
label: '男',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '女',
|
||||
value: 2,
|
||||
},
|
||||
],
|
||||
filterMethod: (value, row, column) => {
|
||||
return row.sex === value;
|
||||
},
|
||||
},
|
||||
{ label: '日期', prop: 'datetime', type: 'datetime', sortable: true, width: 200 },
|
||||
{
|
||||
label: '日期范围',
|
||||
prop: 'datetimerange',
|
||||
type: 'datetimerange',
|
||||
format: 'YYYY-MM-DD HH:mm:ss',
|
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
||||
startPlaceholder: '开始时间',
|
||||
endPlaceholder: '结束时间',
|
||||
hide: true,
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
label: '网络字典',
|
||||
prop: 'province',
|
||||
type: 'select',
|
||||
props: {
|
||||
label: 'name',
|
||||
value: 'code',
|
||||
},
|
||||
dicFlag: true,
|
||||
dicUrl: `https://cli.avuejs.com/api/area/getProvince`,
|
||||
},
|
||||
{ label: '地址', prop: 'address', type: 'textarea', rows: 2, overHidden: true, span: 24, width: 200 },
|
||||
{ label: '图片', prop: 'pic', type: 'upload', slot: true, formslot: true },
|
||||
],
|
||||
},
|
||||
page: {
|
||||
total: 0,
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
},
|
||||
data: [],
|
||||
});
|
||||
|
||||
const loadData = async () => {
|
||||
state.loading = true;
|
||||
await sleep(500);
|
||||
state.data = [
|
||||
{ id: 1, name: '张三', sex: 1, datetime: '2014-12-01 12:00:00', address: '云南省昆明市经开区', code: '530128' },
|
||||
{ id: 2, name: '李四', sex: 2, datetime: '2025-01-01 12:34:00', address: '云南省昆明市经开区' },
|
||||
{ id: 3, name: '张三', sex: 1, datetime: '2024-12-01 14:00:00', address: '云南省昆明市经开区云南省昆明市经开区' },
|
||||
{ id: 4, name: '李四', sex: 2, datetime: '2025-12-01 15:00:00', address: '云南省昆明市经开区' },
|
||||
];
|
||||
state.page = {
|
||||
total: 20,
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
};
|
||||
state.loading = false;
|
||||
};
|
||||
|
||||
loadData();
|
||||
|
||||
// 默认排序
|
||||
const sortChange = (val) => {
|
||||
console.log('sort==', val);
|
||||
// app.$message.success(JSON.stringify(val));
|
||||
};
|
||||
|
||||
// 选择
|
||||
const selectionChange = (rows) => {
|
||||
console.log('selectionChange=', rows);
|
||||
state.selection = rows;
|
||||
};
|
||||
|
||||
// 搜索
|
||||
const searchChange = (params, done) => {
|
||||
console.log('search==', params);
|
||||
if (done) done();
|
||||
state.query = params;
|
||||
state.page.currentPage = 1;
|
||||
loadData();
|
||||
app.$message.success('搜索成功');
|
||||
};
|
||||
|
||||
// 刷新
|
||||
const refreshChange = () => {
|
||||
loadData();
|
||||
app.$message.success('刷新成功');
|
||||
};
|
||||
|
||||
// row
|
||||
const rowClick = (row, event, column) => {
|
||||
app.$message.success(JSON.stringify(row));
|
||||
};
|
||||
|
||||
// 新增
|
||||
const rowSave = (row, done, loading) => {
|
||||
// loading.value = true;
|
||||
console.log('add=', row);
|
||||
};
|
||||
|
||||
// 编辑
|
||||
const rowUpdate = (row, index, done, loading) => {
|
||||
// loading.value = true;
|
||||
// done(row);
|
||||
console.log('update=', row);
|
||||
};
|
||||
|
||||
// 删除
|
||||
const rowDel = (row, index, done) => {
|
||||
app
|
||||
.$confirm(`您确定要删除?`, '确定删除', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
})
|
||||
.then(() => {
|
||||
console.log('del=', row);
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
const onDel = () => {};
|
||||
</script>
|
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div style="width: 100%; height: 100%">
|
||||
<div>sub-admin</div>
|
||||
<div>运营服务</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup name="home"></script>
|
||||
|
Loading…
x
Reference in New Issue
Block a user