158 lines
3.5 KiB
Plaintext
158 lines
3.5 KiB
Plaintext
<template>
|
||
<view class="admin-page">
|
||
<view class="admin-sections">
|
||
<!-- 提示语 -->
|
||
<view class="admin-card alert-card">
|
||
<text class="alert-title">自定义事件说明：</text>
|
||
<text class="alert-desc">1、新增的事件会在对应的事件类型相关的流程中触发，例：选择用户登录，则在用户登录时执行代码。</text>
|
||
<text class="alert-desc">2、可以使用对应事件类型中的参数，例：$data['nickname'], $data['phone']等。</text>
|
||
<text class="alert-desc">3、调用类的时请写入完整路径，例：\think\facade\Db、\app\services\other\CacheServices::class等。</text>
|
||
</view>
|
||
|
||
<!-- 内容区 -->
|
||
<view class="admin-card content-card">
|
||
<!-- 操作按钮行 -->
|
||
<view class="action-bar">
|
||
<button class="btn primary small" @click="onAdd">新增系统事件</button>
|
||
</view>
|
||
|
||
<!-- 表格（暂无数据） -->
|
||
<view class="table-container list-table">
|
||
<view class="table-header">
|
||
<view class="col col-id"><text>编号</text></view>
|
||
<view class="col col-name"><text>事件名</text></view>
|
||
<view class="col col-type"><text>事件类型</text></view>
|
||
<view class="col col-status"><text>是否开启</text></view>
|
||
<view class="col col-time"><text>创建时间</text></view>
|
||
<view class="col col-ops"><text>操作</text></view>
|
||
</view>
|
||
|
||
<view class="table-body">
|
||
<view class="empty-row">
|
||
<text class="empty-text">暂无数据</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup lang="uts">
|
||
|
||
function onAdd() {
|
||
uni.showToast({ title: '新增系统事件', icon: 'none' })
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.admin-page {
|
||
/* 使用 Layout 的背景和内边距 */
|
||
padding: 0;
|
||
background-color: transparent;
|
||
min-height: auto;
|
||
}
|
||
|
||
.admin-card {
|
||
background-color: #fff;
|
||
border-radius: 4px;
|
||
padding: 20px;
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.alert-card {
|
||
background-color: #fff7e6;
|
||
border: 1px solid #ffd591;
|
||
}
|
||
|
||
.alert-title {
|
||
font-size: 14px;
|
||
color: #fa8c16;
|
||
margin-bottom: 8px;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.alert-desc {
|
||
font-size: 13px;
|
||
color: #fa8c16;
|
||
line-height: 20px;
|
||
margin-bottom: 4px;
|
||
}
|
||
|
||
.action-bar {
|
||
margin-bottom: 16px;
|
||
}
|
||
|
||
.table-container {
|
||
width: 100%;
|
||
border: 1px solid #f0f0f0;
|
||
}
|
||
|
||
.table-header {
|
||
display: flex;
|
||
flex-direction: row;
|
||
background-color: #fafafa;
|
||
border-bottom: 1px solid #f0f0f0;
|
||
}
|
||
|
||
.table-row {
|
||
display: flex;
|
||
flex-direction: row;
|
||
border-bottom: 1px solid #f0f0f0;
|
||
}
|
||
|
||
.col {
|
||
padding: 12px 16px;
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 14px;
|
||
color: #333;
|
||
}
|
||
|
||
.col-id { width: 80px; }
|
||
.col-name { flex: 2; }
|
||
.col-type { flex: 2; }
|
||
.col-status { width: 100px; justify-content: center; }
|
||
.col-time { flex: 2; }
|
||
.col-ops { width: 100px; justify-content: center; }
|
||
|
||
.empty-row {
|
||
height: 200px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
|
||
.empty-text {
|
||
font-size: 14px;
|
||
color: #bfbfbf;
|
||
}
|
||
|
||
.btn {
|
||
height: 32px;
|
||
padding: 0 20px;
|
||
border-radius: 2px;
|
||
font-size: 14px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
cursor: pointer;
|
||
border: 1px solid #d9d9d9;
|
||
background-color: #fff;
|
||
}
|
||
|
||
.btn.primary {
|
||
background-color: #1890ff;
|
||
border-color: #1890ff;
|
||
color: #fff;
|
||
}
|
||
|
||
.btn.small {
|
||
height: 28px;
|
||
padding: 0 10px;
|
||
font-size: 12px;
|
||
}
|
||
</style>
|
||
|
||
|