1、调整待办，跳转到具体的处理页面
2、增加学生请假的审批页面
This commit is contained in:
ywyonui
parent
60cf660a05
commit
0ee8dc2d18
@ -80,3 +80,24 @@ export const jsdXkXsListApi = async (params: any) => {
|
||||
export const jsdXkdmListApi = async (params: any) => {
|
||||
return await post("/mobile/js/xkdm/add", params);
|
||||
};
|
||||
|
||||
// 获取待办列表
|
||||
export const dbListApi = async (params: any) => {
|
||||
return await get("/api/db/findPage", params);
|
||||
};
|
||||
|
||||
// 处理待办
|
||||
export const dbBlApi = async (params: any) => {
|
||||
return await post("/api/db/bl", params);
|
||||
};
|
||||
|
||||
// 查询学生请假信息
|
||||
export const xsQjFindByIdApi = async (params: any) => {
|
||||
return await get("/api/xsQj/findById", params);
|
||||
};
|
||||
|
||||
// 学生请假审批
|
||||
export const xsQjSpApi = async (params: any) => {
|
||||
return await post("/api/xsQj/sp", params);
|
||||
};
|
||||
|
||||
|
||||
@ -3,9 +3,9 @@ import { get, post } from "@/utils/request";
|
||||
|
||||
//密码登录接口
|
||||
export const loginPass = async (param: {
|
||||
username: string;
|
||||
password: string;
|
||||
openId: number | string;
|
||||
username?: string;
|
||||
password?: string;
|
||||
openId?: number | string;
|
||||
}) => {
|
||||
return await post(
|
||||
"/userlogin/check?username=" +
|
||||
@ -19,9 +19,9 @@ export const loginPass = async (param: {
|
||||
};
|
||||
//验证码登录接口
|
||||
export const loginCode = async (param: {
|
||||
phone: string | number;
|
||||
code: string | number;
|
||||
openId: number | string;
|
||||
phone?: string | number;
|
||||
code?: string | number;
|
||||
openId?: number | string;
|
||||
}) => {
|
||||
return await post("/open/sms/checkCode", param);
|
||||
};
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
const ip: string = "192.168.239.1:8897";
|
||||
const ip: string = "127.0.0.1:8897";
|
||||
// const ip: string = "yufangzc.com";
|
||||
const fwqip: string = "yufangzc.com";
|
||||
//打包服务器接口代理标识
|
||||
|
||||
@ -423,6 +423,13 @@
|
||||
"navigationBarTitleText": "学生点名",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/base/xs/qj/sp",
|
||||
"style": {
|
||||
"navigationBarTitleText": "学生请假审批",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}
|
||||
],
|
||||
"globalStyle": {
|
||||
|
||||
@ -5,15 +5,15 @@
|
||||
<view class="tabs-container">
|
||||
<view
|
||||
class="tab-item"
|
||||
:class="{ active: currentTab === 1 }"
|
||||
@click="changeTab(1)"
|
||||
:class="{ active: currentTab === 'A' }"
|
||||
@click="changeTab('A')"
|
||||
>
|
||||
待办
|
||||
</view>
|
||||
<view
|
||||
class="tab-item"
|
||||
:class="{ active: currentTab === 0 }"
|
||||
@click="changeTab(0)"
|
||||
:class="{ active: currentTab === 'B' }"
|
||||
@click="changeTab('B')"
|
||||
>
|
||||
已办
|
||||
</view>
|
||||
@ -22,20 +22,15 @@
|
||||
<template #default="{ data }">
|
||||
<view class="white-bg-color r-md p-15 mb-15 flex-row" @click="goToDetail(data)">
|
||||
<view class="card-left">
|
||||
<view class="card-title">{{ data.rwmc }}</view>
|
||||
<view class="card-desc" v-html="data.rwms"></view>
|
||||
<view class="card-title">{{ data.dbBt }}</view>
|
||||
<view class="card-desc" v-html="data.dbZy"></view>
|
||||
<view class="card-meta">
|
||||
<text>{{ data.fbsj }}</text>
|
||||
<text>{{ data.timeAgo }}</text>
|
||||
<text>{{ data.createdTime }}</text>
|
||||
<text>{{ getTimeAgo(data.createdTime) }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="card-right">
|
||||
<view class="tag" :class="data.tagType">{{ data.tagText }}</view>
|
||||
<view class="stats">
|
||||
<!-- TODO: 替换为实际图标 -->
|
||||
<text class="icon">❤️ {{ data.likes }}</text>
|
||||
<text class="icon">💬 {{ data.comments }}</text>
|
||||
</view>
|
||||
<view class="card-right" v-if="dbLxMap[data.dbLx]">
|
||||
<view class="tag" :class="dbLxMap[data.dbLx].className">{{ dbLxMap[data.dbLx].label }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
@ -44,101 +39,77 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {ref, reactive, watch, onMounted} from "vue";
|
||||
import {ref, onMounted} from "vue";
|
||||
import { useLayout } from "@/components/BasicListLayout/hooks/useLayout";
|
||||
import { dbListApi } from "@/api/base/server";
|
||||
import { dicApi } from "@/api/system/dic";
|
||||
import { getTimeAgo } from "@/utils/dateUtils";
|
||||
import { useUserStore } from "@/store/modules/user";
|
||||
import { useDataStore } from "@/store/modules/data";
|
||||
const { setDb } = useDataStore();
|
||||
const { getUser } = useUserStore();
|
||||
|
||||
import {useLayout} from "@/components/BasicListLayout/hooks/useLayout";
|
||||
import {jsdFindPageTaskApi} from "@/api/base/server";
|
||||
const dbLxMap = ref<any>({});
|
||||
|
||||
// 模拟待办列表数据
|
||||
const mockTodoList = [
|
||||
{
|
||||
title: "教务通知 (待办)",
|
||||
desc: "学校召开期初教学准备会议暨首次教学工作例会",
|
||||
date: "2025-02-17",
|
||||
timeAgo: "8 mins 前",
|
||||
tagText: "通知",
|
||||
tagType: "notice",
|
||||
likes: 6,
|
||||
comments: 12,
|
||||
},
|
||||
{
|
||||
title: "教学日志 (待办)",
|
||||
desc: "请于2025年3月15日前上传教学日志",
|
||||
date: "2025-02-17",
|
||||
timeAgo: "8 mins 前",
|
||||
tagText: "任务",
|
||||
tagType: "task",
|
||||
likes: 6,
|
||||
comments: 12,
|
||||
},
|
||||
];
|
||||
|
||||
const testList = async (param: any): Promise<Requests<any>> => {
|
||||
return new Promise((resolve) => {
|
||||
setTimeout(() => {
|
||||
resolve({message: "测试", resultCode: 1, rows: mockTodoList});
|
||||
}, 1000);
|
||||
});
|
||||
// 获取待办类型
|
||||
const fetchDbLxMap = async () => {
|
||||
try {
|
||||
// 待办类型
|
||||
const res = await dicApi({pid: 186148807});
|
||||
if (res && res.result) {
|
||||
// 将res.result的list转换成对象，key为dictionaryValue，value为dictionary
|
||||
dbLxMap.value = res.result.reduce((acc: any, item: any) => {
|
||||
acc[item.dictionaryCode] = {
|
||||
value: item.dictionaryCode,
|
||||
label: item.dictionaryValue,
|
||||
className: item.remark
|
||||
};
|
||||
return acc;
|
||||
}, {});
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("获取状态选项失败", error);
|
||||
// 使用默认状态
|
||||
dbLxMap.value = {};
|
||||
}
|
||||
};
|
||||
|
||||
const [register, {reload, setParam}] = useLayout({
|
||||
api: jsdFindPageTaskApi,
|
||||
api: dbListApi,
|
||||
componentProps: {
|
||||
auto: false
|
||||
},
|
||||
});
|
||||
|
||||
const currentTab = ref(1); // 0: 待办, 1: 已办
|
||||
const currentTab = ref('A'); // 0: 待办, 1: 已办
|
||||
|
||||
const fetchListData = async (tabIndex: number) => {
|
||||
const fetchListData = async (tabIndex: string) => {
|
||||
setParam({
|
||||
type: tabIndex,
|
||||
mobile: getUser.mobile
|
||||
dbZt: tabIndex,
|
||||
userId: getUser.id
|
||||
});
|
||||
reload();
|
||||
};
|
||||
|
||||
const changeTab = (tabIndex: number) => {
|
||||
const changeTab = (tabIndex: string) => {
|
||||
if (currentTab.value !== tabIndex) {
|
||||
currentTab.value = tabIndex;
|
||||
fetchListData(tabIndex);
|
||||
}
|
||||
};
|
||||
import {useUserStore} from "@/store/modules/user";
|
||||
|
||||
const {getUser} = useUserStore()
|
||||
// 组件加载完成后，获取初始数据 (待办)
|
||||
onMounted(() => {
|
||||
fetchDbLxMap();
|
||||
fetchListData(currentTab.value);
|
||||
});
|
||||
|
||||
const goToDetail = (data: any) => {
|
||||
// if (currentTab.value != 1) {
|
||||
// return;
|
||||
// }
|
||||
// if(true){
|
||||
// const encodedTitle = encodeURIComponent("教学日志 (待办)");
|
||||
// uni.navigateTo({
|
||||
// url: `/pages/base/message/detail?id=${encodedTitle}`
|
||||
// });
|
||||
// return;
|
||||
// }
|
||||
// Ensure data and data.id exist before navigating
|
||||
if (data && data.id) {
|
||||
// Encode the ID in case it contains special characters
|
||||
setDb(data);
|
||||
uni.navigateTo({
|
||||
url: `/pages/base/message/detail?id=${data.id}`
|
||||
url: data.mobileUrl
|
||||
});
|
||||
} else if (data && data.rwmc) {
|
||||
// Fallback: use title if id is missing (less reliable)
|
||||
console.warn("Navigating using title as ID fallback for:", data);
|
||||
const encodedTitle = encodeURIComponent(data.title);
|
||||
uni.navigateTo({
|
||||
url: `/pages/base/message/detail?id=${encodedTitle}`
|
||||
});
|
||||
} else {
|
||||
console.error("Cannot navigate to detail: Missing identifier (id or title) in data:", data);
|
||||
uni.showToast({title: "无法打开详情", icon: "none"});
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -258,6 +229,7 @@ const goToDetail = (data: any) => {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
line-clamp: 2;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
@ -265,10 +237,8 @@ const goToDetail = (data: any) => {
|
||||
.card-meta {
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
|
||||
text {
|
||||
margin-right: 10px;
|
||||
}
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
@ -278,26 +248,29 @@ const goToDetail = (data: any) => {
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
flex-shrink: 0; // 防止被压缩
|
||||
flex: 0 0 75px;
|
||||
|
||||
.tag {
|
||||
padding: 5px 10px;
|
||||
border-radius: 4px;
|
||||
font-size: 13px;
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
margin-bottom: 10px;
|
||||
white-space: nowrap;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 1 0 1px;
|
||||
width: 100%;
|
||||
|
||||
&.notice {
|
||||
&.db-xs-qj {
|
||||
background-color: #447ade;
|
||||
}
|
||||
|
||||
&.task {
|
||||
&.db-js-qj {
|
||||
background-color: #19be6b;
|
||||
}
|
||||
|
||||
// 添加新的标签样式示例
|
||||
&.approval {
|
||||
&.db-task {
|
||||
background-color: #ff9f0a; // 橙色
|
||||
}
|
||||
|
||||
|
||||
238
src/pages/base/xs/qj/sp.vue
Normal file
238
src/pages/base/xs/qj/sp.vue
Normal file
@ -0,0 +1,238 @@
|
||||
<template>
|
||||
<BasicLayout>
|
||||
<view class="qj-detail">
|
||||
<!-- 请假信息卡片 -->
|
||||
<view class="info-card">
|
||||
<view class="card-header">
|
||||
<text class="applicant-name" v-if="dbFlag">{{ dbData.dbZy }}</text>
|
||||
<text class="applicant-name" v-if="dbFlag">学生{{ qjData.xsxm }}的请假申请</text>
|
||||
</view>
|
||||
<view class="divider"></view>
|
||||
<view class="card-body">
|
||||
<view class="info-row">
|
||||
<text class="label">请假类型:</text>
|
||||
<text class="value">{{ qjData.qjlx }}</text>
|
||||
</view>
|
||||
<view class="info-row">
|
||||
<text class="label">开始时间:</text>
|
||||
<text class="value">{{ qjData.qjkstime }}</text>
|
||||
</view>
|
||||
<view class="info-row">
|
||||
<text class="label">结束时间:</text>
|
||||
<text class="value">{{ qjData.qjjstime }}</text>
|
||||
</view>
|
||||
<view class="info-row">
|
||||
<text class="label">请假时长:</text>
|
||||
<text class="value">{{ qjData.qjsc }}</text>
|
||||
</view>
|
||||
<view class="info-row">
|
||||
<text class="label">是否离校:</text>
|
||||
<text class="value">{{ qjData.sflx === 1 ? '是' : '否' }}</text>
|
||||
</view>
|
||||
<view class="info-column">
|
||||
<text class="label">请假事由:</text>
|
||||
<text class="value">{{ qjData.qjsy }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 请假信息卡片 -->
|
||||
<view class="info-card">
|
||||
<view class="card-header">
|
||||
<text class="applicant-name">审批意见</text>
|
||||
</view>
|
||||
<view class="divider"></view>
|
||||
<BasicForm @register="register" />
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<template #bottom>
|
||||
<view class="white-bg-color py-5">
|
||||
<view class="flex-row items-center pb-10 pt-5">
|
||||
<u-button
|
||||
text="取消"
|
||||
class="ml-15 mr-7"
|
||||
:plain="true"
|
||||
@click="navigateBack"
|
||||
/>
|
||||
<u-button
|
||||
text="提交"
|
||||
class="mr-15 mr-7"
|
||||
type="primary"
|
||||
@click="submit"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</BasicLayout>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onLoad } from "@dcloudio/uni-app";
|
||||
import { useForm } from "@/components/BasicForm/hooks/useForm";
|
||||
import { navigateBack } from "@/utils/uniapp";
|
||||
import { xsQjFindByIdApi, xsQjSpApi, dbBlApi } from "@/api/base/server";
|
||||
import { useDataStore } from "@/store/modules/data";
|
||||
const { getData, getDb, setData } = useDataStore();
|
||||
|
||||
const dbFlag = ref(false);
|
||||
|
||||
const [register, { getValue }] = useForm({
|
||||
schema: [
|
||||
{
|
||||
field: "flag",
|
||||
label: "审批意见",
|
||||
component: "BasicCheckbox",
|
||||
required: true,
|
||||
itemProps: {
|
||||
labelPosition: "top",
|
||||
},
|
||||
componentProps: {
|
||||
data: [
|
||||
{ value: 0, text: "同意" },
|
||||
{ value: 1, text: "拒绝" },
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: "comment",
|
||||
label: "审批说明",
|
||||
component: "BasicInput",
|
||||
required: true,
|
||||
itemProps: {
|
||||
labelPosition: "top",
|
||||
},
|
||||
componentProps: {
|
||||
type: "textarea",
|
||||
},
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
// 请假基础数据
|
||||
const qjData = computed(() => getData || {});
|
||||
const dbData = computed(() => getDb || {});
|
||||
|
||||
const submit = async () => {
|
||||
const data = await getValue();
|
||||
const params = { ...qjData.value };
|
||||
params.flag = data.flag;
|
||||
params.comment = data.comment;
|
||||
uni.showLoading({
|
||||
title: "提交中...",
|
||||
});
|
||||
const res = await xsQjSpApi(params);
|
||||
// 如果是待办项，更新待办项状态
|
||||
if (dbFlag.value) {
|
||||
await dbBlApi({ id: dbData.value.id });
|
||||
}
|
||||
uni.hideLoading();
|
||||
navigateBack();
|
||||
};
|
||||
|
||||
onLoad(async (data: any) => {
|
||||
// 从待办过来的，需要从后端获取数据
|
||||
if (data && data.from && data.from == "db") {
|
||||
dbFlag.value = true;
|
||||
const res = await xsQjFindByIdApi({ id: data.id });
|
||||
nextTick(() => {
|
||||
setData(res.result);
|
||||
});
|
||||
} else {
|
||||
dbFlag.value = false;
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.qj-detail {
|
||||
background-color: #f5f7fa;
|
||||
}
|
||||
|
||||
.info-card {
|
||||
margin: 15px;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
padding: 15px;
|
||||
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
|
||||
|
||||
.card-header {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.applicant-name {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
|
||||
.divider {
|
||||
height: 1px;
|
||||
background-color: #eee;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
|
||||
.card-body {
|
||||
padding: 15px;
|
||||
|
||||
.info-row {
|
||||
display: flex;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.label {
|
||||
font-size: 14px;
|
||||
color: #bbb;
|
||||
width: 70px;
|
||||
flex-shrink: 0;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.value {
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
.info-column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.label {
|
||||
font-size: 14px;
|
||||
color: #bbb;
|
||||
flex-shrink: 0;
|
||||
margin-right: 8px;
|
||||
width: 100%;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.value {
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.bottom-action {
|
||||
padding: 15px;
|
||||
margin-top: 20px;
|
||||
|
||||
.back-btn {
|
||||
width: 100%;
|
||||
height: 44px;
|
||||
line-height: 44px;
|
||||
background-color: #fff;
|
||||
color: #333;
|
||||
border-radius: 22px;
|
||||
font-size: 16px;
|
||||
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -4,6 +4,7 @@ export const useDataStore = defineStore({
|
||||
id: "data",
|
||||
state: () => ({
|
||||
data: {},
|
||||
db: {},
|
||||
global: {},
|
||||
file: {},
|
||||
}),
|
||||
@ -11,6 +12,9 @@ export const useDataStore = defineStore({
|
||||
getData(): any {
|
||||
return this.data;
|
||||
},
|
||||
getDb(): any {
|
||||
return this.db;
|
||||
},
|
||||
getGlobal(): any {
|
||||
return this.global;
|
||||
},
|
||||
@ -22,6 +26,9 @@ export const useDataStore = defineStore({
|
||||
setData(data: any) {
|
||||
this.data = data;
|
||||
},
|
||||
setDb(data: any) {
|
||||
this.db = data;
|
||||
},
|
||||
setGlobal(data: any) {
|
||||
this.global = data;
|
||||
},
|
||||
|
||||
27
src/utils/dateUtils.ts
Normal file
27
src/utils/dateUtils.ts
Normal file
@ -0,0 +1,27 @@
|
||||
import dayjs from "dayjs";
|
||||
const getTimeAgo = (time: string) => {
|
||||
const now = dayjs();
|
||||
const inputTime = dayjs(time);
|
||||
const diffInSeconds = now.diff(inputTime, 'second');
|
||||
|
||||
if (diffInSeconds < 60) {
|
||||
return `${diffInSeconds}秒前`;
|
||||
}
|
||||
|
||||
const diffInMinutes = Math.floor(diffInSeconds / 60);
|
||||
if (diffInMinutes < 60) {
|
||||
return `${diffInMinutes}分钟前`;
|
||||
}
|
||||
|
||||
const diffInHours = Math.floor(diffInMinutes / 60);
|
||||
if (diffInHours < 24) {
|
||||
return `${diffInHours}小时前`;
|
||||
}
|
||||
|
||||
const diffInDays = Math.floor(diffInHours / 24);
|
||||
return `${diffInDays}天前`;
|
||||
};
|
||||
|
||||
export {
|
||||
getTimeAgo
|
||||
};
|
||||
Loading…
x
Reference in New Issue
Block a user