mirrors/pig-ui
1
0
Fork 0
mirror of https://gitee.com/log4j/pig-ui.git synced 2025-01-03 23:42:23 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

ref: 重构日程

Browse Source
This commit is contained in:
lbw 2023-03-06 21:44:34 +08:00
parent 57e454476e
commit 99b5437d25
8 changed files with 114 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/views/home/i18n/en.ts Normal file
View File

@ -0,0 +1,10 @@
export default {
home: {
addFavoriteRoutesTip: 'no data , right click on the tab to favorite',
quickNavigationToolsTip: 'quick navigation bar',
systemLogsTip: 'system logs',
auditLogsTip: 'audit logs',
moreTip: 'more',
newsletterTip: 'news letter',
},
};

10
src/views/home/i18n/zh-cn.ts Normal file
View File

@ -0,0 +1,10 @@
export default {
home: {
addFavoriteRoutesTip: '暂无数据,标签页右键收藏',
quickNavigationToolsTip: '快捷导航栏',
systemLogsTip: '系统日志',
auditLogsTip: '审计日志',
moreTip: '更多',
newsletterTip: '站内信',
},
};

116
src/views/home/index.vue
View File

@ -3,6 +3,7 @@
<el-row :gutter="10">
<el-col :span="16">
<el-row :gutter="10">
<!-- 基本信息 -->
<el-col :span="24">
<div class="home-card-item" v-loading="userLoading">
<el-row>
@ -15,12 +16,12 @@
</el-col>
<el-col :span="4" :offset="14"> {{ formatDate(date, 'YYYY-mm-dd HH:MM:SS') }} </el-col>
</el-row>
<!-- {{ userData }}-->
</div>
</el-col>
<!-- 快捷导航栏 -->
<el-col :span="24">
<div class="home-card-item">
<div class="home-card-item-title">快捷导航工具</div>
<div class="home-card-item-title">{{ $t('home.quickNavigationToolsTip') }}</div>
<div class="home-monitor">
<div class="flex-warp" v-if="favoriteRoutes.length > 0">
<div class="flex-warp-item" v-for="(v, k) in favoriteRoutes" :key="k">
@ -34,16 +35,17 @@
</div>
</div>
</div>
<el-empty v-else />
<el-empty :description="$t('home.addFavoriteRoutesTip')" v-else />
</div>
</div>
</el-col>
<!-- 系统日志 -->
<el-col :span="12">
<el-card class="box-card">
<template #header>
<div class="card-header">
<span>系统日志</span>
<el-button link class="button" text @click="handleRoutr('log')">更多</el-button>
<span>{{ $t('home.systemLogsTip') }}</span>
<el-button link class="button" text @click="handleRoutr('log')">{{ $t('home.moreTip') }}</el-button>
</div>
</template>
<el-timeline v-if="logState.dataList.length > 0">
@ -53,12 +55,13 @@
</el-timeline>
</el-card>
</el-col>
<!-- 审计日志 -->
<el-col :span="12">
<el-card class="box-card">
<template #header>
<div class="card-header">
<span>审计日志</span>
<el-button link class="button" text @click="handleRoutr('audit')">更多</el-button>
<span>{{ $t('home.auditLogsTip') }}</span>
<el-button link class="button" text @click="handleRoutr('audit')">{{ $t('home.moreTip') }}</el-button>
</div>
</template>
<el-timeline v-if="auditState.dataList.length > 0">
@ -73,38 +76,27 @@
</el-col>
<el-col :span="8">
<el-row>
<!-- 日程 -->
<el-col :span="24">
<el-card class="box-card">
<el-calendar v-model="calendar">
<template #date-cell="{ data }">
<div
:class="data.isSelected ? 'is-selected' : ''"
style="width: 100%; height: 100%"
@click="scheduleFormRef.openDialog(null, { date: formatDate(data.date, 'YYYY-mm-dd') })"
>
{{ data.day.split('-').slice(1).join('-') }}
<ul class="events">
<li v-for="item in getListData(data.date)" :key="item.content">
<el-badge :value="item.title" :is-dot="true" />
{{ item.title }}
</li>
</ul>
<div style="width: 100%; height: 100%" @click="handleSchedule(data)">
{{ data.day.split('-').slice(2).join('-') }}
<span v-if="filterCellSelected(data)">
<el-icon><BellFilled /></el-icon>
</span>
</div>
</template>
</el-calendar>
<el-timeline style="margin-top: 20px" v-if="scheduleDataList.length > 0">
<el-timeline-item v-for="(item, index) in scheduleDataList" :key="index" :timestamp="item.time">
{{ item.title }} - {{ item.createBy }}
</el-timeline-item>
</el-timeline>
<el-empty v-else />
</el-card>
</el-col>
<!-- -->
<el-col :span="24">
<el-card class="box-card">
<template #header>
<div class="card-header">
<span>站内信</span>
<span>{{ $t('home.newsletterTip') }}</span>
</div>
</template>
<el-timeline v-if="newsList.length > 0">
@ -118,13 +110,16 @@
</el-row>
</el-col>
</el-row>
<schedule-form ref="scheduleFormRef" @refresh="() => {}"></schedule-form>
<!-- 新增日程的表单 -->
<schedule-form ref="scheduleFormRef" @refresh="initscheduleList(formatDate(calendar, 'YYYY-mm'))" />
<!-- 日程查询 -->
<schedule ref="scheduleRef" />
</div>
</template>
<script setup lang="ts" name="home">
import { storeToRefs } from 'pinia';
import { useThemeConfig } from '/@/stores/themeConfig';
import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
import { useRouter } from 'vue-router';
import { useUserInfo } from '/@/stores/userInfo';
@ -132,16 +127,26 @@ import { useMsg } from '/@/stores/msg';
import { BasicTableProps, useTable } from '/@/hooks/table';
import { pageList } from '/@/api/admin/log';
import { fetchList } from '/@/api/admin/audit';
import { formatDate } from '/@/utils/formatTime';
import { formatDate, parseDate } from '/@/utils/formatTime';
import { getObj } from '/@/api/admin/user';
import { list } from '/@/api/admin/schedule';
const ScheduleForm = defineAsyncComponent(() => import('/@/views/home/schedule/form.vue'));
const Schedule = defineAsyncComponent(() => import('/@/views/home/schedule/index.vue'));
const router = useRouter();
const storesTagsViewRoutes = useTagsViewRoutes();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const { isTagsViewCurrenFull, favoriteRoutes } = storeToRefs(storesTagsViewRoutes);
const { favoriteRoutes } = storeToRefs(storesTagsViewRoutes);
const userLoading = ref(false);
const date = ref(new Date());
const scheduleFormRef = ref();
const scheduleRef = ref();
const calendar = ref(new Date());
const userData = ref({} as any);
const scheduleDataList = ref([] as any);
const ScheduleForm = defineAsyncComponent(() => import('/@/views/admin/schedule/form.vue'));
const newsList = computed(() => {
return useMsg().getAllMsg();
});
const HandleRoute = (item: any) => {
router.push(item.path);
@ -151,11 +156,6 @@ const handleCloseFavorite = (item: any) => {
storesTagsViewRoutes.delFavoriteRoutes(item);
};
const userLoading = ref(false);
const date = ref(new Date());
const scheduleFormRef = ref();
setInterval(() => {
date.value = new Date();
}, 1000);
@ -172,17 +172,15 @@ const logState: BasicTableProps = reactive<BasicTableProps>({
},
});
useTable(logState);
const auditState: BasicTableProps = reactive<BasicTableProps>({
queryForm: {},
pageList: fetchList,
descs: ['create_time'],
});
useTable(auditState);
useTable(logState);
const calendar = ref(new Date());
useTable(auditState);
watch(calendar, (val, oldval) => {
const newVal = formatDate(val, 'YYYY-mm');
@ -192,12 +190,6 @@ watch(calendar, (val, oldval) => {
}
});
// 定义变量内容
const userData = ref({} as any);
const newsList = computed(() => {
return useMsg().getAllMsg();
});
onMounted(() => {
const data = useUserInfo().userInfos;
initUserInfo(data.user.userId);
@ -216,20 +208,11 @@ const handleRoutr = (type) => {
}
};
const getListData = (date: any) => {
console.log(date, 'dadadadad');
const dataTime = formatDate(date, 'YYYY-mm-dd');
return scheduleDataList.value.filter((item) => {
return item.date === dataTime;
});
};
const initUserInfo = (userId: any) => {
userLoading.value = true;
getObj(userId)
.then((res) => {
userData.value = res.data;
console.log(res.data, 'data');
userData.value.postName = res.data.postList
.map((item) => {
return item.postName;
@ -241,8 +224,6 @@ const initUserInfo = (userId: any) => {
});
};
const scheduleDataList = ref([] as any);
const initscheduleList = (date) => {
list({
month: `${date}-01`,
@ -250,6 +231,23 @@ const initscheduleList = (date) => {
scheduleDataList.value = res.data;
});
};
const filterCellSelected = (data) => {
return (
scheduleDataList.value.filter((item) => {
return item.date.indexOf(data.day) >= 0;
}).length > 0
);
};
const handleSchedule = (data) => {
//如果当前日期下日程为空则打开form
if (filterCellSelected(data)) {
scheduleRef.value.open({ date: parseDate(data.date, null) });
} else {
scheduleFormRef.value.openDialog(null, { date: parseDate(data.date, null) });
}
};
</script>
<style scoped lang="scss">

3
src/views/home/schedule/calendar.vue Normal file
View File

@ -0,0 +1,3 @@
<template></template>
<script setup lang="ts" name="SysScheduleCakebdar"></script>

2
src/views/admin/schedule/form.vue → src/views/home/schedule/form.vue
View File

@ -25,7 +25,7 @@
</el-col>
<el-col :span="12" class="mb20">
<el-form-item :label="t('schedule.date')" prop="date">
<el-date-picker type="datetime" :placeholder="t('schedule.inputDateTip')" v-model="form.date" :value-format="dateStr"></el-date-picker>
<el-date-picker type="date" :placeholder="t('schedule.inputDateTip')" v-model="form.date" :value-format="dateStr"></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">

0
src/views/admin/schedule/i18n/en.ts → src/views/home/schedule/i18n/en.ts
View File

2
src/views/admin/schedule/i18n/zh-cn.ts → src/views/home/schedule/i18n/zh-cn.ts
View File

@ -4,7 +4,7 @@ export default {
importsysScheduleTip: '导入日程',
id: 'id',
title: '标题',
type: '日程类型',
type: '类型',
state: '状态',
content: '内容',
time: '时间',

43
src/views/admin/schedule/index.vue → src/views/home/schedule/index.vue
View File

@ -1,17 +1,19 @@
<template>
<div class="layout-padding">
<el-drawer v-model="visible" title="日程管理" size="80%">
<div class="layout-padding-auto layout-padding-view">
<el-row v-show="showSearch" class="mb8">
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
<el-form-item :label="t('schedule.date')" prop="date">
<el-date-picker
type="date"
:placeholder="t('schedule.inputDateTip')"
v-model="state.queryForm.date"
:value-format="dateStr"
></el-date-picker>
</el-form-item>
<el-form-item :label="$t('schedule.title')" prop="title">
<el-input :placeholder="t('schedule.inputTitleTip')" v-model="state.queryForm.title" style="max-width: 180px" />
</el-form-item>
<el-form-item :label="$t('schedule.type')" prop="type">
<el-input :placeholder="t('schedule.inputTypeTip')" v-model="state.queryForm.type" style="max-width: 180px" />
</el-form-item>
<el-form-item :label="$t('schedule.createBy')" prop="createBy">
<el-input :placeholder="t('schedule.inputCreateByTip')" v-model="state.queryForm.createBy" style="max-width: 180px" />
</el-form-item>
<el-form-item class="ml2">
<el-button formDialogRef icon="search" type="primary" @click="getDataList">
{{ $t('common.queryBtn') }}
@ -22,7 +24,14 @@
</el-row>
<el-row>
<div class="mb8" style="width: 100%">
<el-button formDialogRef icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()" v-auth="'admin_schedule_add'">
<el-button
formDialogRef
icon="folder-add"
type="primary"
class="ml10"
@click="formDialogRef.openDialog(null, state.queryForm)"
v-auth="'admin_schedule_add'"
>
{{ $t('common.addBtn') }}
</el-button>
<el-button formDialogRef icon="Download" type="primary" class="ml10" @click="exportExcel" v-auth="'admin_schedule_export'">
@ -85,7 +94,7 @@
<!-- 编辑、新增 -->
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
</div>
</el-drawer>
</template>
<script setup lang="ts" name="systemSysSchedule">
@ -100,10 +109,10 @@ const { schedule_type, schedule_status } = useDict('schedule_type', 'schedule_st
// 引入组件
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
const { t } = useI18n();
// 定义查询字典
// 定义变量内容
const formDialogRef = ref();
const visible = ref(false);
// 搜索变量
const queryRef = ref();
const showSearch = ref(true);
@ -113,6 +122,7 @@ const multiple = ref(true);
const state: BasicTableProps = reactive<BasicTableProps>({
queryForm: {},
createdIsNeed: false,
pageList: fetchList,
});
@ -156,4 +166,15 @@ const handleDelete = (ids: string[]) => {
});
});
};
const open = (row: any) => {
state.queryForm.date = row.date;
getDataList();
visible.value = true;
};
// 暴露变量
defineExpose({
open,
});
</script>