Compare commits
No commits in common. 'main' and 'master' have entirely different histories.
@ -0,0 +1,4 @@
|
|||||||
|
# 开发环境
|
||||||
|
VITE_APP_TITLE=教室智能人脸考勤系统(开发)
|
||||||
|
VITE_API_BASE_URL=http://10.23.22.43:8088/api
|
||||||
|
VITE_WS_URL=ws://localhost:8080/ws
|
||||||
@ -0,0 +1,4 @@
|
|||||||
|
# 生产环境
|
||||||
|
VITE_APP_TITLE=教室智能人脸考勤系统
|
||||||
|
VITE_API_BASE_URL=https://api.yourschool.com/api
|
||||||
|
VITE_WS_URL=wss://api.yourschool.com/ws
|
||||||
@ -0,0 +1,28 @@
|
|||||||
|
# dependencies
|
||||||
|
node_modules/
|
||||||
|
|
||||||
|
# build output
|
||||||
|
dist/
|
||||||
|
|
||||||
|
# IDE
|
||||||
|
.vscode/
|
||||||
|
.idea/
|
||||||
|
*.swp
|
||||||
|
*.swo
|
||||||
|
*~
|
||||||
|
|
||||||
|
# OS
|
||||||
|
.DS_Store
|
||||||
|
Thumbs.db
|
||||||
|
|
||||||
|
# env
|
||||||
|
.env
|
||||||
|
.env.local
|
||||||
|
.env.*.local
|
||||||
|
|
||||||
|
# logs
|
||||||
|
*.log
|
||||||
|
npm-debug.log*
|
||||||
|
|
||||||
|
# cache
|
||||||
|
.cache/
|
||||||
@ -0,0 +1,7 @@
|
|||||||
|
# 信任这些特定包的构建脚本
|
||||||
|
only-built-dependencies[]=@parcel/watcher
|
||||||
|
only-built-dependencies[]=esbuild
|
||||||
|
only-built-dependencies[]=vue-demi
|
||||||
|
|
||||||
|
# 或者，如果你想允许所有包运行脚本（不推荐，安全性较低）
|
||||||
|
# ignore-scripts=false
|
||||||
@ -0,0 +1,593 @@
|
|||||||
|
import {
|
||||||
|
add_location_default,
|
||||||
|
aim_default,
|
||||||
|
alarm_clock_default,
|
||||||
|
apple_default,
|
||||||
|
arrow_down_bold_default,
|
||||||
|
arrow_down_default,
|
||||||
|
arrow_left_bold_default,
|
||||||
|
arrow_left_default,
|
||||||
|
arrow_right_bold_default,
|
||||||
|
arrow_right_default,
|
||||||
|
arrow_up_bold_default,
|
||||||
|
arrow_up_default,
|
||||||
|
avatar_default,
|
||||||
|
back_default,
|
||||||
|
baseball_default,
|
||||||
|
basketball_default,
|
||||||
|
bell_default,
|
||||||
|
bell_filled_default,
|
||||||
|
bicycle_default,
|
||||||
|
bottom_default,
|
||||||
|
bottom_left_default,
|
||||||
|
bottom_right_default,
|
||||||
|
bowl_default,
|
||||||
|
box_default,
|
||||||
|
briefcase_default,
|
||||||
|
brush_default,
|
||||||
|
brush_filled_default,
|
||||||
|
burger_default,
|
||||||
|
calendar_default,
|
||||||
|
camera_default,
|
||||||
|
camera_filled_default,
|
||||||
|
caret_bottom_default,
|
||||||
|
caret_left_default,
|
||||||
|
caret_right_default,
|
||||||
|
caret_top_default,
|
||||||
|
cellphone_default,
|
||||||
|
chat_dot_round_default,
|
||||||
|
chat_dot_square_default,
|
||||||
|
chat_line_round_default,
|
||||||
|
chat_line_square_default,
|
||||||
|
chat_round_default,
|
||||||
|
chat_square_default,
|
||||||
|
check_default,
|
||||||
|
checked_default,
|
||||||
|
cherry_default,
|
||||||
|
chicken_default,
|
||||||
|
chrome_filled_default,
|
||||||
|
circle_check_default,
|
||||||
|
circle_check_filled_default,
|
||||||
|
circle_close_default,
|
||||||
|
circle_close_filled_default,
|
||||||
|
circle_plus_default,
|
||||||
|
circle_plus_filled_default,
|
||||||
|
clock_default,
|
||||||
|
close_bold_default,
|
||||||
|
close_default,
|
||||||
|
cloudy_default,
|
||||||
|
coffee_cup_default,
|
||||||
|
coffee_default,
|
||||||
|
coin_default,
|
||||||
|
cold_drink_default,
|
||||||
|
collection_default,
|
||||||
|
collection_tag_default,
|
||||||
|
comment_default,
|
||||||
|
compass_default,
|
||||||
|
connection_default,
|
||||||
|
coordinate_default,
|
||||||
|
copy_document_default,
|
||||||
|
cpu_default,
|
||||||
|
credit_card_default,
|
||||||
|
crop_default,
|
||||||
|
d_arrow_left_default,
|
||||||
|
d_arrow_right_default,
|
||||||
|
d_caret_default,
|
||||||
|
data_analysis_default,
|
||||||
|
data_board_default,
|
||||||
|
data_line_default,
|
||||||
|
delete_default,
|
||||||
|
delete_filled_default,
|
||||||
|
delete_location_default,
|
||||||
|
dessert_default,
|
||||||
|
discount_default,
|
||||||
|
dish_default,
|
||||||
|
dish_dot_default,
|
||||||
|
document_add_default,
|
||||||
|
document_checked_default,
|
||||||
|
document_copy_default,
|
||||||
|
document_default,
|
||||||
|
document_delete_default,
|
||||||
|
document_remove_default,
|
||||||
|
download_default,
|
||||||
|
drizzling_default,
|
||||||
|
edit_default,
|
||||||
|
edit_pen_default,
|
||||||
|
eleme_default,
|
||||||
|
eleme_filled_default,
|
||||||
|
element_plus_default,
|
||||||
|
expand_default,
|
||||||
|
failed_default,
|
||||||
|
female_default,
|
||||||
|
files_default,
|
||||||
|
film_default,
|
||||||
|
filter_default,
|
||||||
|
finished_default,
|
||||||
|
first_aid_kit_default,
|
||||||
|
flag_default,
|
||||||
|
fold_default,
|
||||||
|
folder_add_default,
|
||||||
|
folder_checked_default,
|
||||||
|
folder_default,
|
||||||
|
folder_delete_default,
|
||||||
|
folder_opened_default,
|
||||||
|
folder_remove_default,
|
||||||
|
food_default,
|
||||||
|
football_default,
|
||||||
|
fork_spoon_default,
|
||||||
|
fries_default,
|
||||||
|
full_screen_default,
|
||||||
|
goblet_default,
|
||||||
|
goblet_full_default,
|
||||||
|
goblet_square_default,
|
||||||
|
goblet_square_full_default,
|
||||||
|
gold_medal_default,
|
||||||
|
goods_default,
|
||||||
|
goods_filled_default,
|
||||||
|
grape_default,
|
||||||
|
grid_default,
|
||||||
|
guide_default,
|
||||||
|
handbag_default,
|
||||||
|
headset_default,
|
||||||
|
help_default,
|
||||||
|
help_filled_default,
|
||||||
|
hide_default,
|
||||||
|
histogram_default,
|
||||||
|
home_filled_default,
|
||||||
|
hot_water_default,
|
||||||
|
house_default,
|
||||||
|
ice_cream_default,
|
||||||
|
ice_cream_round_default,
|
||||||
|
ice_cream_square_default,
|
||||||
|
ice_drink_default,
|
||||||
|
ice_tea_default,
|
||||||
|
info_filled_default,
|
||||||
|
iphone_default,
|
||||||
|
key_default,
|
||||||
|
knife_fork_default,
|
||||||
|
lightning_default,
|
||||||
|
link_default,
|
||||||
|
list_default,
|
||||||
|
loading_default,
|
||||||
|
location_default,
|
||||||
|
location_filled_default,
|
||||||
|
location_information_default,
|
||||||
|
lock_default,
|
||||||
|
lollipop_default,
|
||||||
|
magic_stick_default,
|
||||||
|
magnet_default,
|
||||||
|
male_default,
|
||||||
|
management_default,
|
||||||
|
map_location_default,
|
||||||
|
medal_default,
|
||||||
|
memo_default,
|
||||||
|
menu_default,
|
||||||
|
message_box_default,
|
||||||
|
message_default,
|
||||||
|
mic_default,
|
||||||
|
microphone_default,
|
||||||
|
milk_tea_default,
|
||||||
|
minus_default,
|
||||||
|
money_default,
|
||||||
|
monitor_default,
|
||||||
|
moon_default,
|
||||||
|
moon_night_default,
|
||||||
|
more_default,
|
||||||
|
more_filled_default,
|
||||||
|
mostly_cloudy_default,
|
||||||
|
mouse_default,
|
||||||
|
mug_default,
|
||||||
|
mute_default,
|
||||||
|
mute_notification_default,
|
||||||
|
no_smoking_default,
|
||||||
|
notebook_default,
|
||||||
|
notification_default,
|
||||||
|
odometer_default,
|
||||||
|
office_building_default,
|
||||||
|
open_default,
|
||||||
|
operation_default,
|
||||||
|
opportunity_default,
|
||||||
|
orange_default,
|
||||||
|
paperclip_default,
|
||||||
|
partly_cloudy_default,
|
||||||
|
pear_default,
|
||||||
|
phone_default,
|
||||||
|
phone_filled_default,
|
||||||
|
picture_default,
|
||||||
|
picture_filled_default,
|
||||||
|
picture_rounded_default,
|
||||||
|
pie_chart_default,
|
||||||
|
place_default,
|
||||||
|
platform_default,
|
||||||
|
plus_default,
|
||||||
|
pointer_default,
|
||||||
|
position_default,
|
||||||
|
postcard_default,
|
||||||
|
pouring_default,
|
||||||
|
present_default,
|
||||||
|
price_tag_default,
|
||||||
|
printer_default,
|
||||||
|
promotion_default,
|
||||||
|
quartz_watch_default,
|
||||||
|
question_filled_default,
|
||||||
|
rank_default,
|
||||||
|
reading_default,
|
||||||
|
reading_lamp_default,
|
||||||
|
refresh_default,
|
||||||
|
refresh_left_default,
|
||||||
|
refresh_right_default,
|
||||||
|
refrigerator_default,
|
||||||
|
remove_default,
|
||||||
|
remove_filled_default,
|
||||||
|
right_default,
|
||||||
|
scale_to_original_default,
|
||||||
|
school_default,
|
||||||
|
scissor_default,
|
||||||
|
search_default,
|
||||||
|
select_default,
|
||||||
|
sell_default,
|
||||||
|
semi_select_default,
|
||||||
|
service_default,
|
||||||
|
set_up_default,
|
||||||
|
setting_default,
|
||||||
|
share_default,
|
||||||
|
ship_default,
|
||||||
|
shop_default,
|
||||||
|
shopping_bag_default,
|
||||||
|
shopping_cart_default,
|
||||||
|
shopping_cart_full_default,
|
||||||
|
shopping_trolley_default,
|
||||||
|
smoking_default,
|
||||||
|
soccer_default,
|
||||||
|
sold_out_default,
|
||||||
|
sort_default,
|
||||||
|
sort_down_default,
|
||||||
|
sort_up_default,
|
||||||
|
stamp_default,
|
||||||
|
star_default,
|
||||||
|
star_filled_default,
|
||||||
|
stopwatch_default,
|
||||||
|
success_filled_default,
|
||||||
|
sugar_default,
|
||||||
|
suitcase_default,
|
||||||
|
suitcase_line_default,
|
||||||
|
sunny_default,
|
||||||
|
sunrise_default,
|
||||||
|
sunset_default,
|
||||||
|
switch_button_default,
|
||||||
|
switch_default,
|
||||||
|
switch_filled_default,
|
||||||
|
takeaway_box_default,
|
||||||
|
ticket_default,
|
||||||
|
tickets_default,
|
||||||
|
timer_default,
|
||||||
|
toilet_paper_default,
|
||||||
|
tools_default,
|
||||||
|
top_default,
|
||||||
|
top_left_default,
|
||||||
|
top_right_default,
|
||||||
|
trend_charts_default,
|
||||||
|
trophy_base_default,
|
||||||
|
trophy_default,
|
||||||
|
turn_off_default,
|
||||||
|
umbrella_default,
|
||||||
|
unlock_default,
|
||||||
|
upload_default,
|
||||||
|
upload_filled_default,
|
||||||
|
user_default,
|
||||||
|
user_filled_default,
|
||||||
|
van_default,
|
||||||
|
video_camera_default,
|
||||||
|
video_camera_filled_default,
|
||||||
|
video_pause_default,
|
||||||
|
video_play_default,
|
||||||
|
view_default,
|
||||||
|
wallet_default,
|
||||||
|
wallet_filled_default,
|
||||||
|
warn_triangle_filled_default,
|
||||||
|
warning_default,
|
||||||
|
warning_filled_default,
|
||||||
|
watch_default,
|
||||||
|
watermelon_default,
|
||||||
|
wind_power_default,
|
||||||
|
zoom_in_default,
|
||||||
|
zoom_out_default
|
||||||
|
} from "./chunk-ETC2NX3T.js";
|
||||||
|
import "./chunk-J44PGZX2.js";
|
||||||
|
import "./chunk-5WRI5ZAA.js";
|
||||||
|
export {
|
||||||
|
add_location_default as AddLocation,
|
||||||
|
aim_default as Aim,
|
||||||
|
alarm_clock_default as AlarmClock,
|
||||||
|
apple_default as Apple,
|
||||||
|
arrow_down_default as ArrowDown,
|
||||||
|
arrow_down_bold_default as ArrowDownBold,
|
||||||
|
arrow_left_default as ArrowLeft,
|
||||||
|
arrow_left_bold_default as ArrowLeftBold,
|
||||||
|
arrow_right_default as ArrowRight,
|
||||||
|
arrow_right_bold_default as ArrowRightBold,
|
||||||
|
arrow_up_default as ArrowUp,
|
||||||
|
arrow_up_bold_default as ArrowUpBold,
|
||||||
|
avatar_default as Avatar,
|
||||||
|
back_default as Back,
|
||||||
|
baseball_default as Baseball,
|
||||||
|
basketball_default as Basketball,
|
||||||
|
bell_default as Bell,
|
||||||
|
bell_filled_default as BellFilled,
|
||||||
|
bicycle_default as Bicycle,
|
||||||
|
bottom_default as Bottom,
|
||||||
|
bottom_left_default as BottomLeft,
|
||||||
|
bottom_right_default as BottomRight,
|
||||||
|
bowl_default as Bowl,
|
||||||
|
box_default as Box,
|
||||||
|
briefcase_default as Briefcase,
|
||||||
|
brush_default as Brush,
|
||||||
|
brush_filled_default as BrushFilled,
|
||||||
|
burger_default as Burger,
|
||||||
|
calendar_default as Calendar,
|
||||||
|
camera_default as Camera,
|
||||||
|
camera_filled_default as CameraFilled,
|
||||||
|
caret_bottom_default as CaretBottom,
|
||||||
|
caret_left_default as CaretLeft,
|
||||||
|
caret_right_default as CaretRight,
|
||||||
|
caret_top_default as CaretTop,
|
||||||
|
cellphone_default as Cellphone,
|
||||||
|
chat_dot_round_default as ChatDotRound,
|
||||||
|
chat_dot_square_default as ChatDotSquare,
|
||||||
|
chat_line_round_default as ChatLineRound,
|
||||||
|
chat_line_square_default as ChatLineSquare,
|
||||||
|
chat_round_default as ChatRound,
|
||||||
|
chat_square_default as ChatSquare,
|
||||||
|
check_default as Check,
|
||||||
|
checked_default as Checked,
|
||||||
|
cherry_default as Cherry,
|
||||||
|
chicken_default as Chicken,
|
||||||
|
chrome_filled_default as ChromeFilled,
|
||||||
|
circle_check_default as CircleCheck,
|
||||||
|
circle_check_filled_default as CircleCheckFilled,
|
||||||
|
circle_close_default as CircleClose,
|
||||||
|
circle_close_filled_default as CircleCloseFilled,
|
||||||
|
circle_plus_default as CirclePlus,
|
||||||
|
circle_plus_filled_default as CirclePlusFilled,
|
||||||
|
clock_default as Clock,
|
||||||
|
close_default as Close,
|
||||||
|
close_bold_default as CloseBold,
|
||||||
|
cloudy_default as Cloudy,
|
||||||
|
coffee_default as Coffee,
|
||||||
|
coffee_cup_default as CoffeeCup,
|
||||||
|
coin_default as Coin,
|
||||||
|
cold_drink_default as ColdDrink,
|
||||||
|
collection_default as Collection,
|
||||||
|
collection_tag_default as CollectionTag,
|
||||||
|
comment_default as Comment,
|
||||||
|
compass_default as Compass,
|
||||||
|
connection_default as Connection,
|
||||||
|
coordinate_default as Coordinate,
|
||||||
|
copy_document_default as CopyDocument,
|
||||||
|
cpu_default as Cpu,
|
||||||
|
credit_card_default as CreditCard,
|
||||||
|
crop_default as Crop,
|
||||||
|
d_arrow_left_default as DArrowLeft,
|
||||||
|
d_arrow_right_default as DArrowRight,
|
||||||
|
d_caret_default as DCaret,
|
||||||
|
data_analysis_default as DataAnalysis,
|
||||||
|
data_board_default as DataBoard,
|
||||||
|
data_line_default as DataLine,
|
||||||
|
delete_default as Delete,
|
||||||
|
delete_filled_default as DeleteFilled,
|
||||||
|
delete_location_default as DeleteLocation,
|
||||||
|
dessert_default as Dessert,
|
||||||
|
discount_default as Discount,
|
||||||
|
dish_default as Dish,
|
||||||
|
dish_dot_default as DishDot,
|
||||||
|
document_default as Document,
|
||||||
|
document_add_default as DocumentAdd,
|
||||||
|
document_checked_default as DocumentChecked,
|
||||||
|
document_copy_default as DocumentCopy,
|
||||||
|
document_delete_default as DocumentDelete,
|
||||||
|
document_remove_default as DocumentRemove,
|
||||||
|
download_default as Download,
|
||||||
|
drizzling_default as Drizzling,
|
||||||
|
edit_default as Edit,
|
||||||
|
edit_pen_default as EditPen,
|
||||||
|
eleme_default as Eleme,
|
||||||
|
eleme_filled_default as ElemeFilled,
|
||||||
|
element_plus_default as ElementPlus,
|
||||||
|
expand_default as Expand,
|
||||||
|
failed_default as Failed,
|
||||||
|
female_default as Female,
|
||||||
|
files_default as Files,
|
||||||
|
film_default as Film,
|
||||||
|
filter_default as Filter,
|
||||||
|
finished_default as Finished,
|
||||||
|
first_aid_kit_default as FirstAidKit,
|
||||||
|
flag_default as Flag,
|
||||||
|
fold_default as Fold,
|
||||||
|
folder_default as Folder,
|
||||||
|
folder_add_default as FolderAdd,
|
||||||
|
folder_checked_default as FolderChecked,
|
||||||
|
folder_delete_default as FolderDelete,
|
||||||
|
folder_opened_default as FolderOpened,
|
||||||
|
folder_remove_default as FolderRemove,
|
||||||
|
food_default as Food,
|
||||||
|
football_default as Football,
|
||||||
|
fork_spoon_default as ForkSpoon,
|
||||||
|
fries_default as Fries,
|
||||||
|
full_screen_default as FullScreen,
|
||||||
|
goblet_default as Goblet,
|
||||||
|
goblet_full_default as GobletFull,
|
||||||
|
goblet_square_default as GobletSquare,
|
||||||
|
goblet_square_full_default as GobletSquareFull,
|
||||||
|
gold_medal_default as GoldMedal,
|
||||||
|
goods_default as Goods,
|
||||||
|
goods_filled_default as GoodsFilled,
|
||||||
|
grape_default as Grape,
|
||||||
|
grid_default as Grid,
|
||||||
|
guide_default as Guide,
|
||||||
|
handbag_default as Handbag,
|
||||||
|
headset_default as Headset,
|
||||||
|
help_default as Help,
|
||||||
|
help_filled_default as HelpFilled,
|
||||||
|
hide_default as Hide,
|
||||||
|
histogram_default as Histogram,
|
||||||
|
home_filled_default as HomeFilled,
|
||||||
|
hot_water_default as HotWater,
|
||||||
|
house_default as House,
|
||||||
|
ice_cream_default as IceCream,
|
||||||
|
ice_cream_round_default as IceCreamRound,
|
||||||
|
ice_cream_square_default as IceCreamSquare,
|
||||||
|
ice_drink_default as IceDrink,
|
||||||
|
ice_tea_default as IceTea,
|
||||||
|
info_filled_default as InfoFilled,
|
||||||
|
iphone_default as Iphone,
|
||||||
|
key_default as Key,
|
||||||
|
knife_fork_default as KnifeFork,
|
||||||
|
lightning_default as Lightning,
|
||||||
|
link_default as Link,
|
||||||
|
list_default as List,
|
||||||
|
loading_default as Loading,
|
||||||
|
location_default as Location,
|
||||||
|
location_filled_default as LocationFilled,
|
||||||
|
location_information_default as LocationInformation,
|
||||||
|
lock_default as Lock,
|
||||||
|
lollipop_default as Lollipop,
|
||||||
|
magic_stick_default as MagicStick,
|
||||||
|
magnet_default as Magnet,
|
||||||
|
male_default as Male,
|
||||||
|
management_default as Management,
|
||||||
|
map_location_default as MapLocation,
|
||||||
|
medal_default as Medal,
|
||||||
|
memo_default as Memo,
|
||||||
|
menu_default as Menu,
|
||||||
|
message_default as Message,
|
||||||
|
message_box_default as MessageBox,
|
||||||
|
mic_default as Mic,
|
||||||
|
microphone_default as Microphone,
|
||||||
|
milk_tea_default as MilkTea,
|
||||||
|
minus_default as Minus,
|
||||||
|
money_default as Money,
|
||||||
|
monitor_default as Monitor,
|
||||||
|
moon_default as Moon,
|
||||||
|
moon_night_default as MoonNight,
|
||||||
|
more_default as More,
|
||||||
|
more_filled_default as MoreFilled,
|
||||||
|
mostly_cloudy_default as MostlyCloudy,
|
||||||
|
mouse_default as Mouse,
|
||||||
|
mug_default as Mug,
|
||||||
|
mute_default as Mute,
|
||||||
|
mute_notification_default as MuteNotification,
|
||||||
|
no_smoking_default as NoSmoking,
|
||||||
|
notebook_default as Notebook,
|
||||||
|
notification_default as Notification,
|
||||||
|
odometer_default as Odometer,
|
||||||
|
office_building_default as OfficeBuilding,
|
||||||
|
open_default as Open,
|
||||||
|
operation_default as Operation,
|
||||||
|
opportunity_default as Opportunity,
|
||||||
|
orange_default as Orange,
|
||||||
|
paperclip_default as Paperclip,
|
||||||
|
partly_cloudy_default as PartlyCloudy,
|
||||||
|
pear_default as Pear,
|
||||||
|
phone_default as Phone,
|
||||||
|
phone_filled_default as PhoneFilled,
|
||||||
|
picture_default as Picture,
|
||||||
|
picture_filled_default as PictureFilled,
|
||||||
|
picture_rounded_default as PictureRounded,
|
||||||
|
pie_chart_default as PieChart,
|
||||||
|
place_default as Place,
|
||||||
|
platform_default as Platform,
|
||||||
|
plus_default as Plus,
|
||||||
|
pointer_default as Pointer,
|
||||||
|
position_default as Position,
|
||||||
|
postcard_default as Postcard,
|
||||||
|
pouring_default as Pouring,
|
||||||
|
present_default as Present,
|
||||||
|
price_tag_default as PriceTag,
|
||||||
|
printer_default as Printer,
|
||||||
|
promotion_default as Promotion,
|
||||||
|
quartz_watch_default as QuartzWatch,
|
||||||
|
question_filled_default as QuestionFilled,
|
||||||
|
rank_default as Rank,
|
||||||
|
reading_default as Reading,
|
||||||
|
reading_lamp_default as ReadingLamp,
|
||||||
|
refresh_default as Refresh,
|
||||||
|
refresh_left_default as RefreshLeft,
|
||||||
|
refresh_right_default as RefreshRight,
|
||||||
|
refrigerator_default as Refrigerator,
|
||||||
|
remove_default as Remove,
|
||||||
|
remove_filled_default as RemoveFilled,
|
||||||
|
right_default as Right,
|
||||||
|
scale_to_original_default as ScaleToOriginal,
|
||||||
|
school_default as School,
|
||||||
|
scissor_default as Scissor,
|
||||||
|
search_default as Search,
|
||||||
|
select_default as Select,
|
||||||
|
sell_default as Sell,
|
||||||
|
semi_select_default as SemiSelect,
|
||||||
|
service_default as Service,
|
||||||
|
set_up_default as SetUp,
|
||||||
|
setting_default as Setting,
|
||||||
|
share_default as Share,
|
||||||
|
ship_default as Ship,
|
||||||
|
shop_default as Shop,
|
||||||
|
shopping_bag_default as ShoppingBag,
|
||||||
|
shopping_cart_default as ShoppingCart,
|
||||||
|
shopping_cart_full_default as ShoppingCartFull,
|
||||||
|
shopping_trolley_default as ShoppingTrolley,
|
||||||
|
smoking_default as Smoking,
|
||||||
|
soccer_default as Soccer,
|
||||||
|
sold_out_default as SoldOut,
|
||||||
|
sort_default as Sort,
|
||||||
|
sort_down_default as SortDown,
|
||||||
|
sort_up_default as SortUp,
|
||||||
|
stamp_default as Stamp,
|
||||||
|
star_default as Star,
|
||||||
|
star_filled_default as StarFilled,
|
||||||
|
stopwatch_default as Stopwatch,
|
||||||
|
success_filled_default as SuccessFilled,
|
||||||
|
sugar_default as Sugar,
|
||||||
|
suitcase_default as Suitcase,
|
||||||
|
suitcase_line_default as SuitcaseLine,
|
||||||
|
sunny_default as Sunny,
|
||||||
|
sunrise_default as Sunrise,
|
||||||
|
sunset_default as Sunset,
|
||||||
|
switch_default as Switch,
|
||||||
|
switch_button_default as SwitchButton,
|
||||||
|
switch_filled_default as SwitchFilled,
|
||||||
|
takeaway_box_default as TakeawayBox,
|
||||||
|
ticket_default as Ticket,
|
||||||
|
tickets_default as Tickets,
|
||||||
|
timer_default as Timer,
|
||||||
|
toilet_paper_default as ToiletPaper,
|
||||||
|
tools_default as Tools,
|
||||||
|
top_default as Top,
|
||||||
|
top_left_default as TopLeft,
|
||||||
|
top_right_default as TopRight,
|
||||||
|
trend_charts_default as TrendCharts,
|
||||||
|
trophy_default as Trophy,
|
||||||
|
trophy_base_default as TrophyBase,
|
||||||
|
turn_off_default as TurnOff,
|
||||||
|
umbrella_default as Umbrella,
|
||||||
|
unlock_default as Unlock,
|
||||||
|
upload_default as Upload,
|
||||||
|
upload_filled_default as UploadFilled,
|
||||||
|
user_default as User,
|
||||||
|
user_filled_default as UserFilled,
|
||||||
|
van_default as Van,
|
||||||
|
video_camera_default as VideoCamera,
|
||||||
|
video_camera_filled_default as VideoCameraFilled,
|
||||||
|
video_pause_default as VideoPause,
|
||||||
|
video_play_default as VideoPlay,
|
||||||
|
view_default as View,
|
||||||
|
wallet_default as Wallet,
|
||||||
|
wallet_filled_default as WalletFilled,
|
||||||
|
warn_triangle_filled_default as WarnTriangleFilled,
|
||||||
|
warning_default as Warning,
|
||||||
|
warning_filled_default as WarningFilled,
|
||||||
|
watch_default as Watch,
|
||||||
|
watermelon_default as Watermelon,
|
||||||
|
wind_power_default as WindPower,
|
||||||
|
zoom_in_default as ZoomIn,
|
||||||
|
zoom_out_default as ZoomOut
|
||||||
|
};
|
||||||
|
//# sourceMappingURL=@element-plus_icons-vue.js.map
|
||||||
@ -0,0 +1,7 @@
|
|||||||
|
{
|
||||||
|
"version": 3,
|
||||||
|
"sources": [],
|
||||||
|
"sourcesContent": [],
|
||||||
|
"mappings": "",
|
||||||
|
"names": []
|
||||||
|
}
|
||||||
@ -0,0 +1,58 @@
|
|||||||
|
{
|
||||||
|
"hash": "6565f0a1",
|
||||||
|
"configHash": "eb1835b8",
|
||||||
|
"lockfileHash": "9f1499ac",
|
||||||
|
"browserHash": "7b79acab",
|
||||||
|
"optimized": {
|
||||||
|
"vue": {
|
||||||
|
"src": "../../node_modules/vue/dist/vue.runtime.esm-bundler.js",
|
||||||
|
"file": "vue.js",
|
||||||
|
"fileHash": "4a20bd0d",
|
||||||
|
"needsInterop": false
|
||||||
|
},
|
||||||
|
"pinia": {
|
||||||
|
"src": "../../node_modules/pinia/dist/pinia.mjs",
|
||||||
|
"file": "pinia.js",
|
||||||
|
"fileHash": "e3724164",
|
||||||
|
"needsInterop": false
|
||||||
|
},
|
||||||
|
"element-plus": {
|
||||||
|
"src": "../../node_modules/element-plus/es/index.mjs",
|
||||||
|
"file": "element-plus.js",
|
||||||
|
"fileHash": "6327058f",
|
||||||
|
"needsInterop": false
|
||||||
|
},
|
||||||
|
"element-plus/dist/locale/zh-cn.mjs": {
|
||||||
|
"src": "../../node_modules/element-plus/dist/locale/zh-cn.mjs",
|
||||||
|
"file": "element-plus_dist_locale_zh-cn__mjs.js",
|
||||||
|
"fileHash": "085f6406",
|
||||||
|
"needsInterop": false
|
||||||
|
},
|
||||||
|
"@element-plus/icons-vue": {
|
||||||
|
"src": "../../node_modules/@element-plus/icons-vue/dist/index.js",
|
||||||
|
"file": "@element-plus_icons-vue.js",
|
||||||
|
"fileHash": "88f96e20",
|
||||||
|
"needsInterop": false
|
||||||
|
},
|
||||||
|
"vue-router": {
|
||||||
|
"src": "../../node_modules/vue-router/dist/vue-router.mjs",
|
||||||
|
"file": "vue-router.js",
|
||||||
|
"fileHash": "3270b841",
|
||||||
|
"needsInterop": false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"chunks": {
|
||||||
|
"chunk-ETC2NX3T": {
|
||||||
|
"file": "chunk-ETC2NX3T.js"
|
||||||
|
},
|
||||||
|
"chunk-AYVSL3LM": {
|
||||||
|
"file": "chunk-AYVSL3LM.js"
|
||||||
|
},
|
||||||
|
"chunk-J44PGZX2": {
|
||||||
|
"file": "chunk-J44PGZX2.js"
|
||||||
|
},
|
||||||
|
"chunk-5WRI5ZAA": {
|
||||||
|
"file": "chunk-5WRI5ZAA.js"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,31 @@
|
|||||||
|
var __create = Object.create;
|
||||||
|
var __defProp = Object.defineProperty;
|
||||||
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
||||||
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
||||||
|
var __getProtoOf = Object.getPrototypeOf;
|
||||||
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
||||||
|
var __commonJS = (cb, mod) => function __require() {
|
||||||
|
return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
|
||||||
|
};
|
||||||
|
var __copyProps = (to, from, except, desc) => {
|
||||||
|
if (from && typeof from === "object" || typeof from === "function") {
|
||||||
|
for (let key of __getOwnPropNames(from))
|
||||||
|
if (!__hasOwnProp.call(to, key) && key !== except)
|
||||||
|
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
||||||
|
}
|
||||||
|
return to;
|
||||||
|
};
|
||||||
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
||||||
|
// If the importer is in node compatibility mode or this is not an ESM
|
||||||
|
// file that has been converted to a CommonJS file using a Babel-
|
||||||
|
// compatible transform (i.e. "__esModule" has not been set), then set
|
||||||
|
// "default" to the CommonJS "module.exports" for node compatibility.
|
||||||
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
||||||
|
mod
|
||||||
|
));
|
||||||
|
|
||||||
|
export {
|
||||||
|
__commonJS,
|
||||||
|
__toESM
|
||||||
|
};
|
||||||
|
//# sourceMappingURL=chunk-5WRI5ZAA.js.map
|
||||||
@ -0,0 +1,7 @@
|
|||||||
|
{
|
||||||
|
"version": 3,
|
||||||
|
"sources": [],
|
||||||
|
"sourcesContent": [],
|
||||||
|
"mappings": "",
|
||||||
|
"names": []
|
||||||
|
}
|
||||||
@ -0,0 +1,162 @@
|
|||||||
|
// node_modules/@vue/devtools-api/lib/esm/env.js
|
||||||
|
function getDevtoolsGlobalHook() {
|
||||||
|
return getTarget().__VUE_DEVTOOLS_GLOBAL_HOOK__;
|
||||||
|
}
|
||||||
|
function getTarget() {
|
||||||
|
return typeof navigator !== "undefined" && typeof window !== "undefined" ? window : typeof globalThis !== "undefined" ? globalThis : {};
|
||||||
|
}
|
||||||
|
var isProxyAvailable = typeof Proxy === "function";
|
||||||
|
|
||||||
|
// node_modules/@vue/devtools-api/lib/esm/const.js
|
||||||
|
var HOOK_SETUP = "devtools-plugin:setup";
|
||||||
|
var HOOK_PLUGIN_SETTINGS_SET = "plugin:settings:set";
|
||||||
|
|
||||||
|
// node_modules/@vue/devtools-api/lib/esm/time.js
|
||||||
|
var supported;
|
||||||
|
var perf;
|
||||||
|
function isPerformanceSupported() {
|
||||||
|
var _a;
|
||||||
|
if (supported !== void 0) {
|
||||||
|
return supported;
|
||||||
|
}
|
||||||
|
if (typeof window !== "undefined" && window.performance) {
|
||||||
|
supported = true;
|
||||||
|
perf = window.performance;
|
||||||
|
} else if (typeof globalThis !== "undefined" && ((_a = globalThis.perf_hooks) === null || _a === void 0 ? void 0 : _a.performance)) {
|
||||||
|
supported = true;
|
||||||
|
perf = globalThis.perf_hooks.performance;
|
||||||
|
} else {
|
||||||
|
supported = false;
|
||||||
|
}
|
||||||
|
return supported;
|
||||||
|
}
|
||||||
|
function now() {
|
||||||
|
return isPerformanceSupported() ? perf.now() : Date.now();
|
||||||
|
}
|
||||||
|
|
||||||
|
// node_modules/@vue/devtools-api/lib/esm/proxy.js
|
||||||
|
var ApiProxy = class {
|
||||||
|
constructor(plugin, hook) {
|
||||||
|
this.target = null;
|
||||||
|
this.targetQueue = [];
|
||||||
|
this.onQueue = [];
|
||||||
|
this.plugin = plugin;
|
||||||
|
this.hook = hook;
|
||||||
|
const defaultSettings = {};
|
||||||
|
if (plugin.settings) {
|
||||||
|
for (const id in plugin.settings) {
|
||||||
|
const item = plugin.settings[id];
|
||||||
|
defaultSettings[id] = item.defaultValue;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const localSettingsSaveId = `__vue-devtools-plugin-settings__${plugin.id}`;
|
||||||
|
let currentSettings = Object.assign({}, defaultSettings);
|
||||||
|
try {
|
||||||
|
const raw = localStorage.getItem(localSettingsSaveId);
|
||||||
|
const data = JSON.parse(raw);
|
||||||
|
Object.assign(currentSettings, data);
|
||||||
|
} catch (e) {
|
||||||
|
}
|
||||||
|
this.fallbacks = {
|
||||||
|
getSettings() {
|
||||||
|
return currentSettings;
|
||||||
|
},
|
||||||
|
setSettings(value) {
|
||||||
|
try {
|
||||||
|
localStorage.setItem(localSettingsSaveId, JSON.stringify(value));
|
||||||
|
} catch (e) {
|
||||||
|
}
|
||||||
|
currentSettings = value;
|
||||||
|
},
|
||||||
|
now() {
|
||||||
|
return now();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
if (hook) {
|
||||||
|
hook.on(HOOK_PLUGIN_SETTINGS_SET, (pluginId, value) => {
|
||||||
|
if (pluginId === this.plugin.id) {
|
||||||
|
this.fallbacks.setSettings(value);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
this.proxiedOn = new Proxy({}, {
|
||||||
|
get: (_target, prop) => {
|
||||||
|
if (this.target) {
|
||||||
|
return this.target.on[prop];
|
||||||
|
} else {
|
||||||
|
return (...args) => {
|
||||||
|
this.onQueue.push({
|
||||||
|
method: prop,
|
||||||
|
args
|
||||||
|
});
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
this.proxiedTarget = new Proxy({}, {
|
||||||
|
get: (_target, prop) => {
|
||||||
|
if (this.target) {
|
||||||
|
return this.target[prop];
|
||||||
|
} else if (prop === "on") {
|
||||||
|
return this.proxiedOn;
|
||||||
|
} else if (Object.keys(this.fallbacks).includes(prop)) {
|
||||||
|
return (...args) => {
|
||||||
|
this.targetQueue.push({
|
||||||
|
method: prop,
|
||||||
|
args,
|
||||||
|
resolve: () => {
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return this.fallbacks[prop](...args);
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
return (...args) => {
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
this.targetQueue.push({
|
||||||
|
method: prop,
|
||||||
|
args,
|
||||||
|
resolve
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
async setRealTarget(target) {
|
||||||
|
this.target = target;
|
||||||
|
for (const item of this.onQueue) {
|
||||||
|
this.target.on[item.method](...item.args);
|
||||||
|
}
|
||||||
|
for (const item of this.targetQueue) {
|
||||||
|
item.resolve(await this.target[item.method](...item.args));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// node_modules/@vue/devtools-api/lib/esm/index.js
|
||||||
|
function setupDevtoolsPlugin(pluginDescriptor, setupFn) {
|
||||||
|
const descriptor = pluginDescriptor;
|
||||||
|
const target = getTarget();
|
||||||
|
const hook = getDevtoolsGlobalHook();
|
||||||
|
const enableProxy = isProxyAvailable && descriptor.enableEarlyProxy;
|
||||||
|
if (hook && (target.__VUE_DEVTOOLS_PLUGIN_API_AVAILABLE__ || !enableProxy)) {
|
||||||
|
hook.emit(HOOK_SETUP, pluginDescriptor, setupFn);
|
||||||
|
} else {
|
||||||
|
const proxy = enableProxy ? new ApiProxy(descriptor, hook) : null;
|
||||||
|
const list = target.__VUE_DEVTOOLS_PLUGINS__ = target.__VUE_DEVTOOLS_PLUGINS__ || [];
|
||||||
|
list.push({
|
||||||
|
pluginDescriptor: descriptor,
|
||||||
|
setupFn,
|
||||||
|
proxy
|
||||||
|
});
|
||||||
|
if (proxy) {
|
||||||
|
setupFn(proxy.proxiedTarget);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export {
|
||||||
|
setupDevtoolsPlugin
|
||||||
|
};
|
||||||
|
//# sourceMappingURL=chunk-AYVSL3LM.js.map
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@ -0,0 +1,192 @@
|
|||||||
|
import "./chunk-5WRI5ZAA.js";
|
||||||
|
|
||||||
|
// node_modules/element-plus/dist/locale/zh-cn.mjs
|
||||||
|
var zh_cn_default = {
|
||||||
|
name: "zh-cn",
|
||||||
|
el: {
|
||||||
|
breadcrumb: { label: "面包屑" },
|
||||||
|
colorpicker: {
|
||||||
|
confirm: "确定",
|
||||||
|
clear: "清空",
|
||||||
|
defaultLabel: "颜色选择器",
|
||||||
|
description: "当前颜色 {color}，按 Enter 键选择新颜色",
|
||||||
|
alphaLabel: "选择透明度的值",
|
||||||
|
alphaDescription: "透明度 {alpha}, 当前颜色 {color}",
|
||||||
|
hueLabel: "选择色相值",
|
||||||
|
hueDescription: "色相 {hue}, 当前颜色 {color}",
|
||||||
|
svLabel: "选择饱和度与明度的值",
|
||||||
|
svDescription: "饱和度 {saturation}, 明度 {brightness}, 当前颜色 {color}",
|
||||||
|
predefineDescription: "选择 {value} 作为颜色"
|
||||||
|
},
|
||||||
|
datepicker: {
|
||||||
|
now: "此刻",
|
||||||
|
today: "今天",
|
||||||
|
cancel: "取消",
|
||||||
|
clear: "清空",
|
||||||
|
confirm: "确定",
|
||||||
|
dateTablePrompt: "使用方向键与 Enter 键可选择日期",
|
||||||
|
monthTablePrompt: "使用方向键与 Enter 键可选择月份",
|
||||||
|
yearTablePrompt: "使用方向键与 Enter 键可选择年份",
|
||||||
|
selectedDate: "已选日期",
|
||||||
|
selectDate: "选择日期",
|
||||||
|
selectTime: "选择时间",
|
||||||
|
startDate: "开始日期",
|
||||||
|
startTime: "开始时间",
|
||||||
|
endDate: "结束日期",
|
||||||
|
endTime: "结束时间",
|
||||||
|
prevYear: "前一年",
|
||||||
|
nextYear: "后一年",
|
||||||
|
prevMonth: "上个月",
|
||||||
|
nextMonth: "下个月",
|
||||||
|
year: "年",
|
||||||
|
month1: "1 月",
|
||||||
|
month2: "2 月",
|
||||||
|
month3: "3 月",
|
||||||
|
month4: "4 月",
|
||||||
|
month5: "5 月",
|
||||||
|
month6: "6 月",
|
||||||
|
month7: "7 月",
|
||||||
|
month8: "8 月",
|
||||||
|
month9: "9 月",
|
||||||
|
month10: "10 月",
|
||||||
|
month11: "11 月",
|
||||||
|
month12: "12 月",
|
||||||
|
weeks: {
|
||||||
|
sun: "日",
|
||||||
|
mon: "一",
|
||||||
|
tue: "二",
|
||||||
|
wed: "三",
|
||||||
|
thu: "四",
|
||||||
|
fri: "五",
|
||||||
|
sat: "六"
|
||||||
|
},
|
||||||
|
weeksFull: {
|
||||||
|
sun: "星期日",
|
||||||
|
mon: "星期一",
|
||||||
|
tue: "星期二",
|
||||||
|
wed: "星期三",
|
||||||
|
thu: "星期四",
|
||||||
|
fri: "星期五",
|
||||||
|
sat: "星期六"
|
||||||
|
},
|
||||||
|
months: {
|
||||||
|
jan: "一月",
|
||||||
|
feb: "二月",
|
||||||
|
mar: "三月",
|
||||||
|
apr: "四月",
|
||||||
|
may: "五月",
|
||||||
|
jun: "六月",
|
||||||
|
jul: "七月",
|
||||||
|
aug: "八月",
|
||||||
|
sep: "九月",
|
||||||
|
oct: "十月",
|
||||||
|
nov: "十一月",
|
||||||
|
dec: "十二月"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
inputNumber: {
|
||||||
|
decrease: "减少数值",
|
||||||
|
increase: "增加数值"
|
||||||
|
},
|
||||||
|
select: {
|
||||||
|
loading: "加载中",
|
||||||
|
noMatch: "无匹配数据",
|
||||||
|
noData: "无数据",
|
||||||
|
placeholder: "请选择"
|
||||||
|
},
|
||||||
|
mention: { loading: "加载中" },
|
||||||
|
dropdown: { toggleDropdown: "切换下拉选项" },
|
||||||
|
cascader: {
|
||||||
|
noMatch: "无匹配数据",
|
||||||
|
loading: "加载中",
|
||||||
|
placeholder: "请选择",
|
||||||
|
noData: "暂无数据"
|
||||||
|
},
|
||||||
|
pagination: {
|
||||||
|
goto: "前往",
|
||||||
|
pagesize: "条/页",
|
||||||
|
total: "共 {total} 条",
|
||||||
|
pageClassifier: "页",
|
||||||
|
page: "页",
|
||||||
|
prev: "上一页",
|
||||||
|
next: "下一页",
|
||||||
|
currentPage: "第 {pager} 页",
|
||||||
|
prevPages: "向前 {pager} 页",
|
||||||
|
nextPages: "向后 {pager} 页",
|
||||||
|
deprecationWarning: "你使用了一些已被废弃的用法，请参考 el-pagination 的官方文档"
|
||||||
|
},
|
||||||
|
dialog: { close: "关闭此对话框" },
|
||||||
|
drawer: { close: "关闭此对话框" },
|
||||||
|
messagebox: {
|
||||||
|
title: "提示",
|
||||||
|
confirm: "确定",
|
||||||
|
cancel: "取消",
|
||||||
|
error: "输入的数据不合法!",
|
||||||
|
close: "关闭此对话框"
|
||||||
|
},
|
||||||
|
upload: {
|
||||||
|
deleteTip: "按 Delete 键可删除",
|
||||||
|
delete: "删除",
|
||||||
|
preview: "查看图片",
|
||||||
|
continue: "继续上传"
|
||||||
|
},
|
||||||
|
slider: {
|
||||||
|
defaultLabel: "滑块介于 {min} 至 {max}",
|
||||||
|
defaultRangeStartLabel: "选择起始值",
|
||||||
|
defaultRangeEndLabel: "选择结束值"
|
||||||
|
},
|
||||||
|
table: {
|
||||||
|
emptyText: "暂无数据",
|
||||||
|
confirmFilter: "筛选",
|
||||||
|
resetFilter: "重置",
|
||||||
|
clearFilter: "全部",
|
||||||
|
sumText: "合计",
|
||||||
|
selectAllLabel: "选择所有行",
|
||||||
|
selectRowLabel: "选择当前行",
|
||||||
|
expandRowLabel: "展开当前行",
|
||||||
|
collapseRowLabel: "收起当前行",
|
||||||
|
sortLabel: "按 {column} 排序",
|
||||||
|
filterLabel: "按 {column} 过滤"
|
||||||
|
},
|
||||||
|
tag: { close: "关闭此标签" },
|
||||||
|
tour: {
|
||||||
|
next: "下一步",
|
||||||
|
previous: "上一步",
|
||||||
|
finish: "结束导览",
|
||||||
|
close: "关闭此对话框"
|
||||||
|
},
|
||||||
|
tree: { emptyText: "暂无数据" },
|
||||||
|
transfer: {
|
||||||
|
noMatch: "无匹配数据",
|
||||||
|
noData: "无数据",
|
||||||
|
titles: ["列表 1", "列表 2"],
|
||||||
|
filterPlaceholder: "请输入搜索内容",
|
||||||
|
noCheckedFormat: "共 {total} 项",
|
||||||
|
hasCheckedFormat: "已选 {checked}/{total} 项"
|
||||||
|
},
|
||||||
|
image: { error: "加载失败" },
|
||||||
|
pageHeader: { title: "返回" },
|
||||||
|
popconfirm: {
|
||||||
|
confirmButtonText: "确定",
|
||||||
|
cancelButtonText: "取消"
|
||||||
|
},
|
||||||
|
carousel: {
|
||||||
|
leftArrow: "上一张幻灯片",
|
||||||
|
rightArrow: "下一张幻灯片",
|
||||||
|
indicator: "幻灯片切换至索引 {index}"
|
||||||
|
},
|
||||||
|
inputOTP: {
|
||||||
|
groupLabel: "一次性密码输入框",
|
||||||
|
defaultLabel: "请输入第 {index} 位 OTP 字符"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
export {
|
||||||
|
zh_cn_default as default
|
||||||
|
};
|
||||||
|
/*! Bundled license information:
|
||||||
|
|
||||||
|
element-plus/dist/locale/zh-cn.mjs:
|
||||||
|
(*! Element Plus v2.14.1 *)
|
||||||
|
*/
|
||||||
|
//# sourceMappingURL=element-plus_dist_locale_zh-cn__mjs.js.map
|
||||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,3 @@
|
|||||||
|
{
|
||||||
|
"type": "module"
|
||||||
|
}
|
||||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@ -0,0 +1,348 @@
|
|||||||
|
import {
|
||||||
|
BaseTransition,
|
||||||
|
BaseTransitionPropsValidators,
|
||||||
|
Comment,
|
||||||
|
DeprecationTypes,
|
||||||
|
EffectScope,
|
||||||
|
ErrorCodes,
|
||||||
|
ErrorTypeStrings,
|
||||||
|
Fragment,
|
||||||
|
KeepAlive,
|
||||||
|
ReactiveEffect,
|
||||||
|
Static,
|
||||||
|
Suspense,
|
||||||
|
Teleport,
|
||||||
|
Text,
|
||||||
|
TrackOpTypes,
|
||||||
|
Transition,
|
||||||
|
TransitionGroup,
|
||||||
|
TriggerOpTypes,
|
||||||
|
VueElement,
|
||||||
|
assertNumber,
|
||||||
|
callWithAsyncErrorHandling,
|
||||||
|
callWithErrorHandling,
|
||||||
|
camelize,
|
||||||
|
capitalize,
|
||||||
|
cloneVNode,
|
||||||
|
compatUtils,
|
||||||
|
compile,
|
||||||
|
computed,
|
||||||
|
createApp,
|
||||||
|
createBaseVNode,
|
||||||
|
createBlock,
|
||||||
|
createCommentVNode,
|
||||||
|
createElementBlock,
|
||||||
|
createHydrationRenderer,
|
||||||
|
createPropsRestProxy,
|
||||||
|
createRenderer,
|
||||||
|
createSSRApp,
|
||||||
|
createSlots,
|
||||||
|
createStaticVNode,
|
||||||
|
createTextVNode,
|
||||||
|
createVNode,
|
||||||
|
customRef,
|
||||||
|
defineAsyncComponent,
|
||||||
|
defineComponent,
|
||||||
|
defineCustomElement,
|
||||||
|
defineEmits,
|
||||||
|
defineExpose,
|
||||||
|
defineModel,
|
||||||
|
defineOptions,
|
||||||
|
defineProps,
|
||||||
|
defineSSRCustomElement,
|
||||||
|
defineSlots,
|
||||||
|
devtools,
|
||||||
|
effect,
|
||||||
|
effectScope,
|
||||||
|
getCurrentInstance,
|
||||||
|
getCurrentScope,
|
||||||
|
getCurrentWatcher,
|
||||||
|
getTransitionRawChildren,
|
||||||
|
guardReactiveProps,
|
||||||
|
h,
|
||||||
|
handleError,
|
||||||
|
hasInjectionContext,
|
||||||
|
hydrate,
|
||||||
|
hydrateOnIdle,
|
||||||
|
hydrateOnInteraction,
|
||||||
|
hydrateOnMediaQuery,
|
||||||
|
hydrateOnVisible,
|
||||||
|
initCustomFormatter,
|
||||||
|
initDirectivesForSSR,
|
||||||
|
inject,
|
||||||
|
isMemoSame,
|
||||||
|
isProxy,
|
||||||
|
isReactive,
|
||||||
|
isReadonly,
|
||||||
|
isRef,
|
||||||
|
isRuntimeOnly,
|
||||||
|
isShallow,
|
||||||
|
isVNode,
|
||||||
|
markRaw,
|
||||||
|
mergeDefaults,
|
||||||
|
mergeModels,
|
||||||
|
mergeProps,
|
||||||
|
nextTick,
|
||||||
|
nodeOps,
|
||||||
|
normalizeClass,
|
||||||
|
normalizeProps,
|
||||||
|
normalizeStyle,
|
||||||
|
onActivated,
|
||||||
|
onBeforeMount,
|
||||||
|
onBeforeUnmount,
|
||||||
|
onBeforeUpdate,
|
||||||
|
onDeactivated,
|
||||||
|
onErrorCaptured,
|
||||||
|
onMounted,
|
||||||
|
onRenderTracked,
|
||||||
|
onRenderTriggered,
|
||||||
|
onScopeDispose,
|
||||||
|
onServerPrefetch,
|
||||||
|
onUnmounted,
|
||||||
|
onUpdated,
|
||||||
|
onWatcherCleanup,
|
||||||
|
openBlock,
|
||||||
|
patchProp,
|
||||||
|
popScopeId,
|
||||||
|
provide,
|
||||||
|
proxyRefs,
|
||||||
|
pushScopeId,
|
||||||
|
queuePostFlushCb,
|
||||||
|
reactive,
|
||||||
|
readonly,
|
||||||
|
ref,
|
||||||
|
registerRuntimeCompiler,
|
||||||
|
render,
|
||||||
|
renderList,
|
||||||
|
renderSlot,
|
||||||
|
resolveComponent,
|
||||||
|
resolveDirective,
|
||||||
|
resolveDynamicComponent,
|
||||||
|
resolveFilter,
|
||||||
|
resolveTransitionHooks,
|
||||||
|
setBlockTracking,
|
||||||
|
setDevtoolsHook,
|
||||||
|
setTransitionHooks,
|
||||||
|
shallowReactive,
|
||||||
|
shallowReadonly,
|
||||||
|
shallowRef,
|
||||||
|
ssrContextKey,
|
||||||
|
ssrUtils,
|
||||||
|
stop,
|
||||||
|
toDisplayString,
|
||||||
|
toHandlerKey,
|
||||||
|
toHandlers,
|
||||||
|
toRaw,
|
||||||
|
toRef,
|
||||||
|
toRefs,
|
||||||
|
toValue,
|
||||||
|
transformVNodeArgs,
|
||||||
|
triggerRef,
|
||||||
|
unref,
|
||||||
|
useAttrs,
|
||||||
|
useCssModule,
|
||||||
|
useCssVars,
|
||||||
|
useHost,
|
||||||
|
useId,
|
||||||
|
useModel,
|
||||||
|
useSSRContext,
|
||||||
|
useShadowRoot,
|
||||||
|
useSlots,
|
||||||
|
useTemplateRef,
|
||||||
|
useTransitionState,
|
||||||
|
vModelCheckbox,
|
||||||
|
vModelDynamic,
|
||||||
|
vModelRadio,
|
||||||
|
vModelSelect,
|
||||||
|
vModelText,
|
||||||
|
vShow,
|
||||||
|
version,
|
||||||
|
warn,
|
||||||
|
watch,
|
||||||
|
watchEffect,
|
||||||
|
watchPostEffect,
|
||||||
|
watchSyncEffect,
|
||||||
|
withAsyncContext,
|
||||||
|
withCtx,
|
||||||
|
withDefaults,
|
||||||
|
withDirectives,
|
||||||
|
withKeys,
|
||||||
|
withMemo,
|
||||||
|
withModifiers,
|
||||||
|
withScopeId
|
||||||
|
} from "./chunk-J44PGZX2.js";
|
||||||
|
import "./chunk-5WRI5ZAA.js";
|
||||||
|
export {
|
||||||
|
BaseTransition,
|
||||||
|
BaseTransitionPropsValidators,
|
||||||
|
Comment,
|
||||||
|
DeprecationTypes,
|
||||||
|
EffectScope,
|
||||||
|
ErrorCodes,
|
||||||
|
ErrorTypeStrings,
|
||||||
|
Fragment,
|
||||||
|
KeepAlive,
|
||||||
|
ReactiveEffect,
|
||||||
|
Static,
|
||||||
|
Suspense,
|
||||||
|
Teleport,
|
||||||
|
Text,
|
||||||
|
TrackOpTypes,
|
||||||
|
Transition,
|
||||||
|
TransitionGroup,
|
||||||
|
TriggerOpTypes,
|
||||||
|
VueElement,
|
||||||
|
assertNumber,
|
||||||
|
callWithAsyncErrorHandling,
|
||||||
|
callWithErrorHandling,
|
||||||
|
camelize,
|
||||||
|
capitalize,
|
||||||
|
cloneVNode,
|
||||||
|
compatUtils,
|
||||||
|
compile,
|
||||||
|
computed,
|
||||||
|
createApp,
|
||||||
|
createBlock,
|
||||||
|
createCommentVNode,
|
||||||
|
createElementBlock,
|
||||||
|
createBaseVNode as createElementVNode,
|
||||||
|
createHydrationRenderer,
|
||||||
|
createPropsRestProxy,
|
||||||
|
createRenderer,
|
||||||
|
createSSRApp,
|
||||||
|
createSlots,
|
||||||
|
createStaticVNode,
|
||||||
|
createTextVNode,
|
||||||
|
createVNode,
|
||||||
|
customRef,
|
||||||
|
defineAsyncComponent,
|
||||||
|
defineComponent,
|
||||||
|
defineCustomElement,
|
||||||
|
defineEmits,
|
||||||
|
defineExpose,
|
||||||
|
defineModel,
|
||||||
|
defineOptions,
|
||||||
|
defineProps,
|
||||||
|
defineSSRCustomElement,
|
||||||
|
defineSlots,
|
||||||
|
devtools,
|
||||||
|
effect,
|
||||||
|
effectScope,
|
||||||
|
getCurrentInstance,
|
||||||
|
getCurrentScope,
|
||||||
|
getCurrentWatcher,
|
||||||
|
getTransitionRawChildren,
|
||||||
|
guardReactiveProps,
|
||||||
|
h,
|
||||||
|
handleError,
|
||||||
|
hasInjectionContext,
|
||||||
|
hydrate,
|
||||||
|
hydrateOnIdle,
|
||||||
|
hydrateOnInteraction,
|
||||||
|
hydrateOnMediaQuery,
|
||||||
|
hydrateOnVisible,
|
||||||
|
initCustomFormatter,
|
||||||
|
initDirectivesForSSR,
|
||||||
|
inject,
|
||||||
|
isMemoSame,
|
||||||
|
isProxy,
|
||||||
|
isReactive,
|
||||||
|
isReadonly,
|
||||||
|
isRef,
|
||||||
|
isRuntimeOnly,
|
||||||
|
isShallow,
|
||||||
|
isVNode,
|
||||||
|
markRaw,
|
||||||
|
mergeDefaults,
|
||||||
|
mergeModels,
|
||||||
|
mergeProps,
|
||||||
|
nextTick,
|
||||||
|
nodeOps,
|
||||||
|
normalizeClass,
|
||||||
|
normalizeProps,
|
||||||
|
normalizeStyle,
|
||||||
|
onActivated,
|
||||||
|
onBeforeMount,
|
||||||
|
onBeforeUnmount,
|
||||||
|
onBeforeUpdate,
|
||||||
|
onDeactivated,
|
||||||
|
onErrorCaptured,
|
||||||
|
onMounted,
|
||||||
|
onRenderTracked,
|
||||||
|
onRenderTriggered,
|
||||||
|
onScopeDispose,
|
||||||
|
onServerPrefetch,
|
||||||
|
onUnmounted,
|
||||||
|
onUpdated,
|
||||||
|
onWatcherCleanup,
|
||||||
|
openBlock,
|
||||||
|
patchProp,
|
||||||
|
popScopeId,
|
||||||
|
provide,
|
||||||
|
proxyRefs,
|
||||||
|
pushScopeId,
|
||||||
|
queuePostFlushCb,
|
||||||
|
reactive,
|
||||||
|
readonly,
|
||||||
|
ref,
|
||||||
|
registerRuntimeCompiler,
|
||||||
|
render,
|
||||||
|
renderList,
|
||||||
|
renderSlot,
|
||||||
|
resolveComponent,
|
||||||
|
resolveDirective,
|
||||||
|
resolveDynamicComponent,
|
||||||
|
resolveFilter,
|
||||||
|
resolveTransitionHooks,
|
||||||
|
setBlockTracking,
|
||||||
|
setDevtoolsHook,
|
||||||
|
setTransitionHooks,
|
||||||
|
shallowReactive,
|
||||||
|
shallowReadonly,
|
||||||
|
shallowRef,
|
||||||
|
ssrContextKey,
|
||||||
|
ssrUtils,
|
||||||
|
stop,
|
||||||
|
toDisplayString,
|
||||||
|
toHandlerKey,
|
||||||
|
toHandlers,
|
||||||
|
toRaw,
|
||||||
|
toRef,
|
||||||
|
toRefs,
|
||||||
|
toValue,
|
||||||
|
transformVNodeArgs,
|
||||||
|
triggerRef,
|
||||||
|
unref,
|
||||||
|
useAttrs,
|
||||||
|
useCssModule,
|
||||||
|
useCssVars,
|
||||||
|
useHost,
|
||||||
|
useId,
|
||||||
|
useModel,
|
||||||
|
useSSRContext,
|
||||||
|
useShadowRoot,
|
||||||
|
useSlots,
|
||||||
|
useTemplateRef,
|
||||||
|
useTransitionState,
|
||||||
|
vModelCheckbox,
|
||||||
|
vModelDynamic,
|
||||||
|
vModelRadio,
|
||||||
|
vModelSelect,
|
||||||
|
vModelText,
|
||||||
|
vShow,
|
||||||
|
version,
|
||||||
|
warn,
|
||||||
|
watch,
|
||||||
|
watchEffect,
|
||||||
|
watchPostEffect,
|
||||||
|
watchSyncEffect,
|
||||||
|
withAsyncContext,
|
||||||
|
withCtx,
|
||||||
|
withDefaults,
|
||||||
|
withDirectives,
|
||||||
|
withKeys,
|
||||||
|
withMemo,
|
||||||
|
withModifiers,
|
||||||
|
withScopeId
|
||||||
|
};
|
||||||
|
//# sourceMappingURL=vue.js.map
|
||||||
@ -0,0 +1,7 @@
|
|||||||
|
{
|
||||||
|
"version": 3,
|
||||||
|
"sources": [],
|
||||||
|
"sourcesContent": [],
|
||||||
|
"mappings": "",
|
||||||
|
"names": []
|
||||||
|
}
|
||||||
@ -0,0 +1,13 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="zh-CN">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<link rel="icon" type="image/svg+xml" href="/favicon.png" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<title>教室智能人脸考勤系统</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="app"></div>
|
||||||
|
<script type="module" src="/src/main.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@ -0,0 +1,27 @@
|
|||||||
|
{
|
||||||
|
"name": "attendance-system",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"private": true,
|
||||||
|
"type": "module",
|
||||||
|
"scripts": {
|
||||||
|
"dev": "vite",
|
||||||
|
"build": "vite build",
|
||||||
|
"preview": "vite preview"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@element-plus/icons-vue": "^2.3.1",
|
||||||
|
"axios": "^1.6.8",
|
||||||
|
"echarts": "^5.5.0",
|
||||||
|
"element-plus": "^2.6.2",
|
||||||
|
"pinia": "^2.1.7",
|
||||||
|
"pinia-plugin-persistedstate": "^3.2.3",
|
||||||
|
"vue": "^3.4.21",
|
||||||
|
"vue-router": "^4.3.0",
|
||||||
|
"xlsx": "^0.18.5"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@vitejs/plugin-vue": "^5.0.4",
|
||||||
|
"sass": "^1.72.0",
|
||||||
|
"vite": "^5.2.0"
|
||||||
|
}
|
||||||
|
}
|
||||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,4 @@
|
|||||||
|
allowBuilds:
|
||||||
|
'@parcel/watcher': false
|
||||||
|
esbuild: false
|
||||||
|
vue-demi: false
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
@ -0,0 +1,10 @@
|
|||||||
|
<template>
|
||||||
|
<router-view />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
@use '@/styles/variables.scss' as *;
|
||||||
|
</style>
|
||||||
@ -0,0 +1,21 @@
|
|||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
/** 分页查询考勤记录 */
|
||||||
|
export const getRecordPage = (params) => {
|
||||||
|
return request.get('/attendance/task/page', { params })
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 分页查询考勤详情 */
|
||||||
|
export const getDetailPage = (params) => {
|
||||||
|
return request.get('/attendance/detail/page', { params })
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 获取教室当前考勤数据 */
|
||||||
|
export const getCurrentAttendance = (id, currentTime) => {
|
||||||
|
return request.get(`/classroom/${id}/current-attendance`, { params: { currentTime } })
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 更新考勤详情状态 */
|
||||||
|
export const updateDetailStatus = (id, attStatus) => {
|
||||||
|
return request.put(`/attendance/detail/${id}`, { attStatus })
|
||||||
|
}
|
||||||
@ -0,0 +1,11 @@
|
|||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
/** 登录 */
|
||||||
|
export const login = (params) => {
|
||||||
|
return request.post('/auth/login', params)
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 退出登录 */
|
||||||
|
export const logout = () => {
|
||||||
|
return request.post('/auth/logout')
|
||||||
|
}
|
||||||
@ -0,0 +1,21 @@
|
|||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
/** 获取行为类型统计（含占比数据） */
|
||||||
|
export const getBehaviorTypesWithStats = (params) => {
|
||||||
|
return request.get('/behavior/types-with-stats', { params })
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 获取各行为时段分布数据 */
|
||||||
|
export const getBehaviorTimePeriod = (params) => {
|
||||||
|
return request.get('/behavior/stats/time-period', { params })
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 获取行为标记图片记录（分页） */
|
||||||
|
export const getBehaviorRecords = (params) => {
|
||||||
|
return request.get('/behavior/records', { params })
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 获取行为类型列表 */
|
||||||
|
export const getBehaviorTypes = () => {
|
||||||
|
return request.get('/behavior/types')
|
||||||
|
}
|
||||||
@ -0,0 +1,16 @@
|
|||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
/** 获取大屏核心统计数据 */
|
||||||
|
export const getBigScreenStats = () => {
|
||||||
|
return request.get('/bigscreen/stats')
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 获取出勤趋势数据 */
|
||||||
|
export const getBigScreenTrend = () => {
|
||||||
|
return request.get('/bigscreen/trend')
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 获取课堂行为分布数据 */
|
||||||
|
export const getBigScreenBehavior = () => {
|
||||||
|
return request.get('/bigscreen/behavior-distribution')
|
||||||
|
}
|
||||||
@ -0,0 +1,16 @@
|
|||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
/** 获取首页核心统计数据 */
|
||||||
|
export const getStats = () => {
|
||||||
|
return request.get('/dashboard/stats')
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 获取近7天出勤趋势 */
|
||||||
|
export const getTrend = () => {
|
||||||
|
return request.get('/dashboard/trend')
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 获取各班级出勤率排名 */
|
||||||
|
export const getRanking = (params) => {
|
||||||
|
return request.get('/dashboard/ranking', { params })
|
||||||
|
}
|
||||||
@ -0,0 +1,6 @@
|
|||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
/** 获取考勤历史记录（分页） */
|
||||||
|
export const getAttendanceHistory = (params) => {
|
||||||
|
return request.get('/attendance/history', { params })
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
@ -0,0 +1,133 @@
|
|||||||
|
<template>
|
||||||
|
<div class="data-card fade-in-up" @click="$emit('click')">
|
||||||
|
<div class="card-header">
|
||||||
|
<div class="card-header-left">
|
||||||
|
<div class="card-icon" :style="{ background: iconBg }">
|
||||||
|
<el-icon :size="20" :color="iconColor"><component :is="icon" /></el-icon>
|
||||||
|
</div>
|
||||||
|
<span class="card-label">{{ label }}</span>
|
||||||
|
</div>
|
||||||
|
<span v-if="date" class="card-date">{{ date }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<div class="card-value">
|
||||||
|
<span class="value-num">{{ value }}</span>
|
||||||
|
<span v-if="unit" class="value-unit">{{ unit }}</span>
|
||||||
|
</div>
|
||||||
|
<div v-if="trend !== undefined" class="card-trend" :class="trend >= 0 ? 'up' : 'down'">
|
||||||
|
<el-icon :size="14">
|
||||||
|
<CaretTop v-if="trend >= 0" />
|
||||||
|
<CaretBottom v-else />
|
||||||
|
</el-icon>
|
||||||
|
<span>{{ Math.abs(trend) }}%</span>
|
||||||
|
<span class="trend-label">较昨日</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
defineProps({
|
||||||
|
label: { type: String, required: true },
|
||||||
|
value: { type: [String, Number], required: true },
|
||||||
|
unit: { type: String, default: '' },
|
||||||
|
icon: { type: [String, Object], required: true },
|
||||||
|
iconColor: { type: String, default: '#52c41a' },
|
||||||
|
iconBg: { type: String, default: '#e8f9e0' },
|
||||||
|
trend: { type: Number, default: undefined },
|
||||||
|
date: { type: String, default: '' }
|
||||||
|
})
|
||||||
|
|
||||||
|
defineEmits(['click'])
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.data-card {
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 20px;
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
border: 1px solid #f0f0f0;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
|
||||||
|
transform: translateY(-2px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-header-left {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-icon {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 8px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-label {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #525252;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-date {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #bfbfbf;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-body {
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-end;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.value-num {
|
||||||
|
font-size: 32px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #262626;
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.value-unit {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #525252;
|
||||||
|
margin-left: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-trend {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 500;
|
||||||
|
gap: 2px;
|
||||||
|
|
||||||
|
&.up {
|
||||||
|
color: #52c41a;
|
||||||
|
}
|
||||||
|
&.down {
|
||||||
|
color: #f5222d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.trend-label {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #bfbfbf;
|
||||||
|
font-weight: 400;
|
||||||
|
margin-left: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,194 @@
|
|||||||
|
<template>
|
||||||
|
<aside class="sidebar" :class="{ collapsed: appStore.sidebarCollapsed }">
|
||||||
|
<!-- Logo 区域 -->
|
||||||
|
<div class="sidebar-logo">
|
||||||
|
<div class="logo-icon">
|
||||||
|
<el-icon :size="28"><Camera /></el-icon>
|
||||||
|
</div>
|
||||||
|
<transition name="fade">
|
||||||
|
<span v-show="!appStore.sidebarCollapsed" class="logo-text">智能考勤系统</span>
|
||||||
|
</transition>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 菜单区域 -->
|
||||||
|
<el-scrollbar class="sidebar-menu">
|
||||||
|
<el-menu
|
||||||
|
:default-active="activeMenu"
|
||||||
|
:collapse="appStore.sidebarCollapsed"
|
||||||
|
:collapse-transition="false"
|
||||||
|
:default-openeds="['/info']"
|
||||||
|
router
|
||||||
|
background-color="transparent"
|
||||||
|
text-color="#525252"
|
||||||
|
active-text-color="#ffffff"
|
||||||
|
>
|
||||||
|
<el-menu-item index="/dashboard">
|
||||||
|
<el-icon><HomeFilled /></el-icon>
|
||||||
|
<span>首页</span>
|
||||||
|
</el-menu-item>
|
||||||
|
|
||||||
|
<el-menu-item index="/behavior">
|
||||||
|
<el-icon><TrendCharts /></el-icon>
|
||||||
|
<span>课堂行为分析</span>
|
||||||
|
</el-menu-item>
|
||||||
|
|
||||||
|
<el-menu-item index="/history">
|
||||||
|
<el-icon><Search /></el-icon>
|
||||||
|
<span>历史记录查询</span>
|
||||||
|
</el-menu-item>
|
||||||
|
|
||||||
|
<el-menu-item index="/bigscreen">
|
||||||
|
<el-icon><DataAnalysis /></el-icon>
|
||||||
|
<span>数据展示大屏</span>
|
||||||
|
</el-menu-item>
|
||||||
|
|
||||||
|
<el-sub-menu index="/info">
|
||||||
|
<template #title>
|
||||||
|
<el-icon><List /></el-icon>
|
||||||
|
<span>信息管理</span>
|
||||||
|
</template>
|
||||||
|
<el-menu-item index="/info/building">
|
||||||
|
<el-icon><OfficeBuilding /></el-icon>
|
||||||
|
<span>教室信息</span>
|
||||||
|
</el-menu-item>
|
||||||
|
<el-menu-item index="/info/class">
|
||||||
|
<el-icon><School /></el-icon>
|
||||||
|
<span>班级信息</span>
|
||||||
|
</el-menu-item>
|
||||||
|
<el-menu-item index="/info/teacher">
|
||||||
|
<el-icon><UserFilled /></el-icon>
|
||||||
|
<span>教师信息</span>
|
||||||
|
</el-menu-item>
|
||||||
|
<el-menu-item index="/info/student">
|
||||||
|
<el-icon><User /></el-icon>
|
||||||
|
<span>学生信息</span>
|
||||||
|
</el-menu-item>
|
||||||
|
<el-menu-item index="/info/course">
|
||||||
|
<el-icon><Reading /></el-icon>
|
||||||
|
<span>课程信息</span>
|
||||||
|
</el-menu-item>
|
||||||
|
</el-sub-menu>
|
||||||
|
|
||||||
|
<el-sub-menu index="/settings">
|
||||||
|
<template #title>
|
||||||
|
<el-icon><Setting /></el-icon>
|
||||||
|
<span>系统设置</span>
|
||||||
|
</template>
|
||||||
|
<el-menu-item index="/settings/rules">
|
||||||
|
<el-icon><Notebook /></el-icon>
|
||||||
|
<span>考勤规则设置</span>
|
||||||
|
</el-menu-item>
|
||||||
|
<el-menu-item index="/settings/permissions">
|
||||||
|
<el-icon><Lock /></el-icon>
|
||||||
|
<span>权限管理</span>
|
||||||
|
</el-menu-item>
|
||||||
|
</el-sub-menu>
|
||||||
|
</el-menu>
|
||||||
|
</el-scrollbar>
|
||||||
|
|
||||||
|
<!-- 底部收起按钮 -->
|
||||||
|
<div class="sidebar-toggle" @click="appStore.toggleSidebar()">
|
||||||
|
<el-icon :size="18">
|
||||||
|
<DArrowLeft v-if="!appStore.sidebarCollapsed" />
|
||||||
|
<DArrowRight v-else />
|
||||||
|
</el-icon>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { computed } from 'vue'
|
||||||
|
import { useRoute } from 'vue-router'
|
||||||
|
import { useAppStore } from '@/stores/app'
|
||||||
|
|
||||||
|
const route = useRoute()
|
||||||
|
const appStore = useAppStore()
|
||||||
|
|
||||||
|
const activeMenu = computed(() => {
|
||||||
|
const path = route.path
|
||||||
|
// 大屏详情页 /bigscreen/room/:id 也高亮"数据展示大屏"
|
||||||
|
if (path.startsWith('/bigscreen')) return '/bigscreen'
|
||||||
|
return path
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.sidebar {
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 240px;
|
||||||
|
background: #ffffff;
|
||||||
|
border-right: 1px solid #f0f0f0;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
transition: width 0.3s ease;
|
||||||
|
z-index: 100;
|
||||||
|
box-shadow: 2px 0 8px rgba(0, 0, 0, 0.03);
|
||||||
|
|
||||||
|
&.collapsed {
|
||||||
|
width: 64px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar-logo {
|
||||||
|
height: 56px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 16px;
|
||||||
|
gap: 10px;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
|
||||||
|
.logo-icon {
|
||||||
|
width: 32px;
|
||||||
|
height: 32px;
|
||||||
|
background: linear-gradient(135deg, #52c41a, #49b018);
|
||||||
|
border-radius: 8px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
color: #ffffff;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo-text {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #262626;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar-menu {
|
||||||
|
flex: 1;
|
||||||
|
padding: 8px 0;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar-toggle {
|
||||||
|
height: 44px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-top: 1px solid #f0f0f0;
|
||||||
|
cursor: pointer;
|
||||||
|
color: #525252;
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: #52c41a;
|
||||||
|
background: #f0fdf0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.fade-enter-active,
|
||||||
|
.fade-leave-active {
|
||||||
|
transition: opacity 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fade-enter-from,
|
||||||
|
.fade-leave-to {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,72 @@
|
|||||||
|
<template>
|
||||||
|
<div class="skeleton-container" :class="{ 'is-card': card }">
|
||||||
|
<div v-if="card" class="skeleton-card">
|
||||||
|
<div class="skeleton skeleton-circle"></div>
|
||||||
|
<div class="skeleton skeleton-line skeleton-line-short"></div>
|
||||||
|
<div class="skeleton skeleton-line skeleton-line-long"></div>
|
||||||
|
</div>
|
||||||
|
<div v-else class="skeleton-table">
|
||||||
|
<div v-for="i in rows" :key="i" class="skeleton-row">
|
||||||
|
<div v-for="j in cols" :key="j" class="skeleton skeleton-cell"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
defineProps({
|
||||||
|
card: { type: Boolean, default: false },
|
||||||
|
rows: { type: Number, default: 5 },
|
||||||
|
cols: { type: Number, default: 4 }
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.skeleton-container {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.skeleton-card {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.skeleton-circle {
|
||||||
|
width: 48px;
|
||||||
|
height: 48px;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.skeleton-line {
|
||||||
|
height: 14px;
|
||||||
|
border-radius: 4px;
|
||||||
|
width: 80%;
|
||||||
|
|
||||||
|
&.skeleton-line-short {
|
||||||
|
width: 60%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.skeleton-line-long {
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.skeleton-table {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.skeleton-row {
|
||||||
|
display: flex;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.skeleton-cell {
|
||||||
|
flex: 1;
|
||||||
|
height: 16px;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,157 @@
|
|||||||
|
<template>
|
||||||
|
<header class="navbar">
|
||||||
|
<div class="navbar-left">
|
||||||
|
<div class="breadcrumb">
|
||||||
|
<el-breadcrumb separator="/">
|
||||||
|
<el-breadcrumb-item :to="{ path: '/dashboard' }">
|
||||||
|
<el-icon><HomeFilled /></el-icon>
|
||||||
|
</el-breadcrumb-item>
|
||||||
|
<el-breadcrumb-item v-if="route.meta.title">
|
||||||
|
{{ route.meta.title }}
|
||||||
|
</el-breadcrumb-item>
|
||||||
|
</el-breadcrumb>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="navbar-right">
|
||||||
|
|
||||||
|
<!-- 全屏按钮 -->
|
||||||
|
<el-tooltip
|
||||||
|
effect="dark"
|
||||||
|
content="全屏"
|
||||||
|
placement="bottom"
|
||||||
|
>
|
||||||
|
<el-button link @click="toggleFullscreen">
|
||||||
|
<el-icon :size="20"><FullScreen /></el-icon>
|
||||||
|
</el-button>
|
||||||
|
</el-tooltip>
|
||||||
|
|
||||||
|
<!-- 用户下拉 -->
|
||||||
|
<el-dropdown trigger="click" @command="handleCommand">
|
||||||
|
<div class="user-info">
|
||||||
|
<el-avatar :size="32" :icon="UserFilled" class="user-avatar" />
|
||||||
|
<span class="user-name">{{ userStore.name }}</span>
|
||||||
|
<el-icon class="user-arrow"><ArrowDown /></el-icon>
|
||||||
|
</div>
|
||||||
|
<template #dropdown>
|
||||||
|
<el-dropdown-menu>
|
||||||
|
<el-dropdown-item command="profile">
|
||||||
|
<el-icon><User /></el-icon>
|
||||||
|
个人中心
|
||||||
|
</el-dropdown-item>
|
||||||
|
<el-dropdown-item command="logout" divided>
|
||||||
|
<el-icon><SwitchButton /></el-icon>
|
||||||
|
退出登录
|
||||||
|
</el-dropdown-item>
|
||||||
|
</el-dropdown-menu>
|
||||||
|
</template>
|
||||||
|
</el-dropdown>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref } from 'vue'
|
||||||
|
import { useRoute, useRouter } from 'vue-router'
|
||||||
|
import { useUserStore } from '@/stores/user'
|
||||||
|
import { useAppStore } from '@/stores/app'
|
||||||
|
import { ElMessage } from 'element-plus'
|
||||||
|
import { UserFilled } from '@element-plus/icons-vue'
|
||||||
|
|
||||||
|
const route = useRoute()
|
||||||
|
const router = useRouter()
|
||||||
|
const userStore = useUserStore()
|
||||||
|
const appStore = useAppStore()
|
||||||
|
const toggleFullscreen = () => {
|
||||||
|
if (document.fullscreenElement) {
|
||||||
|
document.exitFullscreen()
|
||||||
|
} else {
|
||||||
|
document.documentElement.requestFullscreen()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleCommand = async (cmd) => {
|
||||||
|
if (cmd === 'logout') {
|
||||||
|
await userStore.logout()
|
||||||
|
ElMessage.success('已退出登录')
|
||||||
|
router.push('/login')
|
||||||
|
} else if (cmd === 'profile') {
|
||||||
|
ElMessage.info('个人中心功能开发中')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.navbar {
|
||||||
|
height: 56px;
|
||||||
|
background: #ffffff;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 0 24px;
|
||||||
|
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.02);
|
||||||
|
z-index: 50;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-left {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-right {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search-input {
|
||||||
|
:deep(.el-input__wrapper) {
|
||||||
|
background: #f5f7fa;
|
||||||
|
border-radius: 20px;
|
||||||
|
box-shadow: none;
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
&.is-focus {
|
||||||
|
background: #ffffff;
|
||||||
|
box-shadow: 0 0 0 1px #52c41a inset;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-badge {
|
||||||
|
margin-right: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-info {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 4px 8px;
|
||||||
|
border-radius: 8px;
|
||||||
|
transition: background 0.2s ease;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: #f5f7fa;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-avatar {
|
||||||
|
background: linear-gradient(135deg, #52c41a, #73d13d);
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-name {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #262626;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-arrow {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #bfbfbf;
|
||||||
|
transition: transform 0.2s ease;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,44 @@
|
|||||||
|
import { ref } from 'vue'
|
||||||
|
import { getCourseList, getTeacherList, getClassList, getRoomsList } from '@/api/info'
|
||||||
|
|
||||||
|
const courseMap = ref({})
|
||||||
|
const teacherMap = ref({})
|
||||||
|
const classMap = ref({})
|
||||||
|
const roomMap = ref({})
|
||||||
|
let loadPromise = null
|
||||||
|
|
||||||
|
const loadNameMaps = () => {
|
||||||
|
if (!loadPromise) {
|
||||||
|
loadPromise = Promise.all([
|
||||||
|
getCourseList(),
|
||||||
|
getTeacherList(),
|
||||||
|
getClassList(),
|
||||||
|
getRoomsList()
|
||||||
|
]).then(([courseRes, teacherRes, classRes, roomRes]) => {
|
||||||
|
const toMap = (list, nameKey = 'name') => {
|
||||||
|
const map = {}
|
||||||
|
;(list || []).forEach((item) => { map[item.id] = item[nameKey] })
|
||||||
|
return map
|
||||||
|
}
|
||||||
|
courseMap.value = toMap(courseRes.data, 'courseName')
|
||||||
|
teacherMap.value = toMap(teacherRes.data, 'name')
|
||||||
|
classMap.value = toMap(classRes.data, 'className')
|
||||||
|
roomMap.value = toMap(roomRes.data, 'roomName')
|
||||||
|
}).catch((e) => {
|
||||||
|
// 加载失败保留空映射，重置 promise 以便下次可重试
|
||||||
|
console.error('[useNameMaps] 加载名称映射失败:', e)
|
||||||
|
loadPromise = null
|
||||||
|
})
|
||||||
|
}
|
||||||
|
return loadPromise
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 根据 ID 获取名称，兜底返回 ID 本身 */
|
||||||
|
const courseName = (id) => courseMap.value[id] ?? id ?? ''
|
||||||
|
const teacherName = (id) => teacherMap.value[id] ?? id ?? ''
|
||||||
|
const className = (id) => classMap.value[id] ?? id ?? ''
|
||||||
|
const roomName = (id) => roomMap.value[id] ?? id ?? ''
|
||||||
|
|
||||||
|
export function useNameMaps() {
|
||||||
|
return { loadNameMaps, courseName, teacherName, className, roomName }
|
||||||
|
}
|
||||||
@ -0,0 +1,71 @@
|
|||||||
|
<template>
|
||||||
|
<div class="main-layout" :class="{ collapsed: appStore.sidebarCollapsed }">
|
||||||
|
<!-- 侧边栏 -->
|
||||||
|
<SideMenu />
|
||||||
|
<!-- 右侧主体 -->
|
||||||
|
<div class="main-container">
|
||||||
|
<TopNavbar />
|
||||||
|
<div class="main-content">
|
||||||
|
<router-view v-slot="{ Component }">
|
||||||
|
<transition name="fade-slide" mode="out-in">
|
||||||
|
<component :is="Component" />
|
||||||
|
</transition>
|
||||||
|
</router-view>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { useAppStore } from '@/stores/app'
|
||||||
|
import SideMenu from '@/components/SideMenu.vue'
|
||||||
|
import TopNavbar from '@/components/TopNavbar.vue'
|
||||||
|
|
||||||
|
const appStore = useAppStore()
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.main-layout {
|
||||||
|
display: flex;
|
||||||
|
height: 100vh;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
&.collapsed {
|
||||||
|
.main-container {
|
||||||
|
margin-left: 64px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-container {
|
||||||
|
flex: 1;
|
||||||
|
margin-left: 240px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
transition: margin-left 0.3s ease;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-content {
|
||||||
|
flex: 1;
|
||||||
|
overflow-y: auto;
|
||||||
|
background: #f5f7fa;
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 路由过渡动画
|
||||||
|
.fade-slide-enter-active,
|
||||||
|
.fade-slide-leave-active {
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fade-slide-enter-from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateX(12px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.fade-slide-leave-to {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateX(-12px);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,27 @@
|
|||||||
|
import { createApp } from 'vue'
|
||||||
|
import { createPinia } from 'pinia'
|
||||||
|
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
|
||||||
|
import ElementPlus from 'element-plus'
|
||||||
|
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
|
||||||
|
import 'element-plus/dist/index.css'
|
||||||
|
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
|
||||||
|
|
||||||
|
import App from './App.vue'
|
||||||
|
import router from './router'
|
||||||
|
import './styles/global.scss'
|
||||||
|
import './styles/element-override.scss'
|
||||||
|
|
||||||
|
const app = createApp(App)
|
||||||
|
|
||||||
|
// 注册所有 element-plus 图标
|
||||||
|
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
|
||||||
|
app.component(key, component)
|
||||||
|
}
|
||||||
|
|
||||||
|
const pinia = createPinia()
|
||||||
|
pinia.use(piniaPluginPersistedstate)
|
||||||
|
|
||||||
|
app.use(pinia)
|
||||||
|
app.use(router)
|
||||||
|
app.use(ElementPlus, { locale: zhCn })
|
||||||
|
app.mount('#app')
|
||||||
@ -0,0 +1,111 @@
|
|||||||
|
import { createRouter, createWebHashHistory } from 'vue-router'
|
||||||
|
import { useUserStore } from '@/stores/user'
|
||||||
|
|
||||||
|
const routes = [
|
||||||
|
{
|
||||||
|
path: '/',
|
||||||
|
redirect: '/dashboard'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/login',
|
||||||
|
name: 'Login',
|
||||||
|
component: () => import('@/views/login/index.vue'),
|
||||||
|
meta: { title: '登录' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/',
|
||||||
|
component: () => import('@/layouts/MainLayout.vue'),
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
path: 'dashboard',
|
||||||
|
name: 'Dashboard',
|
||||||
|
component: () => import('@/views/dashboard/index.vue'),
|
||||||
|
meta: { title: '首页', icon: 'HomeFilled' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'behavior',
|
||||||
|
name: 'Behavior',
|
||||||
|
component: () => import('@/views/behavior/index.vue'),
|
||||||
|
meta: { title: '课堂行为分析', icon: 'TrendCharts' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'history',
|
||||||
|
name: 'History',
|
||||||
|
component: () => import('@/views/history/index.vue'),
|
||||||
|
meta: { title: '历史记录查询', icon: 'Search' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'bigscreen',
|
||||||
|
name: 'BigScreen',
|
||||||
|
component: () => import('@/views/bigscreen/index.vue'),
|
||||||
|
meta: { title: '数据展示大屏', icon: 'DataAnalysis' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'settings/rules',
|
||||||
|
name: 'Rules',
|
||||||
|
component: () => import('@/views/settings/rules.vue'),
|
||||||
|
meta: { title: '考勤规则设置', icon: 'Setting' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'settings/permissions',
|
||||||
|
name: 'Permissions',
|
||||||
|
component: () => import('@/views/settings/permissions.vue'),
|
||||||
|
meta: { title: '权限管理', icon: 'Lock' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'info/student',
|
||||||
|
name: 'InfoStudent',
|
||||||
|
component: () => import('@/views/info/student.vue'),
|
||||||
|
meta: { title: '学生信息', icon: 'User' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'info/building',
|
||||||
|
name: 'InfoBuilding',
|
||||||
|
component: () => import('@/views/info/building.vue'),
|
||||||
|
meta: { title: '教室信息', icon: 'OfficeBuilding' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'info/class',
|
||||||
|
name: 'InfoClass',
|
||||||
|
component: () => import('@/views/info/class.vue'),
|
||||||
|
meta: { title: '班级信息', icon: 'School' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'info/teacher',
|
||||||
|
name: 'InfoTeacher',
|
||||||
|
component: () => import('@/views/info/teacher.vue'),
|
||||||
|
meta: { title: '教师信息', icon: 'UserFilled' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'info/course',
|
||||||
|
name: 'InfoCourse',
|
||||||
|
component: () => import('@/views/info/course.vue'),
|
||||||
|
meta: { title: '课程信息', icon: 'Reading' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'bigscreen/room/:id',
|
||||||
|
name: 'BigScreenRoomDetail',
|
||||||
|
component: () => import('@/views/bigscreen/roomDetail.vue'),
|
||||||
|
meta: { title: '教室监控详情' }
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
const router = createRouter({
|
||||||
|
history: createWebHashHistory(),
|
||||||
|
routes
|
||||||
|
})
|
||||||
|
|
||||||
|
router.beforeEach((to, from, next) => {
|
||||||
|
document.title = to.meta.title ? `${to.meta.title} - 教室智能人脸考勤系统` : '教室智能人脸考勤系统'
|
||||||
|
|
||||||
|
const store = useUserStore()
|
||||||
|
if (!store.token && to.path !== '/login') {
|
||||||
|
next('/login')
|
||||||
|
} else {
|
||||||
|
next()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
export default router
|
||||||
@ -0,0 +1,22 @@
|
|||||||
|
import { defineStore } from 'pinia'
|
||||||
|
import { ref } from 'vue'
|
||||||
|
|
||||||
|
export const useAppStore = defineStore('app', () => {
|
||||||
|
const sidebarCollapsed = ref(false)
|
||||||
|
const loading = ref(false)
|
||||||
|
|
||||||
|
const toggleSidebar = () => {
|
||||||
|
sidebarCollapsed.value = !sidebarCollapsed.value
|
||||||
|
}
|
||||||
|
|
||||||
|
const setLoading = (val) => {
|
||||||
|
loading.value = val
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
sidebarCollapsed,
|
||||||
|
loading,
|
||||||
|
toggleSidebar,
|
||||||
|
setLoading
|
||||||
|
}
|
||||||
|
})
|
||||||
@ -0,0 +1,83 @@
|
|||||||
|
import { defineStore } from 'pinia'
|
||||||
|
import { ref, computed } from 'vue'
|
||||||
|
import { logout as logoutApi } from '@/api/auth'
|
||||||
|
|
||||||
|
export const useUserStore = defineStore('user', () => {
|
||||||
|
const token = ref('')
|
||||||
|
|
||||||
|
const userInfo = ref({
|
||||||
|
userId: null,
|
||||||
|
username: '',
|
||||||
|
realName: '',
|
||||||
|
avatar: '',
|
||||||
|
role: '',
|
||||||
|
roleName: '',
|
||||||
|
schoolName: ''
|
||||||
|
})
|
||||||
|
|
||||||
|
const name = computed(() => userInfo.value.realName || userInfo.value.username || '未知用户')
|
||||||
|
|
||||||
|
const roleLabel = computed(() => {
|
||||||
|
return userInfo.value.roleName || '未知'
|
||||||
|
})
|
||||||
|
|
||||||
|
const permissions = computed(() => {
|
||||||
|
const role = userInfo.value.role
|
||||||
|
const permMap = {
|
||||||
|
admin: ['dashboard', 'attendance', 'classroom', 'behavior', 'history', 'bigscreen', 'settings'],
|
||||||
|
staff: ['dashboard', 'attendance', 'classroom', 'history'],
|
||||||
|
teacher: ['dashboard', 'attendance', 'behavior', 'history']
|
||||||
|
}
|
||||||
|
return permMap[role] || []
|
||||||
|
})
|
||||||
|
|
||||||
|
const hasPermission = (page) => {
|
||||||
|
return permissions.value.includes(page)
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 登录成功后设置 token 和用户信息 */
|
||||||
|
const setLoginData = (data) => {
|
||||||
|
token.value = data.token
|
||||||
|
userInfo.value = {
|
||||||
|
userId: data.userId,
|
||||||
|
username: data.username,
|
||||||
|
realName: data.realName,
|
||||||
|
avatar: data.avatar,
|
||||||
|
role: data.role,
|
||||||
|
roleName: data.roleName,
|
||||||
|
schoolName: data.schoolName
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 退出登录 */
|
||||||
|
const logout = async () => {
|
||||||
|
try {
|
||||||
|
await logoutApi()
|
||||||
|
} catch {
|
||||||
|
// 即使接口失败，也清除本地状态
|
||||||
|
}
|
||||||
|
token.value = ''
|
||||||
|
userInfo.value = {
|
||||||
|
userId: null,
|
||||||
|
username: '',
|
||||||
|
realName: '',
|
||||||
|
avatar: '',
|
||||||
|
role: '',
|
||||||
|
roleName: '',
|
||||||
|
schoolName: ''
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
token,
|
||||||
|
userInfo,
|
||||||
|
name,
|
||||||
|
roleName: roleLabel,
|
||||||
|
permissions,
|
||||||
|
hasPermission,
|
||||||
|
setLoginData,
|
||||||
|
logout
|
||||||
|
}
|
||||||
|
}, {
|
||||||
|
persist: true
|
||||||
|
})
|
||||||
@ -0,0 +1,184 @@
|
|||||||
|
// === element-plus 样式覆盖 ===
|
||||||
|
|
||||||
|
// 覆盖 Element Plus 主色
|
||||||
|
:root {
|
||||||
|
--el-color-primary: #52c41a;
|
||||||
|
--el-color-primary-light-3: #84d155;
|
||||||
|
--el-color-primary-light-5: #a7e280;
|
||||||
|
--el-color-primary-light-7: #c9efb0;
|
||||||
|
--el-color-primary-light-8: #dcf5cc;
|
||||||
|
--el-color-primary-light-9: #eefae6;
|
||||||
|
--el-color-primary-dark-2: #49b018;
|
||||||
|
--el-color-success: #52c41a;
|
||||||
|
--el-color-danger: #f5222d;
|
||||||
|
--el-color-warning: #faad14;
|
||||||
|
--el-color-info: #909399;
|
||||||
|
--el-border-radius-base: 6px;
|
||||||
|
--el-border-radius-small: 4px;
|
||||||
|
--el-border-radius-round: 20px;
|
||||||
|
--el-font-family: 'Source Han Sans CN', '思源黑体', 'Noto Sans SC',
|
||||||
|
'PingFang SC', 'Microsoft YaHei', sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 按钮样式覆盖
|
||||||
|
.el-button {
|
||||||
|
&--primary {
|
||||||
|
--el-button-bg-color: #52c41a;
|
||||||
|
--el-button-border-color: #52c41a;
|
||||||
|
--el-button-hover-bg-color: #49b018;
|
||||||
|
--el-button-hover-border-color: #49b018;
|
||||||
|
--el-button-active-bg-color: #3d9412;
|
||||||
|
--el-button-active-border-color: #3d9412;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 输入框样式覆盖
|
||||||
|
.el-input {
|
||||||
|
--el-input-border-radius: 6px;
|
||||||
|
|
||||||
|
.el-input__wrapper {
|
||||||
|
border-radius: 6px;
|
||||||
|
box-shadow: 0 0 0 1px #d9d9d9 inset;
|
||||||
|
transition: box-shadow 0.2s ease;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
box-shadow: 0 0 0 1px #b3b3b3 inset;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-focus .el-input__wrapper {
|
||||||
|
box-shadow: 0 0 0 1px #1890ff inset !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 菜单样式覆盖
|
||||||
|
.el-menu {
|
||||||
|
border-right: none !important;
|
||||||
|
|
||||||
|
.el-menu-item {
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: 2px 8px;
|
||||||
|
height: 44px;
|
||||||
|
line-height: 44px;
|
||||||
|
font-size: 14px;
|
||||||
|
transition: background-color 0.2s ease, color 0.2s ease;
|
||||||
|
will-change: background-color;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: #e8f9e0 !important;
|
||||||
|
color: #52c41a !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-active {
|
||||||
|
background: linear-gradient(135deg, #52c41a, #49b018) !important;
|
||||||
|
color: #ffffff !important;
|
||||||
|
font-weight: 500;
|
||||||
|
box-shadow: 0 2px 8px rgba(82, 196, 26, 0.3);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-sub-menu {
|
||||||
|
margin: 2px 8px;
|
||||||
|
|
||||||
|
.el-sub-menu__title {
|
||||||
|
border-radius: 8px;
|
||||||
|
height: 44px;
|
||||||
|
line-height: 44px;
|
||||||
|
transition: background-color 0.2s ease, color 0.2s ease;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: #e8f9e0 !important;
|
||||||
|
color: #52c41a !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 卡片样式覆盖
|
||||||
|
.el-card {
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid #f0f0f0;
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
|
||||||
|
transition: box-shadow 0.3s ease;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 表格样式覆盖
|
||||||
|
.el-table {
|
||||||
|
--el-table-border-color: #f0f0f0;
|
||||||
|
--el-table-header-bg-color: #fafafa;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: 14px;
|
||||||
|
|
||||||
|
th.el-table__cell {
|
||||||
|
background-color: #fafafa;
|
||||||
|
color: #262626;
|
||||||
|
font-weight: 500;
|
||||||
|
height: 48px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__row {
|
||||||
|
transition: background-color 0.15s ease;
|
||||||
|
|
||||||
|
&:hover > td.el-table__cell {
|
||||||
|
background-color: #e8f9e0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 分页样式
|
||||||
|
.el-pagination {
|
||||||
|
--el-pagination-hover-color: #52c41a;
|
||||||
|
margin-top: 16px;
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 弹窗样式
|
||||||
|
.el-dialog {
|
||||||
|
border-radius: 12px;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.el-dialog__header {
|
||||||
|
margin: 0;
|
||||||
|
padding: 16px 20px;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-dialog__body {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-dialog__footer {
|
||||||
|
padding: 12px 20px;
|
||||||
|
border-top: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 标记/标签样式
|
||||||
|
.el-tag {
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 下拉菜单样式
|
||||||
|
.el-dropdown-menu {
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
|
||||||
|
border: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 选择器样式
|
||||||
|
.el-select {
|
||||||
|
--el-select-border-color-hover: #b3b3b3;
|
||||||
|
--el-select-input-focus-border-color: #1890ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 日期选择器样式
|
||||||
|
.el-date-editor {
|
||||||
|
--el-date-editor-active-border-color: #1890ff;
|
||||||
|
}
|
||||||
@ -0,0 +1,195 @@
|
|||||||
|
// === 全局样式 ===
|
||||||
|
@use './variables.scss' as *;
|
||||||
|
|
||||||
|
*,
|
||||||
|
*::before,
|
||||||
|
*::after {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
height: 100%;
|
||||||
|
font-family: $font-family;
|
||||||
|
font-size: $font-body;
|
||||||
|
color: $text-primary;
|
||||||
|
background-color: $bg-page;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
}
|
||||||
|
|
||||||
|
#app {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: $color-primary;
|
||||||
|
text-decoration: none;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: $color-primary-hover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 滚动条样式
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
width: 6px;
|
||||||
|
height: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-track {
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
background: #d9d9d9;
|
||||||
|
border-radius: 3px;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: #bfbfbf;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 通用工具类
|
||||||
|
.flex-center {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flex-between {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flex-start {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-primary {
|
||||||
|
color: $text-primary;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-secondary {
|
||||||
|
color: $text-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-green {
|
||||||
|
color: $color-primary;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-red {
|
||||||
|
color: $color-danger;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-small {
|
||||||
|
font-size: $font-caption;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 页面通用布局
|
||||||
|
.page-container {
|
||||||
|
padding: 20px;
|
||||||
|
min-height: calc(100vh - $navbar-height);
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-header {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
|
||||||
|
.page-title {
|
||||||
|
font-size: $font-title;
|
||||||
|
font-weight: 700;
|
||||||
|
color: $text-primary;
|
||||||
|
margin-bottom: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-subtitle {
|
||||||
|
font-size: $font-caption;
|
||||||
|
color: $text-secondary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 筛选区样式
|
||||||
|
.filter-bar {
|
||||||
|
background: $bg-card;
|
||||||
|
border-radius: $radius-md;
|
||||||
|
padding: 16px 20px;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
box-shadow: $shadow-card;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 统计卡片区域
|
||||||
|
.stats-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
|
||||||
|
gap: 16px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 骨架屏动画
|
||||||
|
@keyframes skeleton-loading {
|
||||||
|
0% {
|
||||||
|
background-position: -200px 0;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
background-position: calc(200px + 100%) 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.skeleton {
|
||||||
|
background: linear-gradient(90deg, #f0f0f0 25%, #e8e8e8 37%, #f0f0f0 63%);
|
||||||
|
background-size: 400% 100%;
|
||||||
|
animation: skeleton-loading 1.4s ease infinite;
|
||||||
|
border-radius: $radius-md;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 淡入动画
|
||||||
|
@keyframes fadeInUp {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(12px);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.fade-in-up {
|
||||||
|
animation: fadeInUp 0.4s ease forwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 脉冲动画
|
||||||
|
@keyframes pulse {
|
||||||
|
0%,
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.pulse {
|
||||||
|
animation: pulse 2s ease-in-out infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 响应式布局辅助
|
||||||
|
@media (max-width: $breakpoint-sm) {
|
||||||
|
.stats-grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-bar {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: stretch;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,2 @@
|
|||||||
|
const fileHttp = 'https://shipllm.ngsk.tech:7001/storage'
|
||||||
|
export default fileHttp
|
||||||
@ -0,0 +1,272 @@
|
|||||||
|
<template>
|
||||||
|
<el-dialog
|
||||||
|
:model-value="props.modelValue"
|
||||||
|
@update:model-value="emit('update:modelValue', $event)"
|
||||||
|
:title="`${props.detailData.courseName} - 考勤详情`"
|
||||||
|
width="1030px"
|
||||||
|
destroy-on-close
|
||||||
|
>
|
||||||
|
<div class="detail-header">
|
||||||
|
<span>{{ props.detailData.time }}</span>
|
||||||
|
<span>{{ props.detailData.classroom }}</span>
|
||||||
|
<span>应到 {{ props.detailData.total }} / 实到 {{ props.detailData.actual }}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<el-tabs v-model="detailTab">
|
||||||
|
<el-tab-pane label="考勤详情" name="detail">
|
||||||
|
<!-- 搜索区 -->
|
||||||
|
<div class="search-bar">
|
||||||
|
<el-input v-model="searchForm.studentName" placeholder="学生姓名" clearable size="default" style="width: 180px" @clear="handleSearch" />
|
||||||
|
<el-select v-model="searchForm.attStatus" placeholder="考勤状态" clearable size="default" style="width: 140px" @change="handleSearch">
|
||||||
|
<el-option label="未签到" :value="0" />
|
||||||
|
<el-option label="正常" :value="1" />
|
||||||
|
<el-option label="迟到" :value="2" />
|
||||||
|
<el-option label="缺勤" :value="3" />
|
||||||
|
<el-option label="早退" :value="4" />
|
||||||
|
<el-option label="请假" :value="5" />
|
||||||
|
</el-select>
|
||||||
|
<el-button type="primary" size="default" @click="handleSearch">查询</el-button>
|
||||||
|
<el-button size="default" @click="handleReset">重置</el-button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<el-table :data="detailList" stripe v-loading="loading" max-height="380" @selection-change="handleSelectionChange">
|
||||||
|
<el-table-column type="selection" width="45" />
|
||||||
|
<el-table-column prop="studentNo" label="学号" width="120" />
|
||||||
|
<el-table-column prop="studentName" label="姓名" width="100" />
|
||||||
|
<el-table-column prop="attDate" label="考勤日期" width="120" />
|
||||||
|
<el-table-column prop="checkInTime" label="签到时间" width="170" />
|
||||||
|
<el-table-column prop="checkOutTime" label="签退时间" width="170" />
|
||||||
|
<el-table-column prop="faceSimilarity" label="人脸相似度" width="110" align="center">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<span>{{ (row.faceSimilarity * 100).toFixed(1) }}%</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="attStatus" label="考勤状态" width="120" align="center">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<template v-if="editingId === row.id">
|
||||||
|
<el-select
|
||||||
|
ref="selectRef"
|
||||||
|
v-model="row.attStatus"
|
||||||
|
size="small"
|
||||||
|
style="width: 90px"
|
||||||
|
@change="(val) => handleStatusChange(row, val)"
|
||||||
|
@visible-change="(visible) => { if (!visible) editingId = null }"
|
||||||
|
>
|
||||||
|
<el-option label="未签到" :value="0" />
|
||||||
|
<el-option label="正常" :value="1" />
|
||||||
|
<el-option label="迟到" :value="2" />
|
||||||
|
<el-option label="缺勤" :value="3" />
|
||||||
|
<el-option label="早退" :value="4" />
|
||||||
|
<el-option label="请假" :value="5" />
|
||||||
|
</el-select>
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
<el-tag
|
||||||
|
size="small"
|
||||||
|
:type="statusTagType(row.attStatus)"
|
||||||
|
style="cursor: pointer"
|
||||||
|
@click="startEditing(row)"
|
||||||
|
>
|
||||||
|
{{ statusLabel(row.attStatus) }}
|
||||||
|
</el-tag>
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
<el-pagination
|
||||||
|
v-model:current-page="pagination.current"
|
||||||
|
v-model:page-size="pagination.pageSize"
|
||||||
|
:total="total"
|
||||||
|
:page-sizes="[10, 20, 50]"
|
||||||
|
layout="total, sizes, prev, pager, next"
|
||||||
|
background
|
||||||
|
style="margin-top: 16px; justify-content: flex-end"
|
||||||
|
/>
|
||||||
|
</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
|
||||||
|
<template #footer>
|
||||||
|
<el-button @click="emit('update:modelValue', false)">关闭</el-button>
|
||||||
|
<el-button type="primary" @click="batchExport">批量导出</el-button>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref, reactive, watch, nextTick } from 'vue'
|
||||||
|
import { ElMessage } from 'element-plus'
|
||||||
|
import { getDetailPage, updateDetailStatus } from '@/api/attendance'
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
modelValue: { type: Boolean, default: false },
|
||||||
|
detailData: { type: Object, default: () => ({}) }
|
||||||
|
})
|
||||||
|
|
||||||
|
const emit = defineEmits(['update:modelValue'])
|
||||||
|
|
||||||
|
const detailTab = ref('detail')
|
||||||
|
const loading = ref(false)
|
||||||
|
const detailList = ref([])
|
||||||
|
const total = ref(0)
|
||||||
|
|
||||||
|
const searchForm = reactive({
|
||||||
|
studentName: '',
|
||||||
|
attStatus: null
|
||||||
|
})
|
||||||
|
|
||||||
|
const pagination = reactive({
|
||||||
|
current: 1,
|
||||||
|
pageSize: 10
|
||||||
|
})
|
||||||
|
|
||||||
|
const statusMap = {
|
||||||
|
0: { label: '未签到', type: 'warning' },
|
||||||
|
1: { label: '正常', type: 'success' },
|
||||||
|
2: { label: '迟到', type: '' },
|
||||||
|
3: { label: '缺勤', type: 'danger' },
|
||||||
|
4: { label: '早退', type: '' },
|
||||||
|
5: { label: '请假', type: 'warning' }
|
||||||
|
}
|
||||||
|
|
||||||
|
const statusLabel = (val) => statusMap[val]?.label || '未知'
|
||||||
|
const statusTagType = (val) => statusMap[val]?.type || 'info'
|
||||||
|
|
||||||
|
// 点击编辑状态
|
||||||
|
const editingId = ref(null)
|
||||||
|
const selectRef = ref(null)
|
||||||
|
|
||||||
|
const startEditing = async (row) => {
|
||||||
|
editingId.value = row.id
|
||||||
|
await nextTick()
|
||||||
|
selectRef.value?.focus?.()
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 更新单条考勤状态 */
|
||||||
|
const handleStatusChange = async (row, newStatus) => {
|
||||||
|
try {
|
||||||
|
const res = await updateDetailStatus(row.id, newStatus)
|
||||||
|
if (res?.code === 200) {
|
||||||
|
ElMessage.success('状态更新成功')
|
||||||
|
editingId.value = null
|
||||||
|
} else {
|
||||||
|
ElMessage.error(res?.msg || '更新失败')
|
||||||
|
fetchDetailList()
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
ElMessage.error('更新失败')
|
||||||
|
fetchDetailList()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 选中项
|
||||||
|
const selectedRows = ref([])
|
||||||
|
const handleSelectionChange = (rows) => {
|
||||||
|
selectedRows.value = rows
|
||||||
|
}
|
||||||
|
|
||||||
|
const fetchDetailList = async () => {
|
||||||
|
loading.value = true
|
||||||
|
try {
|
||||||
|
const params = {
|
||||||
|
current: pagination.current,
|
||||||
|
size: pagination.pageSize,
|
||||||
|
taskId: props.detailData.id
|
||||||
|
}
|
||||||
|
if (searchForm.studentName) params.studentName = searchForm.studentName
|
||||||
|
if (searchForm.attStatus !== null && searchForm.attStatus !== '') params.attStatus = searchForm.attStatus
|
||||||
|
const res = await getDetailPage(params)
|
||||||
|
if (res?.code === 200 && res.data) {
|
||||||
|
detailList.value = res.data.records || []
|
||||||
|
total.value = res.data.total || 0
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
detailList.value = []
|
||||||
|
total.value = 0
|
||||||
|
} finally {
|
||||||
|
loading.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleSearch = () => {
|
||||||
|
pagination.current = 1
|
||||||
|
fetchDetailList()
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleReset = () => {
|
||||||
|
searchForm.studentName = ''
|
||||||
|
searchForm.attStatus = null
|
||||||
|
pagination.current = 1
|
||||||
|
fetchDetailList()
|
||||||
|
}
|
||||||
|
|
||||||
|
const batchExport = () => {
|
||||||
|
const list = selectedRows.value.length > 0 ? selectedRows.value : detailList.value
|
||||||
|
if (list.length === 0) {
|
||||||
|
ElMessage.warning('没有数据可导出')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
// CSV 表头
|
||||||
|
const headers = ['学号', '姓名', '考勤日期', '签到时间', '签退时间', '人脸相似度', '考勤状态']
|
||||||
|
const rows = list.map(row => [
|
||||||
|
row.studentNo,
|
||||||
|
row.studentName,
|
||||||
|
row.attDate,
|
||||||
|
row.checkInTime,
|
||||||
|
row.checkOutTime,
|
||||||
|
row.faceSimilarity ? (row.faceSimilarity * 100).toFixed(1) + '%' : '',
|
||||||
|
statusLabel(row.attStatus)
|
||||||
|
])
|
||||||
|
|
||||||
|
// 生成 CSV 内容
|
||||||
|
const csvContent = [headers, ...rows]
|
||||||
|
.map(r => r.map(cell => `"${String(cell ?? '').replace(/"/g, '""')}"`).join(','))
|
||||||
|
.join('\n')
|
||||||
|
const BOM = '\uFEFF'
|
||||||
|
const blob = new Blob([BOM + csvContent], { type: 'text/csv;charset=utf-8;' })
|
||||||
|
const url = URL.createObjectURL(blob)
|
||||||
|
const a = document.createElement('a')
|
||||||
|
a.href = url
|
||||||
|
a.download = `考勤详情_${props.detailData.courseName || ''}_${new Date().toLocaleDateString()}.csv`
|
||||||
|
a.click()
|
||||||
|
URL.revokeObjectURL(url)
|
||||||
|
ElMessage.success(`已导出 ${list.length} 条记录`)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 弹窗打开时加载数据
|
||||||
|
watch(() => props.modelValue, (val) => {
|
||||||
|
if (val) {
|
||||||
|
detailTab.value = 'detail'
|
||||||
|
pagination.current = 1
|
||||||
|
fetchDetailList()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
// 分页变化重新请求
|
||||||
|
watch(() => pagination.current, () => fetchDetailList())
|
||||||
|
watch(() => pagination.pageSize, () => {
|
||||||
|
pagination.current = 1
|
||||||
|
fetchDetailList()
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.detail-header {
|
||||||
|
display: flex;
|
||||||
|
gap: 24px;
|
||||||
|
padding: 12px 16px;
|
||||||
|
background: #f5f7fa;
|
||||||
|
border-radius: 8px;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
font-size: 13px;
|
||||||
|
color: #525252;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search-bar {
|
||||||
|
display: flex;
|
||||||
|
gap: 12px;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,237 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<!-- 筛选区 -->
|
||||||
|
<div class="filter-bar">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="filters.attDate"
|
||||||
|
type="date"
|
||||||
|
placeholder="选择日期"
|
||||||
|
size="default"
|
||||||
|
/>
|
||||||
|
<el-button type="primary" :icon="Search" @click="handleSearch">搜索</el-button>
|
||||||
|
<el-button @click="handleReset">重置</el-button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 统计条 -->
|
||||||
|
<div class="summary-bar">
|
||||||
|
<div class="summary-item">
|
||||||
|
<span class="summary-label">总课程数</span>
|
||||||
|
<span class="summary-value">{{ tableData.length }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="summary-item">
|
||||||
|
<span class="summary-label">应到总人次</span>
|
||||||
|
<span class="summary-value">{{ totalShould }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="summary-item">
|
||||||
|
<span class="summary-label">实到总人次</span>
|
||||||
|
<span class="summary-value green">{{ totalActual }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="summary-item">
|
||||||
|
<span class="summary-label">平均缺勤率</span>
|
||||||
|
<span class="summary-value red">{{ avgAbsentRate }}%</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 数据表格 -->
|
||||||
|
<el-table :data="tableData" stripe v-loading="loading">
|
||||||
|
<el-table-column prop="courseName" label="课程名称" min-width="150" />
|
||||||
|
<el-table-column prop="teacher" label="授课教师" width="100" align="center" />
|
||||||
|
<el-table-column prop="classroom" label="教室" width="120" align="center" />
|
||||||
|
<el-table-column prop="time" label="上课时间" width="320" align="center" sortable>
|
||||||
|
<template #default="{ row }">
|
||||||
|
<span v-html="row.time"></span>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="total" label="应到" width="70" align="center" />
|
||||||
|
<el-table-column prop="actual" label="实到" width="70" align="center" />
|
||||||
|
<el-table-column prop="absentCount" label="缺勤" width="70" align="center">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<span :class="{ 'text-red': row.absentCount > 3 }">{{ row.absentCount }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="absentRate" label="缺勤率" width="90" align="center" sortable>
|
||||||
|
<template #default="{ row }">
|
||||||
|
<el-tag :type="getAbsentType(row.absentRate)" size="small">{{ row.absentRate }}%</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="操作" width="140" align="center" fixed="right">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<el-button link type="primary" size="small" @click="$emit('showDetail', row)">详情</el-button>
|
||||||
|
<el-button link size="small" @click="handleExport(row)">导出</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
<el-pagination
|
||||||
|
v-model:current-page="pagination.current"
|
||||||
|
v-model:page-size="pagination.pageSize"
|
||||||
|
:total="total"
|
||||||
|
:page-sizes="[10, 20, 50]"
|
||||||
|
layout="total, sizes, prev, pager, next"
|
||||||
|
background
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref, reactive, computed, onMounted, watch } from 'vue'
|
||||||
|
import { ElMessage } from 'element-plus'
|
||||||
|
import { Search } from '@element-plus/icons-vue'
|
||||||
|
import { getRecordPage, getDetailPage } from '@/api/attendance'
|
||||||
|
import { useNameMaps } from '@/composables/useNameMaps'
|
||||||
|
|
||||||
|
defineEmits(['showDetail'])
|
||||||
|
|
||||||
|
const { loadNameMaps, courseName, teacherName, className, roomName } = useNameMaps()
|
||||||
|
|
||||||
|
const loading = ref(false)
|
||||||
|
const filters = reactive({ attDate: null })
|
||||||
|
const pagination = reactive({ current: 1, pageSize: 10 })
|
||||||
|
const total = ref(0)
|
||||||
|
|
||||||
|
/** 将接口记录转为表格行数据 */
|
||||||
|
const mapRecord = (item) => ({
|
||||||
|
courseName: courseName(item.courseId),
|
||||||
|
teacher: teacherName(item.teacherId),
|
||||||
|
classroom: roomName(item.classroomId),
|
||||||
|
className: className(item.classId),
|
||||||
|
time: `${item.startTime || ''} 至 ${item.endTime || ''}`,
|
||||||
|
total: item.totalCount,
|
||||||
|
actual: item.actualCount,
|
||||||
|
absentCount: item.absentCount,
|
||||||
|
absentRate: item.absentRate ?? 0,
|
||||||
|
id: item.id
|
||||||
|
})
|
||||||
|
|
||||||
|
const tableData = ref([])
|
||||||
|
|
||||||
|
const fetchData = async () => {
|
||||||
|
loading.value = true
|
||||||
|
try {
|
||||||
|
const params = {
|
||||||
|
current: pagination.current,
|
||||||
|
size: pagination.pageSize
|
||||||
|
}
|
||||||
|
if (filters.attDate) {
|
||||||
|
const d = new Date(filters.attDate)
|
||||||
|
params.attDate = `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`
|
||||||
|
}
|
||||||
|
const res = await getRecordPage(params)
|
||||||
|
const { records, total: totalCount } = res.data
|
||||||
|
if (Array.isArray(records)) {
|
||||||
|
tableData.value = records.map(mapRecord)
|
||||||
|
}
|
||||||
|
total.value = totalCount ?? 0
|
||||||
|
} catch {
|
||||||
|
// 请求失败保持当前数据
|
||||||
|
} finally {
|
||||||
|
loading.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 分页变化时重新请求
|
||||||
|
watch(() => pagination.current, () => fetchData())
|
||||||
|
watch(() => pagination.pageSize, () => {
|
||||||
|
pagination.current = 1
|
||||||
|
fetchData()
|
||||||
|
})
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
await loadNameMaps()
|
||||||
|
fetchData()
|
||||||
|
})
|
||||||
|
|
||||||
|
const totalShould = computed(() => tableData.value.reduce((s, r) => s + r.total, 0))
|
||||||
|
const totalActual = computed(() => tableData.value.reduce((s, r) => s + r.actual, 0))
|
||||||
|
const avgAbsentRate = computed(() => {
|
||||||
|
return tableData.value.length
|
||||||
|
? (tableData.value.reduce((s, r) => s + r.absentRate, 0) / tableData.value.length).toFixed(1)
|
||||||
|
: 0
|
||||||
|
})
|
||||||
|
|
||||||
|
const getAbsentType = (rate) => (rate >= 10 ? 'danger' : rate > 5 ? 'warning' : 'success')
|
||||||
|
|
||||||
|
const handleSearch = () => {
|
||||||
|
pagination.current = 1
|
||||||
|
fetchData()
|
||||||
|
}
|
||||||
|
const handleReset = () => {
|
||||||
|
Object.assign(filters, { attDate: null })
|
||||||
|
pagination.current = 1
|
||||||
|
fetchData()
|
||||||
|
}
|
||||||
|
const handleExport = async () => {
|
||||||
|
try {
|
||||||
|
const res = await getDetailPage({ current: 1, size: 9999 })
|
||||||
|
const list = res?.data?.records || []
|
||||||
|
if (list.length === 0) {
|
||||||
|
ElMessage.warning('暂无考勤详情数据')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const statusLabels = { 0: '未签到', 1: '正常', 2: '迟到', 3: '缺勤', 4: '早退', 5: '请假' }
|
||||||
|
const headers = ['学号', '姓名', '考勤日期', '签到时间', '签退时间', '人脸相似度', '考勤状态']
|
||||||
|
const rows = list.map(r => [
|
||||||
|
r.studentNo, r.studentName, r.attDate, r.checkInTime, r.checkOutTime,
|
||||||
|
r.faceSimilarity ? (r.faceSimilarity * 100).toFixed(1) + '%' : '',
|
||||||
|
statusLabels[r.attStatus] || '未知'
|
||||||
|
])
|
||||||
|
const csv = [headers, ...rows]
|
||||||
|
.map(r => r.map(c => `"${String(c ?? '').replace(/"/g, '""')}"`).join(','))
|
||||||
|
.join('\n')
|
||||||
|
const blob = new Blob(['\uFEFF' + csv], { type: 'text/csv;charset=utf-8;' })
|
||||||
|
const a = document.createElement('a')
|
||||||
|
a.href = URL.createObjectURL(blob)
|
||||||
|
a.download = `考勤明细_${new Date().toLocaleDateString()}.csv`
|
||||||
|
a.click()
|
||||||
|
URL.revokeObjectURL(a.href)
|
||||||
|
ElMessage.success(`已导出 ${list.length} 条记录`)
|
||||||
|
} catch {
|
||||||
|
ElMessage.error('导出失败')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.filter-bar {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 10px;
|
||||||
|
margin-bottom: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.summary-bar {
|
||||||
|
display: flex;
|
||||||
|
gap: 40px;
|
||||||
|
padding: 12px 16px;
|
||||||
|
margin-bottom: 14px;
|
||||||
|
background: #f5f7fa;
|
||||||
|
border-radius: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.summary-item {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.summary-label {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #bfbfbf;
|
||||||
|
}
|
||||||
|
|
||||||
|
.summary-value {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #262626;
|
||||||
|
|
||||||
|
&.green { color: #52c41a; }
|
||||||
|
&.red { color: #f5222d; }
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-red {
|
||||||
|
color: #f5222d;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,168 @@
|
|||||||
|
<template>
|
||||||
|
<div class="chart-card">
|
||||||
|
<div class="chart-header">
|
||||||
|
<h3>各班级出勤率对比</h3>
|
||||||
|
</div>
|
||||||
|
<div v-if="classRank && classRank.length > 0" class="class-rank">
|
||||||
|
<div v-for="(item, index) in classRank" :key="index" class="rank-item">
|
||||||
|
<span class="rank-num" :class="{ top: index < 3 }">{{ pageOffset + index + 1 }}</span>
|
||||||
|
<span class="rank-name">{{ item.className }}</span>
|
||||||
|
<div class="rank-bar-wrap">
|
||||||
|
<div
|
||||||
|
class="rank-bar"
|
||||||
|
:style="{ width: item.attendanceRate + '%', background: index < 3 ? '#52c41a' : '#1890ff' }"
|
||||||
|
></div>
|
||||||
|
</div>
|
||||||
|
<span class="rank-value">{{ item.attendanceRate }}%</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-else class="no-data">
|
||||||
|
<el-empty description="暂无数据"></el-empty>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<el-pagination
|
||||||
|
v-if="total > 0"
|
||||||
|
v-model:current-page="current"
|
||||||
|
v-model:page-size="size"
|
||||||
|
:total="total"
|
||||||
|
layout="prev, pager, next"
|
||||||
|
background
|
||||||
|
size="small"
|
||||||
|
style="margin-top: 16px; justify-content: center"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref, computed, watch, onMounted } from 'vue'
|
||||||
|
import { getRanking } from '@/api/dashboard'
|
||||||
|
|
||||||
|
const classRank = ref([])
|
||||||
|
const current = ref(1)
|
||||||
|
const size = ref(8)
|
||||||
|
const total = ref(0)
|
||||||
|
const pages = ref(0)
|
||||||
|
|
||||||
|
const pageOffset = computed(() => (current.value - 1) * size.value)
|
||||||
|
|
||||||
|
const fetchRanking = async () => {
|
||||||
|
try {
|
||||||
|
const res = await getRanking({ current: current.value, size: size.value })
|
||||||
|
const data = res.data
|
||||||
|
if (data && data.records && data.records.length > 0) {
|
||||||
|
classRank.value = data.records
|
||||||
|
total.value = data.total ?? 0
|
||||||
|
pages.value = data.pages ?? 0
|
||||||
|
} else {
|
||||||
|
classRank.value = []
|
||||||
|
total.value = 0
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
classRank.value = []
|
||||||
|
total.value = 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
fetchRanking()
|
||||||
|
})
|
||||||
|
|
||||||
|
watch(() => current.value, () => fetchRanking())
|
||||||
|
watch(() => size.value, () => {
|
||||||
|
current.value = 1
|
||||||
|
fetchRanking()
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.chart-card {
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 20px;
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.chart-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.class-rank {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rank-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rank-num {
|
||||||
|
width: 22px;
|
||||||
|
height: 22px;
|
||||||
|
border-radius: 6px;
|
||||||
|
background: #f0f0f0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #525252;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
&.top {
|
||||||
|
background: #52c41a;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.rank-name {
|
||||||
|
width: 140px;
|
||||||
|
font-size: 13px;
|
||||||
|
color: #262626;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rank-bar-wrap {
|
||||||
|
flex: 1;
|
||||||
|
height: 8px;
|
||||||
|
background: #f0f0f0;
|
||||||
|
border-radius: 4px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rank-bar {
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 4px;
|
||||||
|
transition: width 0.6s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rank-value {
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
width: 45px;
|
||||||
|
text-align: right;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.no-data {
|
||||||
|
min-height: 100px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,231 @@
|
|||||||
|
<template>
|
||||||
|
<div class="page-container">
|
||||||
|
<!-- 核心数据区 -->
|
||||||
|
<div class="stats-grid">
|
||||||
|
<DataCard
|
||||||
|
label="课程平均出勤率"
|
||||||
|
:value="stats.attendanceRate"
|
||||||
|
unit="%"
|
||||||
|
icon="UserFilled"
|
||||||
|
iconColor="#52c41a"
|
||||||
|
iconBg="#e8f9e0"
|
||||||
|
:trend="2.5"
|
||||||
|
:date="currentDate"
|
||||||
|
@click="activeTab = 'manage'"
|
||||||
|
/>
|
||||||
|
<DataCard
|
||||||
|
label="教室平均使用率"
|
||||||
|
:value="stats.classroomUsage"
|
||||||
|
unit="%"
|
||||||
|
icon="OfficeBuilding"
|
||||||
|
iconColor="#1890ff"
|
||||||
|
iconBg="#e8f4ff"
|
||||||
|
:trend="-1.2"
|
||||||
|
@click="$router.push('/bigscreen')"
|
||||||
|
/>
|
||||||
|
<DataCard
|
||||||
|
label="异常行为预警数"
|
||||||
|
:value="stats.warningCount"
|
||||||
|
unit="次"
|
||||||
|
icon="WarningFilled"
|
||||||
|
iconColor="#f5222d"
|
||||||
|
iconBg="#fff1f0"
|
||||||
|
:trend="-15.0"
|
||||||
|
@click="$router.push('/behavior')"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 快捷入口 -->
|
||||||
|
<div class="quick-actions">
|
||||||
|
<el-button :icon="VideoCamera" @click="$router.push('/bigscreen')">查看实时监控</el-button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 图表区 -->
|
||||||
|
<div class="charts-row">
|
||||||
|
<AttendanceTrendChart />
|
||||||
|
<ClassRanking />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 考勤记录区 -->
|
||||||
|
<div class="records-card">
|
||||||
|
<el-tabs v-model="activeTab">
|
||||||
|
<el-tab-pane label="考勤概览" name="overview">
|
||||||
|
<div class="records-header">
|
||||||
|
<h3>最近考勤记录</h3>
|
||||||
|
</div>
|
||||||
|
<el-table :data="recentRecords" stripe>
|
||||||
|
<el-table-column prop="courseName" label="课程名称" min-width="150" />
|
||||||
|
<el-table-column prop="teacher" label="授课教师" width="100" align="center" />
|
||||||
|
<el-table-column prop="classroom" label="教室" width="120" align="center" />
|
||||||
|
<el-table-column prop="time" label="上课时间" width="320" sortable align="center">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<span v-html="row.time"></span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="total" label="应到" width="70" align="center" />
|
||||||
|
<el-table-column prop="actual" label="实到" width="70" align="center" />
|
||||||
|
<el-table-column prop="absentRate" label="缺勤率" width="90" align="center">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<el-tag :type="row.absentRate > 10 ? 'danger' : 'success'" size="small">
|
||||||
|
{{ row.absentRate }}%
|
||||||
|
</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
</el-table>
|
||||||
|
</el-tab-pane>
|
||||||
|
|
||||||
|
<el-tab-pane label="考勤管理" name="manage">
|
||||||
|
<AttendanceManage @showDetail="showDetail" />
|
||||||
|
</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 详情弹窗 -->
|
||||||
|
<AttendanceDetail v-model="detailVisible" :detail-data="currentDetail" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref, computed, onMounted } from 'vue'
|
||||||
|
import { ElMessage } from 'element-plus'
|
||||||
|
import { getStats } from '@/api/dashboard'
|
||||||
|
import { getRecordPage } from '@/api/attendance'
|
||||||
|
import { useNameMaps } from '@/composables/useNameMaps'
|
||||||
|
import DataCard from '@/components/DataCard.vue'
|
||||||
|
import AttendanceTrendChart from './components/AttendanceTrendChart.vue'
|
||||||
|
import ClassRanking from './components/ClassRanking.vue'
|
||||||
|
import AttendanceManage from './components/AttendanceManage.vue'
|
||||||
|
import AttendanceDetail from './components/AttendanceDetail.vue'
|
||||||
|
import { VideoCamera } from '@element-plus/icons-vue'
|
||||||
|
|
||||||
|
/** 将接口记录转为表格行数据 */
|
||||||
|
const mapRecord = (item) => ({
|
||||||
|
courseName: courseName(item.courseId),
|
||||||
|
teacher: teacherName(item.teacherId),
|
||||||
|
classroom: roomName(item.classroomId),
|
||||||
|
className: className(item.classId),
|
||||||
|
time: `${item.startTime || ''} - ${item.endTime || ''}`,
|
||||||
|
total: item.totalCount,
|
||||||
|
actual: item.actualCount,
|
||||||
|
absentCount: item.absentCount,
|
||||||
|
absentRate: item.absentRate ?? 0
|
||||||
|
})
|
||||||
|
|
||||||
|
const { loadNameMaps, courseName, teacherName, className, roomName } = useNameMaps()
|
||||||
|
|
||||||
|
const currentDate = computed(() => {
|
||||||
|
const d = new Date()
|
||||||
|
return `${d.getFullYear()}年${d.getMonth() + 1}月${d.getDate()}日`
|
||||||
|
})
|
||||||
|
|
||||||
|
// ===== 数据卡片 =====
|
||||||
|
const stats = ref({ attendanceRate: 0, classroomUsage: 0, warningCount: 0 })
|
||||||
|
|
||||||
|
const fetchStats = async () => {
|
||||||
|
try {
|
||||||
|
const res = await getStats()
|
||||||
|
const data = res.data
|
||||||
|
stats.value = {
|
||||||
|
attendanceRate: data.attendanceRate ?? 0,
|
||||||
|
classroomUsage: data.classroomUsage ?? 0,
|
||||||
|
warningCount: data.warningCount ?? 0
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
// 接口失败保留默认值
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
await loadNameMaps()
|
||||||
|
fetchStats()
|
||||||
|
fetchRecentRecords()
|
||||||
|
})
|
||||||
|
|
||||||
|
// ===== tabs =====
|
||||||
|
const activeTab = ref('overview')
|
||||||
|
|
||||||
|
// ===== 考勤概览 =====
|
||||||
|
const recentRecords = ref([])
|
||||||
|
|
||||||
|
const fetchRecentRecords = async () => {
|
||||||
|
try {
|
||||||
|
const res = await getRecordPage({ current: 1, size: 10, taskStatus: 2 })
|
||||||
|
const { records } = res.data
|
||||||
|
if (Array.isArray(records)) {
|
||||||
|
recentRecords.value = records.map(mapRecord)
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
// 保留空数组
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// ===== 详情弹窗 =====
|
||||||
|
const detailVisible = ref(false)
|
||||||
|
const currentDetail = ref({})
|
||||||
|
|
||||||
|
const showDetail = (row) => {
|
||||||
|
currentDetail.value = row
|
||||||
|
detailVisible.value = true
|
||||||
|
}
|
||||||
|
|
||||||
|
// ===== 导出 =====
|
||||||
|
const handleExport = (row) => ElMessage.success(`正在导出 ${row.courseName} 考勤明细...`)
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.quick-actions {
|
||||||
|
display: flex;
|
||||||
|
gap: 12px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
|
||||||
|
.el-button {
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: 14px;
|
||||||
|
|
||||||
|
&:not(.el-button--primary) {
|
||||||
|
border-color: #d9d9d9;
|
||||||
|
color: #525252;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: #52c41a;
|
||||||
|
border-color: #52c41a;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.charts-row {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1.5fr 1fr;
|
||||||
|
gap: 16px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.records-card {
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 8px 20px 20px;
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.records-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1024px) {
|
||||||
|
.charts-row {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,390 @@
|
|||||||
|
<template>
|
||||||
|
<div class="page-container fade-in-up">
|
||||||
|
<div class="page-header">
|
||||||
|
<h2 class="page-title">历史记录查询</h2>
|
||||||
|
<p class="page-subtitle">查询课程考勤与行为识别历史记录</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 查询区 -->
|
||||||
|
<div class="filter-bar">
|
||||||
|
<el-input
|
||||||
|
v-model="query.courseName"
|
||||||
|
placeholder="输入课程名称"
|
||||||
|
:prefix-icon="Search"
|
||||||
|
clearable
|
||||||
|
size="default"
|
||||||
|
style="width: 200px"
|
||||||
|
/>
|
||||||
|
<el-date-picker v-model="query.date" type="date" placeholder="选择日期" size="default" value-format="YYYY-MM-DD" />
|
||||||
|
<el-button type="primary" :icon="Search" :loading="loading" @click="doSearch">查询</el-button>
|
||||||
|
<el-button :icon="RefreshRight" @click="doReset">重置</el-button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 查询结果 -->
|
||||||
|
<div class="result-section">
|
||||||
|
<div class="section-header">
|
||||||
|
<h3>查询结果</h3>
|
||||||
|
<span class="result-count">共 {{ pagination.total }} 条记录</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-loading="loading" class="image-masonry">
|
||||||
|
<div
|
||||||
|
v-for="record in records"
|
||||||
|
:key="record.id"
|
||||||
|
class="masonry-item"
|
||||||
|
@click="viewDetail(record)"
|
||||||
|
>
|
||||||
|
<div class="masonry-thumb">
|
||||||
|
<div class="water-glass">
|
||||||
|
<div
|
||||||
|
class="water-fill"
|
||||||
|
:style="{
|
||||||
|
height: record.attendanceRate + '%',
|
||||||
|
background: getWaterGradient(record.attendanceRate)
|
||||||
|
}"
|
||||||
|
>
|
||||||
|
<svg class="water-wave" viewBox="0 0 200 24" preserveAspectRatio="none">
|
||||||
|
<path d="M0,12 C40,4 60,20 100,12 C140,4 160,20 200,12 L200,24 L0,24 Z" :fill="getBorderColor(record.attendanceRate)" />
|
||||||
|
</svg>
|
||||||
|
<svg class="water-wave water-wave-back" viewBox="0 0 200 24" preserveAspectRatio="none">
|
||||||
|
<path d="M0,12 C40,18 60,6 100,12 C140,18 160,6 200,12 L200,24 L0,24 Z" :fill="getBorderColor(record.attendanceRate)" opacity="0.4" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<span class="water-value">{{ record.attendanceRate }}%</span>
|
||||||
|
</div>
|
||||||
|
<span class="water-label">出勤率</span>
|
||||||
|
</div>
|
||||||
|
<div class="masonry-info">
|
||||||
|
<span class="masonry-course" :title="record.courseName">{{ record.courseName }}</span>
|
||||||
|
<span class="masonry-time">
|
||||||
|
<el-icon :size="12"><Clock /></el-icon>
|
||||||
|
{{ record.attDate }}
|
||||||
|
</span>
|
||||||
|
<div class="masonry-stats">
|
||||||
|
<span>应到 {{ record.totalCount }}</span>
|
||||||
|
<el-divider direction="vertical" />
|
||||||
|
<span>实到 {{ record.actualCount }}</span>
|
||||||
|
</div>
|
||||||
|
<span class="masonry-absent">
|
||||||
|
缺勤 {{ record.absentCount }} 人
|
||||||
|
</span>
|
||||||
|
<div class="masonry-extra">
|
||||||
|
<span v-if="record.className" class="masonry-tag">{{ record.className }}</span>
|
||||||
|
<span v-if="record.classroomName" class="masonry-tag">{{ record.classroomName }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-if="records.length" class="pagination-wrap">
|
||||||
|
<el-pagination
|
||||||
|
v-model:current-page="pagination.current"
|
||||||
|
:total="pagination.total"
|
||||||
|
:page-size="pagination.size"
|
||||||
|
size="small"
|
||||||
|
background
|
||||||
|
layout="prev, pager, next"
|
||||||
|
@current-change="doSearch"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<el-empty v-if="!loading && records.length === 0" description="暂无数据，请调整查询条件" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 详情弹窗 -->
|
||||||
|
<el-dialog v-model="detailVisible" title="考勤详情" width="520px" destroy-on-close>
|
||||||
|
<div class="detail-container" v-if="currentRecord">
|
||||||
|
<el-descriptions :column="2" border size="small">
|
||||||
|
<el-descriptions-item label="考勤日期">{{ currentRecord.attDate }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="课程ID">{{ currentRecord.courseId }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="开始时间">{{ currentRecord.startTime }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="结束时间">{{ currentRecord.endTime }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="应到人数">{{ currentRecord.totalCount }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="实到人数">{{ currentRecord.actualCount }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="缺勤人数">
|
||||||
|
<el-tag type="danger" size="small">{{ currentRecord.absentCount }}</el-tag>
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="迟到人数">{{ currentRecord.lateCount }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="早退人数">{{ currentRecord.leaveEarlyCount }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="出勤率">
|
||||||
|
<el-tag :type="getRateType(currentRecord.attendanceRate)" size="small">
|
||||||
|
{{ currentRecord.attendanceRate }}%
|
||||||
|
</el-tag>
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref, reactive, onMounted } from 'vue'
|
||||||
|
import { Search, RefreshRight, Clock } from '@element-plus/icons-vue'
|
||||||
|
import { getAttendanceHistory } from '@/api/history'
|
||||||
|
|
||||||
|
const loading = ref(false)
|
||||||
|
const detailVisible = ref(false)
|
||||||
|
const currentRecord = ref(null)
|
||||||
|
|
||||||
|
const query = reactive({
|
||||||
|
courseName: '',
|
||||||
|
date: null
|
||||||
|
})
|
||||||
|
|
||||||
|
const pagination = reactive({
|
||||||
|
current: 1,
|
||||||
|
size: 20,
|
||||||
|
total: 0
|
||||||
|
})
|
||||||
|
|
||||||
|
const records = ref([])
|
||||||
|
|
||||||
|
/** 查询 */
|
||||||
|
const doSearch = async () => {
|
||||||
|
loading.value = true
|
||||||
|
try {
|
||||||
|
const params = {
|
||||||
|
current: pagination.current,
|
||||||
|
size: pagination.size,
|
||||||
|
courseName: query.courseName || undefined,
|
||||||
|
attDate: query.date || undefined
|
||||||
|
}
|
||||||
|
const res = await getAttendanceHistory(params)
|
||||||
|
if (res && res.data) {
|
||||||
|
records.value = res.data.records || []
|
||||||
|
pagination.current = res.data.current
|
||||||
|
pagination.total = res.data.total
|
||||||
|
pagination.size = res.data.size
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
// 错误已在拦截器统一处理
|
||||||
|
} finally {
|
||||||
|
loading.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 重置 */
|
||||||
|
const doReset = () => {
|
||||||
|
query.courseName = ''
|
||||||
|
query.date = null
|
||||||
|
pagination.current = 1
|
||||||
|
doSearch()
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 根据出勤率获取水波颜色 */
|
||||||
|
const getBorderColor = (rate) => {
|
||||||
|
if (rate >= 95) return '#52c41a'
|
||||||
|
if (rate >= 85) return '#faad14'
|
||||||
|
return '#ff4d4f'
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 根据出勤率获取水面渐变 */
|
||||||
|
const getWaterGradient = (rate) => {
|
||||||
|
if (rate >= 95) return 'linear-gradient(180deg, rgba(82,196,26,0.3) 0%, rgba(82,196,26,0.65) 100%)'
|
||||||
|
if (rate >= 85) return 'linear-gradient(180deg, rgba(250,173,20,0.3) 0%, rgba(250,173,20,0.65) 100%)'
|
||||||
|
return 'linear-gradient(180deg, rgba(255,77,79,0.3) 0%, rgba(255,77,79,0.65) 100%)'
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 根据出勤率获取 tag 类型 */
|
||||||
|
const getRateType = (rate) => {
|
||||||
|
if (rate >= 95) return 'success'
|
||||||
|
if (rate >= 85) return 'warning'
|
||||||
|
return 'danger'
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 查看详情 */
|
||||||
|
const viewDetail = (record) => {
|
||||||
|
currentRecord.value = record
|
||||||
|
detailVisible.value = true
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
doSearch()
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.result-section {
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 20px;
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
|
||||||
|
|
||||||
|
.section-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-count {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #bfbfbf;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.image-masonry {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.masonry-item {
|
||||||
|
border-radius: 8px;
|
||||||
|
overflow: hidden;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
border: 1px solid #f0f0f0;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border-color: #52c41a;
|
||||||
|
box-shadow: 0 4px 12px rgba(82, 196, 26, 0.12);
|
||||||
|
transform: translateY(-2px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.masonry-thumb {
|
||||||
|
background: #f9fafb;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 18px 0 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ========== 水球玻璃 ========== */
|
||||||
|
.water-glass {
|
||||||
|
width: 110px;
|
||||||
|
height: 110px;
|
||||||
|
border-radius: 50%;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
background: rgba(255, 255, 255, 0.25);
|
||||||
|
border: 3px solid rgba(255, 255, 255, 0.5);
|
||||||
|
box-shadow:
|
||||||
|
0 0 15px rgba(0, 0, 0, 0.08),
|
||||||
|
inset 0 2px 8px rgba(255, 255, 255, 0.4),
|
||||||
|
inset 0 -2px 8px rgba(0, 0, 0, 0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.water-fill {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 0%;
|
||||||
|
transition: height 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
.water-wave {
|
||||||
|
position: absolute;
|
||||||
|
top: -16px;
|
||||||
|
left: 0;
|
||||||
|
width: 200%;
|
||||||
|
height: 20px;
|
||||||
|
animation: wave 3s linear infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.water-wave-back {
|
||||||
|
animation: wave 4s linear infinite reverse;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes wave {
|
||||||
|
0% { transform: translateX(0); }
|
||||||
|
100% { transform: translateX(-50%); }
|
||||||
|
}
|
||||||
|
|
||||||
|
.water-label {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #8c8c8c;
|
||||||
|
margin-top: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.water-value {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #262626;
|
||||||
|
z-index: 2;
|
||||||
|
pointer-events: none;
|
||||||
|
text-shadow: 0 1px 2px rgba(255, 255, 255, 0.7);
|
||||||
|
}
|
||||||
|
|
||||||
|
.masonry-info {
|
||||||
|
padding: 8px 12px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.masonry-course {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
|
||||||
|
.masonry-time {
|
||||||
|
font-size: 13px;
|
||||||
|
color: #525252;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
|
font-family: monospace;
|
||||||
|
}
|
||||||
|
|
||||||
|
.masonry-stats {
|
||||||
|
font-size: 13px;
|
||||||
|
color: #bfbfbf;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.masonry-absent {
|
||||||
|
font-size: 13px;
|
||||||
|
color: #ff4d4f;
|
||||||
|
}
|
||||||
|
|
||||||
|
.masonry-extra {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 2px;
|
||||||
|
margin-top: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.masonry-tag {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #8c8c8c;
|
||||||
|
background: #f5f5f5;
|
||||||
|
border-radius: 3px;
|
||||||
|
padding: 1px 6px;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pagination-wrap {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-container {
|
||||||
|
.el-descriptions {
|
||||||
|
margin-top: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,223 @@
|
|||||||
|
<template>
|
||||||
|
<div class="page-container fade-in-up">
|
||||||
|
<div class="page-header">
|
||||||
|
<h2 class="page-title">考勤规则设置</h2>
|
||||||
|
<p class="page-subtitle">自定义各课程考勤规则与异常预警参数</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="rules-grid">
|
||||||
|
<!-- 缺勤阈值设置 -->
|
||||||
|
<div class="rule-card">
|
||||||
|
<div class="rule-card-header">
|
||||||
|
<el-icon :size="18" color="#52c41a"><Warning /></el-icon>
|
||||||
|
<h4>缺勤阈值设置</h4>
|
||||||
|
</div>
|
||||||
|
<el-form label-width="120px" label-position="left">
|
||||||
|
<el-form-item label="迟到判定(分钟)">
|
||||||
|
<el-input-number v-model="rules.lateMinutes" :min="1" :max="60" size="default" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="缺勤预警阈值(%)">
|
||||||
|
<el-slider v-model="rules.absentWarning" :min="5" :max="30" :step="5" show-stops />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="迟到预警阈值(%)">
|
||||||
|
<el-slider v-model="rules.lateWarning" :min="5" :max="30" :step="5" show-stops />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 考勤时段设置 -->
|
||||||
|
<div class="rule-card">
|
||||||
|
<div class="rule-card-header">
|
||||||
|
<el-icon :size="18" color="#1890ff"><Clock /></el-icon>
|
||||||
|
<h4>考勤时段设置</h4>
|
||||||
|
</div>
|
||||||
|
<el-form label-width="120px" label-position="left">
|
||||||
|
<el-form-item label="上午考勤时段">
|
||||||
|
<el-time-picker
|
||||||
|
v-model="rules.morningTime"
|
||||||
|
is-range
|
||||||
|
range-separator="-"
|
||||||
|
start-placeholder="开始"
|
||||||
|
end-placeholder="结束"
|
||||||
|
format="HH:mm"
|
||||||
|
size="default"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="下午考勤时段">
|
||||||
|
<el-time-picker
|
||||||
|
v-model="rules.afternoonTime"
|
||||||
|
is-range
|
||||||
|
range-separator="-"
|
||||||
|
start-placeholder="开始"
|
||||||
|
end-placeholder="结束"
|
||||||
|
format="HH:mm"
|
||||||
|
size="default"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="晚自习时段">
|
||||||
|
<el-time-picker
|
||||||
|
v-model="rules.eveningTime"
|
||||||
|
is-range
|
||||||
|
range-separator="-"
|
||||||
|
start-placeholder="开始"
|
||||||
|
end-placeholder="结束"
|
||||||
|
format="HH:mm"
|
||||||
|
size="default"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 异常预警规则 -->
|
||||||
|
<div class="rule-card">
|
||||||
|
<div class="rule-card-header">
|
||||||
|
<el-icon :size="18" color="#f5222d"><Bell /></el-icon>
|
||||||
|
<h4>异常预警规则</h4>
|
||||||
|
</div>
|
||||||
|
<el-form label-width="140px" label-position="left">
|
||||||
|
<el-form-item label="连续缺勤预警(次)">
|
||||||
|
<el-input-number v-model="rules.continuousAbsent" :min="2" :max="10" size="default" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="专注度低阈值(%)">
|
||||||
|
<el-input-number v-model="rules.lowFocus" :min="30" :max="80" :step="5" size="default" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="异常行为频次阈值">
|
||||||
|
<el-input-number v-model="rules.abnormalFreq" :min="1" :max="20" size="default" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="邮件通知管理员">
|
||||||
|
<el-switch v-model="rules.emailNotify" active-color="#52c41a" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="短信通知班主任">
|
||||||
|
<el-switch v-model="rules.smsNotify" active-color="#52c41a" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 课程特殊规则 -->
|
||||||
|
<div class="rule-card rule-card-full">
|
||||||
|
<div class="rule-card-header">
|
||||||
|
<el-icon :size="18" color="#722ed1"><Notebook /></el-icon>
|
||||||
|
<h4>课程特殊考勤规则</h4>
|
||||||
|
</div>
|
||||||
|
<el-table :data="courseRules" stripe>
|
||||||
|
<el-table-column prop="courseName" label="课程名称" min-width="160" />
|
||||||
|
<el-table-column prop="attendanceType" label="考勤方式" width="120" align="center">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<el-tag size="small">{{ row.attendanceType }}</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="absentThreshold" label="缺勤阈值" width="100" align="center" />
|
||||||
|
<el-table-column prop="autoFlag" label="自动标记" width="100" align="center">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<el-switch v-model="row.autoFlag" size="small" active-color="#52c41a" />
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="操作" width="120" align="center">
|
||||||
|
<template #default>
|
||||||
|
<el-button link type="primary" size="small">编辑</el-button>
|
||||||
|
<el-button link type="danger" size="small">删除</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<div style="margin-top: 12px">
|
||||||
|
<el-button :icon="Plus" size="small" @click="addCourseRule">添加课程规则</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="save-bar">
|
||||||
|
<el-button type="primary" size="large" :icon="Check" @click="saveRules">保存配置</el-button>
|
||||||
|
<el-button size="large" @click="resetRules">恢复默认</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref } from 'vue'
|
||||||
|
import { ElMessage } from 'element-plus'
|
||||||
|
import { Plus, Check } from '@element-plus/icons-vue'
|
||||||
|
|
||||||
|
const rules = ref({
|
||||||
|
lateMinutes: 10,
|
||||||
|
absentWarning: 10,
|
||||||
|
lateWarning: 15,
|
||||||
|
morningTime: [new Date(2024, 0, 1, 8, 0), new Date(2024, 0, 1, 12, 0)],
|
||||||
|
afternoonTime: [new Date(2024, 0, 1, 14, 0), new Date(2024, 0, 1, 17, 30)],
|
||||||
|
eveningTime: [new Date(2024, 0, 1, 19, 0), new Date(2024, 0, 1, 21, 30)],
|
||||||
|
continuousAbsent: 3,
|
||||||
|
lowFocus: 50,
|
||||||
|
abnormalFreq: 5,
|
||||||
|
emailNotify: true,
|
||||||
|
smsNotify: false
|
||||||
|
})
|
||||||
|
|
||||||
|
const courseRules = ref([
|
||||||
|
{ courseName: '高等数学A', attendanceType: '人脸签到', absentThreshold: '10%', autoFlag: true },
|
||||||
|
{ courseName: '大学英语B', attendanceType: '人脸签到', absentThreshold: '15%', autoFlag: true },
|
||||||
|
{ courseName: '计算机导论', attendanceType: '人脸+码签到', absentThreshold: '10%', autoFlag: true }
|
||||||
|
])
|
||||||
|
|
||||||
|
const saveRules = () => {
|
||||||
|
ElMessage.success('考勤规则保存成功，已实时生效')
|
||||||
|
}
|
||||||
|
|
||||||
|
const resetRules = () => {
|
||||||
|
ElMessage.info('已恢复默认配置')
|
||||||
|
}
|
||||||
|
|
||||||
|
const addCourseRule = () => {
|
||||||
|
ElMessage.info('添加课程规则功能开发中')
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.rules-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
gap: 16px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rule-card {
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 20px;
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
|
||||||
|
|
||||||
|
&.rule-card-full {
|
||||||
|
grid-column: 1 / -1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.rule-card-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
padding-bottom: 12px;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
|
||||||
|
h4 {
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.save-bar {
|
||||||
|
display: flex;
|
||||||
|
gap: 12px;
|
||||||
|
justify-content: flex-end;
|
||||||
|
|
||||||
|
.el-button {
|
||||||
|
border-radius: 8px;
|
||||||
|
min-width: 120px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1200px) {
|
||||||
|
.rules-grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,24 @@
|
|||||||
|
import { defineConfig } from 'vite'
|
||||||
|
import vue from '@vitejs/plugin-vue'
|
||||||
|
import { fileURLToPath, URL } from 'node:url'
|
||||||
|
|
||||||
|
export default defineConfig({
|
||||||
|
plugins: [vue()],
|
||||||
|
resolve: {
|
||||||
|
alias: {
|
||||||
|
'@': fileURLToPath(new URL('./src', import.meta.url))
|
||||||
|
}
|
||||||
|
},
|
||||||
|
css: {
|
||||||
|
preprocessorOptions: {
|
||||||
|
scss: {
|
||||||
|
additionalData: `@use "@/styles/variables.scss" as *;`
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
server: {
|
||||||
|
host: '0.0.0.0',
|
||||||
|
port: 3000,
|
||||||
|
open: true
|
||||||
|
}
|
||||||
|
})
|
||||||
Loading…
Reference in New Issue