基本样式变更

This commit is contained in:
2026-09-23 17:38:24 +08:00
parent e464c2ad13
commit 9a22980071
35 changed files with 413 additions and 302 deletions
+31 -19
View File
@@ -10,27 +10,38 @@ export default {
<style> <style>
page { page {
background: #faf8ff; --color-primary: #1677FF;
color: #131b2e; --color-success: #16A34A;
font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Helvetica Neue', Arial, sans-serif; --color-warning: #EA8C00;
--color-danger: #DC2626;
--color-bg: #F5F7FA;
--color-surface: #FFFFFF;
--color-text-primary: #111827;
--color-text-secondary: #6B7280;
--color-border: #E8ECF2;
background: #F5F7FA;
color: #111827;
font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Noto Sans SC', 'Microsoft YaHei', sans-serif;
} }
.page { .page {
min-height: 100vh; min-height: 100vh;
background: #faf8ff; background: #F5F7FA;
box-sizing: border-box; box-sizing: border-box;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
} }
.card { .card {
background: #fff; background: #fff;
border-radius: 16rpx; border-radius: 24rpx;
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.03); box-shadow: 0 2rpx 8rpx rgba(17, 24, 39, 0.04);
border: 1rpx solid rgba(0, 0, 0, 0.03); border: 1rpx solid rgba(17, 24, 39, 0.06);
} }
.muted { color: #737686; } .muted { color: #6B7280; }
.ink { color: #131b2e; } .ink { color: #111827; }
.brand { color: #2563eb; } .brand { color: #1677FF; }
.btn-primary { .btn-primary {
height: 96rpx; height: 88rpx;
background: #2563eb; background: #1677FF;
color: #fff; color: #fff;
border-radius: 16rpx; border-radius: 16rpx;
font-size: 30rpx; font-size: 30rpx;
@@ -39,26 +50,27 @@ page {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.btn-primary[disabled] { opacity: 0.6; } .btn-primary[disabled] { opacity: 0.55; }
.chip { .chip {
font-size: 22rpx; font-size: 22rpx;
padding: 4rpx 12rpx; padding: 6rpx 14rpx;
border-radius: 8rpx; border-radius: 8rpx;
background: #eaedff; background: #E8F1FF;
color: #004ac6; color: #1677FF;
flex-shrink: 0;
} }
.badge { .badge {
min-width: 32rpx; min-width: 32rpx;
height: 32rpx; height: 32rpx;
padding: 0 8rpx; padding: 0 8rpx;
border-radius: 32rpx; border-radius: 32rpx;
background: #ba1a1a; background: #DC2626;
color: #fff; color: #fff;
font-size: 20rpx; font-size: 20rpx;
font-weight: 700; font-weight: 600;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.row-line { height: 1rpx; background: #eaedff; margin-left: 136rpx; } .row-line { height: 1rpx; background: #E8ECF2; margin-left: 136rpx; }
</style> </style>
+9 -9
View File
@@ -45,21 +45,21 @@ export default {
<style scoped> <style scoped>
.wrap { margin: 12rpx 0; } .wrap { margin: 12rpx 0; }
.lab { font-size: 24rpx; color: #434655; display: block; margin-bottom: 8rpx; } .lab { font-size: 26rpx; color: #374151; display: block; margin-bottom: 10rpx; }
.list { display: flex; flex-wrap: wrap; gap: 12rpx; } .list { display: flex; flex-wrap: wrap; gap: 12rpx; }
.chip, .add { .chip, .add {
font-size: 22rpx; font-size: 24rpx;
padding: 10rpx 16rpx; padding: 14rpx 18rpx;
border-radius: 12rpx; border-radius: 12rpx;
background: #fff; background: #F5F7FA;
border: 1rpx solid #dbe1ff; border: 1rpx solid #E8ECF2;
color: #2563eb; color: #1677FF;
display: flex; display: flex;
align-items: center; align-items: center;
max-width: 100%; max-width: 100%;
} }
.name { max-width: 360rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .name { max-width: 360rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.del { color: #ba1a1a; margin-left: 10rpx; font-size: 28rpx; line-height: 1; } .del { color: #DC2626; margin-left: 10rpx; font-size: 28rpx; line-height: 1; }
.add { color: #434655; border-style: dashed; } .add { color: #4B5563; border-style: dashed; }
.empty { font-size: 22rpx; color: #737686; } .empty { font-size: 22rpx; color: #6B7280; }
</style> </style>
+23 -7
View File
@@ -47,22 +47,38 @@ export default {
<style scoped> <style scoped>
.hd { .hd {
background: rgba(250, 248, 255, 0.96); background: rgba(245, 247, 250, 0.94);
border-bottom: 1rpx solid rgba(0, 0, 0, 0.04); border-bottom: 1rpx solid rgba(17, 24, 39, 0.06);
position: sticky; position: sticky;
top: 0; top: 0;
z-index: 20; z-index: 20;
} }
.bar { .bar {
height: 88rpx; height: 88rpx;
padding: 0 24rpx; padding: 0 28rpx;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
} }
.left { display: flex; align-items: center; min-width: 0; } .left { display: flex; align-items: center; min-width: 0; }
.back { font-size: 48rpx; line-height: 1; margin-right: 8rpx; color: #131b2e; width: 48rpx; } .back {
.leftlab { font-size: 30rpx; color: #131b2e; margin-right: 16rpx; } font-size: 52rpx;
.title { font-size: 36rpx; font-weight: 600; color: #131b2e; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 420rpx; } line-height: 1;
.right { display: flex; align-items: center; gap: 8rpx; } margin-right: 4rpx;
color: #111827;
width: 56rpx;
font-weight: 300;
}
.leftlab { font-size: 28rpx; color: #1677FF; margin-right: 16rpx; }
.title {
font-size: 34rpx;
font-weight: 600;
color: #111827;
letter-spacing: 0.2rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 440rpx;
}
.right { display: flex; align-items: center; gap: 4rpx; }
</style> </style>
+7 -7
View File
@@ -36,15 +36,15 @@
"globalStyle": { "globalStyle": {
"navigationBarTextStyle": "black", "navigationBarTextStyle": "black",
"navigationBarTitleText": "风影随行通讯", "navigationBarTitleText": "风影随行通讯",
"navigationBarBackgroundColor": "#FAF8FF", "navigationBarBackgroundColor": "#F5F7FA",
"backgroundColor": "#FAF8FF", "backgroundColor": "#F5F7FA",
"backgroundColorTop": "#FAF8FF", "backgroundColorTop": "#F5F7FA",
"backgroundColorBottom": "#FAF8FF" "backgroundColorBottom": "#F5F7FA"
}, },
"tabBar": { "tabBar": {
"color": "#434655", "color": "#8A9199",
"selectedColor": "#2563EB", "selectedColor": "#1677FF",
"backgroundColor": "#FAF8FF", "backgroundColor": "#FFFFFF",
"borderStyle": "white", "borderStyle": "white",
"list": [ "list": [
{ "pagePath": "pages/tabs/messages", "text": "消息", "iconPath": "static/tab/msg.png", "selectedIconPath": "static/tab/msg-on.png" }, { "pagePath": "pages/tabs/messages", "text": "消息", "iconPath": "static/tab/msg.png", "selectedIconPath": "static/tab/msg-on.png" },
+9 -9
View File
@@ -164,14 +164,14 @@ export default {
</script> </script>
<style scoped> <style scoped>
.body { padding: 24rpx; padding-bottom: 80rpx; } .body { padding: 24rpx 28rpx 48rpx; }
.field { margin-bottom: 20rpx; } .field { margin-bottom: 24rpx; }
.lab { font-size: 24rpx; color: #434655; display: block; margin-bottom: 8rpx; } .lab { font-size: 26rpx; color: #374151; display: block; margin-bottom: 10rpx; }
.box { min-height: 88rpx; background: #fff; border-radius: 16rpx; padding: 20rpx 24rpx; font-size: 28rpx; } .box { min-height: 92rpx; background: #fff; border-radius: 16rpx; padding: 22rpx 24rpx; font-size: 30rpx; border: 1rpx solid rgba(17,24,39,0.06); }
.box.tall { min-height: 160rpx; } .box.tall { min-height: 180rpx; }
.box textarea, .box input { width: 100%; } .box textarea, .box input { width: 100%; font-size: 30rpx; }
.inv { padding: 20rpx; margin-bottom: 16rpx; } .inv { padding: 24rpx; margin-bottom: 16rpx; }
.inv .box { margin-top: 12rpx; } .inv .box { margin-top: 12rpx; }
.link { color: #2563eb; font-size: 26rpx; display: block; margin-bottom: 20rpx; } .link { color: #1677FF; font-size: 28rpx; display: block; margin-bottom: 20rpx; }
.hint { font-size: 24rpx; color: #737686; } .hint { font-size: 24rpx; color: #6B7280; line-height: 1.5; }
</style> </style>
+6 -6
View File
@@ -56,12 +56,12 @@ export default {
<style scoped> <style scoped>
.search { padding: 16rpx 24rpx; } .search { padding: 16rpx 24rpx; }
.search input { height: 80rpx; background: #f2f3ff; border-radius: 16rpx; padding: 0 24rpx; } .search input { height: 80rpx; background: #F3F6FB; border-radius: 16rpx; padding: 0 24rpx; }
.block { margin: 8rpx 24rpx 24rpx; } .block { margin: 8rpx 24rpx 24rpx; }
.cat { font-size: 22rpx; color: #434655; font-weight: 600; } .cat { font-size: 22rpx; color: #4B5563; font-weight: 600; }
.item { display: flex; justify-content: space-between; align-items: center; padding: 24rpx; border-bottom: 1rpx solid #eaedff; } .item { display: flex; justify-content: space-between; align-items: center; padding: 24rpx; border-bottom: 1rpx solid #E8ECF2; }
.t { display: block; font-size: 28rpx; font-weight: 600; } .t { display: block; font-size: 28rpx; font-weight: 600; }
.d { font-size: 22rpx; color: #737686; } .d { font-size: 22rpx; color: #6B7280; }
.arr { color: #c3c6d7; } .arr { color: #D1D5DB; }
.deny { padding: 80rpx; text-align: center; color: #737686; } .deny { padding: 80rpx; text-align: center; color: #6B7280; }
</style> </style>
+3 -3
View File
@@ -53,7 +53,7 @@ export default {
<style scoped> <style scoped>
.item { margin: 16rpx 24rpx; padding: 24rpx; display: flex; justify-content: space-between; } .item { margin: 16rpx 24rpx; padding: 24rpx; display: flex; justify-content: space-between; }
.t { display: block; font-size: 28rpx; font-weight: 600; } .t { display: block; font-size: 28rpx; font-weight: 600; }
.s { font-size: 22rpx; color: #737686; } .s { font-size: 22rpx; color: #6B7280; }
.amt { color: #004ac6; font-weight: 700; } .amt { color: #1677FF; font-weight: 700; }
.empty { padding: 80rpx; text-align: center; color: #737686; } .empty { padding: 80rpx; text-align: center; color: #6B7280; }
</style> </style>
+2 -2
View File
@@ -95,11 +95,11 @@ export default {
.stage { flex: 1; position: relative; } .stage { flex: 1; position: relative; }
.wv { position: absolute; inset: 0; } .wv { position: absolute; inset: 0; }
.wait { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; } .wait { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.av { width: 160rpx; height: 160rpx; border-radius: 50%; background: #2563eb; display: flex; align-items: center; justify-content: center; font-size: 64rpx; font-weight: 700; } .av { width: 160rpx; height: 160rpx; border-radius: 50%; background: #1677FF; display: flex; align-items: center; justify-content: center; font-size: 64rpx; font-weight: 700; }
.name { margin-top: 24rpx; font-size: 36rpx; font-weight: 700; } .name { margin-top: 24rpx; font-size: 36rpx; font-weight: 700; }
.st { margin-top: 8rpx; color: rgba(255,255,255,0.65); } .st { margin-top: 8rpx; color: rgba(255,255,255,0.65); }
.acts { display: flex; justify-content: center; gap: 32rpx; padding: 32rpx 24rpx calc(32rpx + env(safe-area-inset-bottom)); } .acts { display: flex; justify-content: center; gap: 32rpx; padding: 32rpx 24rpx calc(32rpx + env(safe-area-inset-bottom)); }
.btn { min-width: 200rpx; height: 80rpx; border-radius: 999rpx; display: flex; align-items: center; justify-content: center; font-size: 28rpx; font-weight: 600; } .btn { min-width: 200rpx; height: 80rpx; border-radius: 999rpx; display: flex; align-items: center; justify-content: center; font-size: 28rpx; font-weight: 600; }
.ok { background: #006c49; } .ok { background: #006c49; }
.no { background: #ba1a1a; } .no { background: #DC2626; }
</style> </style>
+3 -3
View File
@@ -723,8 +723,8 @@ export default {
.ck.on { background: #07c160; border-color: #07c160; } .ck.on { background: #07c160; border-color: #07c160; }
.col { max-width: 70%; display: flex; flex-direction: column; } .col { max-width: 70%; display: flex; flex-direction: column; }
.col.mine { align-items: flex-end; } .col.mine { align-items: flex-end; }
.av { width: 80rpx; height: 80rpx; border-radius: 10rpx; background: #dae2fd; color: #004ac6; overflow: hidden; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size: 28rpx; font-weight: 700; } .av { width: 80rpx; height: 80rpx; border-radius: 10rpx; background: #dae2fd; color: #1677FF; overflow: hidden; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size: 28rpx; font-weight: 700; }
.av.self { background: #2563eb; color: #fff; } .av.self { background: #1677FF; color: #fff; }
.av image { width: 80rpx; height: 80rpx; } .av image { width: 80rpx; height: 80rpx; }
.who { font-size: 20rpx; color: #888; margin-bottom: 4rpx; } .who { font-size: 20rpx; color: #888; margin-bottom: 4rpx; }
.ball { background: #fff; padding: 16rpx 20rpx; border-radius: 8rpx; font-size: 30rpx; word-break: break-all; line-height: 1.45; } .ball { background: #fff; padding: 16rpx 20rpx; border-radius: 8rpx; font-size: 30rpx; word-break: break-all; line-height: 1.45; }
@@ -735,7 +735,7 @@ export default {
.pic { max-width: 420rpx; border-radius: 8rpx; display: block; } .pic { max-width: 420rpx; border-radius: 8rpx; display: block; }
.file, .cardtxt { display: flex; flex-direction: column; } .file, .cardtxt { display: flex; flex-direction: column; }
.fn, .ct { font-weight: 600; } .fn, .ct { font-weight: 600; }
.fs, .cs { font-size: 22rpx; margin-top: 6rpx; color: #2563eb; } .fs, .cs { font-size: 22rpx; margin-top: 6rpx; color: #1677FF; }
.tm { font-size: 20rpx; color: #b2b2b2; margin-top: 6rpx; } .tm { font-size: 20rpx; color: #b2b2b2; margin-top: 6rpx; }
.tm.read { color: #07c160; } .tm.read { color: #07c160; }
.recmask { .recmask {
+5 -5
View File
@@ -67,15 +67,15 @@ export default {
<style scoped> <style scoped>
.field { margin: 24rpx; padding: 8rpx 24rpx; } .field { margin: 24rpx; padding: 8rpx 24rpx; }
.field input { height: 80rpx; font-size: 30rpx; } .field input { height: 80rpx; font-size: 30rpx; }
.hint { margin: 0 32rpx 12rpx; font-size: 22rpx; color: #737686; } .hint { margin: 0 32rpx 12rpx; font-size: 22rpx; color: #6B7280; }
.card { margin: 0 24rpx 24rpx; overflow: hidden; } .card { margin: 0 24rpx 24rpx; overflow: hidden; }
.item { display: flex; align-items: center; padding: 20rpx 24rpx; } .item { display: flex; align-items: center; padding: 20rpx 24rpx; }
.box { width: 36rpx; height: 36rpx; border: 2rpx solid #c3c6d7; border-radius: 8rpx; margin-right: 16rpx; } .box { width: 36rpx; height: 36rpx; border: 2rpx solid #D1D5DB; border-radius: 8rpx; margin-right: 16rpx; }
.box.on { background: #2563eb; border-color: #2563eb; } .box.on { background: #1677FF; border-color: #1677FF; }
.av { width: 72rpx; height: 72rpx; border-radius: 50%; background: #e2e7ff; color: #004ac6; display: flex; align-items: center; justify-content: center; font-weight: 600; } .av { width: 72rpx; height: 72rpx; border-radius: 50%; background: #E8F1FF; color: #1677FF; display: flex; align-items: center; justify-content: center; font-weight: 600; }
.meta { margin-left: 16rpx; } .meta { margin-left: 16rpx; }
.n { display: block; font-size: 28rpx; font-weight: 600; } .n { display: block; font-size: 28rpx; font-weight: 600; }
.s { font-size: 22rpx; color: #737686; } .s { font-size: 22rpx; color: #6B7280; }
.pad { padding: 0 24rpx 40rpx; } .pad { padding: 0 24rpx 40rpx; }
.off { opacity: 0.45; } .off { opacity: 0.45; }
</style> </style>
+1 -1
View File
@@ -102,7 +102,7 @@ export default {
.snip { padding: 8rpx 32rpx 16rpx; font-size: 22rpx; color: #888; } .snip { padding: 8rpx 32rpx 16rpx; font-size: 22rpx; color: #888; }
.sec { padding: 16rpx 32rpx 8rpx; font-size: 22rpx; color: #888; background: #f7f7f7; } .sec { padding: 16rpx 32rpx 8rpx; font-size: 22rpx; color: #888; background: #f7f7f7; }
.item { display: flex; align-items: center; padding: 20rpx 24rpx; background: #fff; } .item { display: flex; align-items: center; padding: 20rpx 24rpx; background: #fff; }
.av { width: 80rpx; height: 80rpx; border-radius: 10rpx; background: #e2e7ff; color: #004ac6; display: flex; align-items: center; justify-content: center; font-weight: 700; overflow: hidden; flex-shrink: 0; } .av { width: 80rpx; height: 80rpx; border-radius: 10rpx; background: #E8F1FF; color: #1677FF; display: flex; align-items: center; justify-content: center; font-weight: 700; overflow: hidden; flex-shrink: 0; }
.av.img { width: 80rpx; height: 80rpx; } .av.img { width: 80rpx; height: 80rpx; }
.n { margin-left: 20rpx; font-size: 30rpx; } .n { margin-left: 20rpx; font-size: 30rpx; }
.empty { padding: 80rpx; text-align: center; color: #888; } .empty { padding: 80rpx; text-align: center; color: #888; }
+7 -7
View File
@@ -105,20 +105,20 @@ export default {
<style scoped> <style scoped>
.head { margin: 24rpx; padding: 28rpx; display: flex; align-items: center; } .head { margin: 24rpx; padding: 28rpx; display: flex; align-items: center; }
.grid { width: 96rpx; height: 96rpx; background: #eaedff; border-radius: 16rpx; display: flex; flex-wrap: wrap; padding: 8rpx; } .grid { width: 96rpx; height: 96rpx; background: #E8ECF2; border-radius: 16rpx; display: flex; flex-wrap: wrap; padding: 8rpx; }
.cell { width: 36rpx; height: 36rpx; margin: 2rpx; background: #dbe1ff; color: #004ac6; font-size: 18rpx; font-weight: 700; display: flex; align-items: center; justify-content: center; border-radius: 6rpx; } .cell { width: 36rpx; height: 36rpx; margin: 2rpx; background: #E8ECF2; color: #1677FF; font-size: 18rpx; font-weight: 700; display: flex; align-items: center; justify-content: center; border-radius: 6rpx; }
.meta { margin-left: 20rpx; } .meta { margin-left: 20rpx; }
.gn { font-size: 32rpx; font-weight: 700; display: block; } .gn { font-size: 32rpx; font-weight: 700; display: block; }
.gc { font-size: 22rpx; color: #737686; } .gc { font-size: 22rpx; color: #6B7280; }
.card { margin: 0 24rpx 24rpx; overflow: hidden; } .card { margin: 0 24rpx 24rpx; overflow: hidden; }
.cap { padding: 20rpx 24rpx 8rpx; font-size: 26rpx; font-weight: 700; } .cap { padding: 20rpx 24rpx 8rpx; font-size: 26rpx; font-weight: 700; }
.mems { display: flex; flex-wrap: wrap; padding: 8rpx 16rpx 24rpx; } .mems { display: flex; flex-wrap: wrap; padding: 8rpx 16rpx 24rpx; }
.mem { width: 20%; display: flex; flex-direction: column; align-items: center; margin-bottom: 16rpx; } .mem { width: 20%; display: flex; flex-direction: column; align-items: center; margin-bottom: 16rpx; }
.mav { width: 80rpx; height: 80rpx; border-radius: 16rpx; background: #dbe1ff; color: #00174b; display: flex; align-items: center; justify-content: center; font-weight: 700; } .mav { width: 80rpx; height: 80rpx; border-radius: 16rpx; background: #E8ECF2; color: #00174b; display: flex; align-items: center; justify-content: center; font-weight: 700; }
.mn { font-size: 20rpx; margin-top: 8rpx; } .mn { font-size: 20rpx; margin-top: 8rpx; }
.row { display: flex; justify-content: space-between; padding: 28rpx 24rpx; font-size: 28rpx; border-bottom: 1rpx solid #eaedff; } .row { display: flex; justify-content: space-between; padding: 28rpx 24rpx; font-size: 28rpx; border-bottom: 1rpx solid #E8ECF2; }
.val { color: #737686; } .val { color: #6B7280; }
.sw { color: #737686; } .sw { color: #6B7280; }
.sw.on { color: #07c160; font-weight: 600; } .sw.on { color: #07c160; font-weight: 600; }
.danger { color: #fa5151; justify-content: center; border-bottom: none; } .danger { color: #fa5151; justify-content: center; border-bottom: none; }
</style> </style>
+4 -4
View File
@@ -105,15 +105,15 @@ export default {
<style scoped> <style scoped>
.head { margin: 24rpx; padding: 28rpx; display: flex; align-items: center; } .head { margin: 24rpx; padding: 28rpx; display: flex; align-items: center; }
.av { width: 96rpx; height: 96rpx; border-radius: 12rpx; background: #004ac6; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 36rpx; font-weight: 700; overflow: hidden; } .av { width: 96rpx; height: 96rpx; border-radius: 12rpx; background: #1677FF; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 36rpx; font-weight: 700; overflow: hidden; }
.av.img { width: 96rpx; height: 96rpx; } .av.img { width: 96rpx; height: 96rpx; }
.meta { flex: 1; margin-left: 20rpx; } .meta { flex: 1; margin-left: 20rpx; }
.n { display: block; font-size: 32rpx; font-weight: 700; } .n { display: block; font-size: 32rpx; font-weight: 700; }
.s { font-size: 22rpx; color: #737686; } .s { font-size: 22rpx; color: #6B7280; }
.arr { color: #c3c6d7; } .arr { color: #D1D5DB; }
.card { margin: 0 24rpx 24rpx; overflow: hidden; } .card { margin: 0 24rpx 24rpx; overflow: hidden; }
.row { display: flex; justify-content: space-between; padding: 28rpx 24rpx; font-size: 28rpx; border-bottom: 1rpx solid #f0f0f0; } .row { display: flex; justify-content: space-between; padding: 28rpx 24rpx; font-size: 28rpx; border-bottom: 1rpx solid #f0f0f0; }
.sw { color: #737686; } .sw { color: #6B7280; }
.sw.on { color: #07c160; font-weight: 600; } .sw.on { color: #07c160; font-weight: 600; }
.danger { color: #fa5151; justify-content: center; border-bottom: none; } .danger { color: #fa5151; justify-content: center; border-bottom: none; }
</style> </style>
+6 -6
View File
@@ -64,16 +64,16 @@ export default {
</script> </script>
<style scoped> <style scoped>
.bar { margin: 16rpx 24rpx; background: #f2f3ff; border-radius: 16rpx; padding: 16rpx 20rpx; display: flex; justify-content: space-between; font-size: 22rpx; color: #434655; } .bar { margin: 16rpx 24rpx; background: #F3F6FB; border-radius: 16rpx; padding: 16rpx 20rpx; display: flex; justify-content: space-between; font-size: 22rpx; color: #4B5563; }
.item { margin: 0 24rpx 20rpx; display: flex; overflow: hidden; } .item { margin: 0 24rpx 20rpx; display: flex; overflow: hidden; }
.stripe { width: 8rpx; background: #2563eb; } .stripe { width: 8rpx; background: #1677FF; }
.body { flex: 1; padding: 24rpx; } .body { flex: 1; padding: 24rpx; }
.top { display: flex; justify-content: space-between; } .top { display: flex; justify-content: space-between; }
.kind { font-size: 28rpx; font-weight: 700; } .kind { font-size: 28rpx; font-weight: 700; }
.time { font-size: 22rpx; color: #737686; } .time { font-size: 22rpx; color: #6B7280; }
.title { display: block; font-size: 28rpx; font-weight: 600; margin: 12rpx 0 6rpx; } .title { display: block; font-size: 28rpx; font-weight: 600; margin: 12rpx 0 6rpx; }
.sub { font-size: 22rpx; color: #737686; } .sub { font-size: 22rpx; color: #6B7280; }
.acts { margin-top: 16rpx; } .acts { margin-top: 16rpx; }
.go { color: #2563eb; font-size: 24rpx; font-weight: 600; } .go { color: #1677FF; font-size: 24rpx; font-weight: 600; }
.empty { text-align: center; color: #737686; padding: 80rpx; } .empty { text-align: center; color: #6B7280; padding: 80rpx; }
</style> </style>
+9 -9
View File
@@ -110,20 +110,20 @@ export default {
<style scoped> <style scoped>
.body { padding: 24rpx; } .body { padding: 24rpx; }
.profile { padding: 28rpx; display: flex; align-items: center; } .profile { padding: 28rpx; display: flex; align-items: center; }
.av { width: 128rpx; height: 128rpx; border-radius: 20rpx; background: #004ac6; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 48rpx; font-weight: 700; } .av { width: 128rpx; height: 128rpx; border-radius: 20rpx; background: #1677FF; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 48rpx; font-weight: 700; }
.av.img { border-radius: 20rpx; } .av.img { border-radius: 20rpx; }
.info { margin-left: 24rpx; flex: 1; min-width: 0; } .info { margin-left: 24rpx; flex: 1; min-width: 0; }
.nm { display: flex; align-items: center; gap: 12rpx; } .nm { display: flex; align-items: center; gap: 12rpx; }
.n { font-size: 36rpx; font-weight: 700; } .n { font-size: 36rpx; font-weight: 700; }
.tag { font-size: 20rpx; background: #e2e7ff; color: #434655; padding: 2rpx 10rpx; border-radius: 8rpx; } .tag { font-size: 20rpx; background: #E8F1FF; color: #4B5563; padding: 2rpx 10rpx; border-radius: 8rpx; }
.s, .ph { display: block; font-size: 24rpx; color: #737686; margin-top: 8rpx; } .s, .ph { display: block; font-size: 24rpx; color: #6B7280; margin-top: 8rpx; }
.copy { color: #2563eb; margin-left: 12rpx; } .copy { color: #1677FF; margin-left: 12rpx; }
.acts { display: flex; gap: 16rpx; margin: 20rpx 0; } .acts { display: flex; gap: 16rpx; margin: 20rpx 0; }
.act { flex: 1; background: #fff; border-radius: 16rpx; padding: 20rpx 8rpx; display: flex; flex-direction: column; align-items: center; font-size: 22rpx; font-weight: 600; box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.03); } .act { flex: 1; background: #fff; border-radius: 16rpx; padding: 20rpx 8rpx; display: flex; flex-direction: column; align-items: center; font-size: 22rpx; font-weight: 600; box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.03); }
.ai { font-size: 36rpx; color: #004ac6; margin-bottom: 8rpx; } .ai { font-size: 36rpx; color: #1677FF; margin-bottom: 8rpx; }
.rows { overflow: hidden; margin-bottom: 20rpx; } .rows { overflow: hidden; margin-bottom: 20rpx; }
.row { display: flex; justify-content: space-between; padding: 28rpx 24rpx; font-size: 28rpx; border-bottom: 1rpx solid #eaedff; } .row { display: flex; justify-content: space-between; padding: 28rpx 24rpx; font-size: 28rpx; border-bottom: 1rpx solid #E8ECF2; }
.k { color: #434655; } .k { color: #4B5563; }
.v { color: #131b2e; } .v { color: #111827; }
.brand { color: #2563eb; } .brand { color: #1677FF; }
</style> </style>
+1 -1
View File
@@ -67,7 +67,7 @@ export default {
<style scoped> <style scoped>
.body { padding: 24rpx; } .body { padding: 24rpx; }
.field { margin-bottom: 20rpx; } .field { margin-bottom: 20rpx; }
.lab { font-size: 24rpx; color: #434655; display: block; margin-bottom: 8rpx; } .lab { font-size: 24rpx; color: #4B5563; display: block; margin-bottom: 8rpx; }
.box { min-height: 88rpx; background: #fff; border-radius: 16rpx; padding: 20rpx 24rpx; } .box { min-height: 88rpx; background: #fff; border-radius: 16rpx; padding: 20rpx 24rpx; }
.box.tall { min-height: 160rpx; } .box.tall { min-height: 160rpx; }
.box input, .box textarea { width: 100%; } .box input, .box textarea { width: 100%; }
+1 -1
View File
@@ -58,6 +58,6 @@ export default {
.body { padding: 24rpx; } .body { padding: 24rpx; }
.card { padding: 28rpx; margin-bottom: 24rpx; } .card { padding: 28rpx; margin-bottom: 24rpx; }
.t { display: block; font-size: 34rpx; font-weight: 700; } .t { display: block; font-size: 34rpx; font-weight: 700; }
.s { display: block; font-size: 24rpx; color: #737686; margin-top: 8rpx; } .s { display: block; font-size: 24rpx; color: #6B7280; margin-top: 8rpx; }
.chip { display: inline-block; margin-top: 16rpx; } .chip { display: inline-block; margin-top: 16rpx; }
</style> </style>
+4 -4
View File
@@ -59,11 +59,11 @@ export default {
<style scoped> <style scoped>
.sec { padding: 24rpx 24rpx 8rpx; font-size: 28rpx; font-weight: 700; } .sec { padding: 24rpx 24rpx 8rpx; font-size: 28rpx; font-weight: 700; }
.item { margin: 12rpx 24rpx; display: flex; overflow: hidden; } .item { margin: 12rpx 24rpx; display: flex; overflow: hidden; }
.stripe { width: 8rpx; background: #2563eb; } .stripe { width: 8rpx; background: #1677FF; }
.body { flex: 1; padding: 24rpx; } .body { flex: 1; padding: 24rpx; }
.body.wide { padding: 24rpx; } .body.wide { padding: 24rpx; }
.t { display: block; font-size: 28rpx; font-weight: 600; } .t { display: block; font-size: 28rpx; font-weight: 600; }
.s { font-size: 22rpx; color: #737686; } .s { font-size: 22rpx; color: #6B7280; }
.empty { padding: 24rpx; text-align: center; color: #737686; } .empty { padding: 24rpx; text-align: center; color: #6B7280; }
.add { color: #2563eb; font-size: 26rpx; font-weight: 700; padding: 8rpx; } .add { color: #1677FF; font-size: 26rpx; font-weight: 700; padding: 8rpx; }
</style> </style>
+4 -4
View File
@@ -111,10 +111,10 @@ export default {
<style scoped> <style scoped>
.tabs { white-space: nowrap; padding: 16rpx 16rpx 0; } .tabs { white-space: nowrap; padding: 16rpx 16rpx 0; }
.tab { display: inline-block; padding: 12rpx 20rpx; font-size: 24rpx; color: #737686; } .tab { display: inline-block; padding: 12rpx 20rpx; font-size: 24rpx; color: #6B7280; }
.tab.on { color: #2563eb; font-weight: 700; border-bottom: 4rpx solid #2563eb; } .tab.on { color: #1677FF; font-weight: 700; border-bottom: 4rpx solid #1677FF; }
.item { margin: 16rpx 24rpx; padding: 24rpx; } .item { margin: 16rpx 24rpx; padding: 24rpx; }
.t { display: block; font-weight: 600; font-size: 28rpx; } .t { display: block; font-weight: 600; font-size: 28rpx; }
.s { font-size: 22rpx; color: #737686; } .s { font-size: 22rpx; color: #6B7280; }
.empty, .deny { padding: 80rpx 40rpx; text-align: center; color: #737686; } .empty, .deny { padding: 80rpx 40rpx; text-align: center; color: #6B7280; }
</style> </style>
+17 -17
View File
@@ -125,29 +125,29 @@ export default {
.body { padding: 48rpx 40rpx 80rpx; } .body { padding: 48rpx 40rpx 80rpx; }
.brand-box { display: flex; flex-direction: column; align-items: center; margin-bottom: 48rpx; } .brand-box { display: flex; flex-direction: column; align-items: center; margin-bottom: 48rpx; }
.logo { .logo {
width: 128rpx; height: 128rpx; border-radius: 32rpx; width: 112rpx; height: 112rpx; border-radius: 28rpx;
background: linear-gradient(135deg, #004ac6, #2563eb); background: #1677FF;
color: #fff; font-size: 52rpx; font-weight: 700; color: #fff; font-size: 48rpx; font-weight: 650;
display: flex; align-items: center; justify-content: center; display: flex; align-items: center; justify-content: center;
margin-bottom: 20rpx; margin-bottom: 24rpx;
} }
.name { font-size: 40rpx; font-weight: 700; } .name { font-size: 40rpx; font-weight: 650; letter-spacing: 0.5rpx; }
.sub { font-size: 22rpx; color: #737686; margin-top: 8rpx; } .sub { font-size: 24rpx; color: #6B7280; margin-top: 10rpx; }
.field { margin-bottom: 24rpx; } .field { margin-bottom: 24rpx; }
.lab { font-size: 24rpx; color: #434655; margin-bottom: 8rpx; display: block; } .lab { font-size: 26rpx; color: #374151; margin-bottom: 10rpx; display: block; }
.box { .box {
height: 96rpx; background: #fff; border-radius: 16rpx; height: 96rpx; background: #fff; border-radius: 16rpx;
border: 1rpx solid rgba(0,0,0,0.04); padding: 0 24rpx; border: 1rpx solid rgba(17,24,39,0.08); padding: 0 24rpx;
display: flex; align-items: center; display: flex; align-items: center;
} }
.box input { flex: 1; font-size: 28rpx; } .box input { flex: 1; font-size: 30rpx; }
.pre { font-size: 24rpx; color: #737686; margin-right: 16rpx; padding-right: 16rpx; border-right: 1rpx solid #eaedff; } .pre { font-size: 26rpx; color: #6B7280; margin-right: 16rpx; padding-right: 16rpx; border-right: 1rpx solid #E8ECF2; }
.eye, .sms { font-size: 22rpx; color: #2563eb; padding-left: 12rpx; } .eye, .sms { font-size: 26rpx; color: #1677FF; padding-left: 12rpx; }
.sms.off { color: #737686; } .sms.off { color: #6B7280; }
.agree { display: flex; align-items: flex-start; gap: 12rpx; margin: 16rpx 0 32rpx; } .agree { display: flex; align-items: flex-start; gap: 12rpx; margin: 16rpx 0 36rpx; }
.ck { width: 28rpx; height: 28rpx; border: 2rpx solid #c3c6d7; border-radius: 6rpx; margin-top: 4rpx; } .ck { width: 32rpx; height: 32rpx; border: 2rpx solid #D1D5DB; border-radius: 8rpx; margin-top: 4rpx; flex-shrink: 0; }
.ck.on { background: #2563eb; border-color: #2563eb; } .ck.on { background: #1677FF; border-color: #1677FF; }
.ag { flex: 1; font-size: 22rpx; color: #737686; line-height: 1.5; } .ag { flex: 1; font-size: 24rpx; color: #6B7280; line-height: 1.55; }
.err { display: block; color: #ba1a1a; font-size: 24rpx; margin-top: 16rpx; text-align: center; } .err { display: block; color: #DC2626; font-size: 26rpx; margin-top: 16rpx; text-align: center; }
.dim { opacity: 0.65; } .dim { opacity: 0.65; }
</style> </style>
+2 -2
View File
@@ -40,7 +40,7 @@ export default {
<style scoped> <style scoped>
.card { margin: 24rpx; overflow: hidden; } .card { margin: 24rpx; overflow: hidden; }
.row { display: flex; justify-content: space-between; padding: 28rpx 24rpx; border-bottom: 1rpx solid #eaedff; } .row { display: flex; justify-content: space-between; padding: 28rpx 24rpx; border-bottom: 1rpx solid #E8ECF2; }
.k { color: #737686; font-size: 26rpx; } .k { color: #6B7280; font-size: 26rpx; }
.v { font-size: 26rpx; } .v { font-size: 26rpx; }
</style> </style>
+2 -2
View File
@@ -27,6 +27,6 @@ export default {
<style scoped> <style scoped>
.item { margin: 16rpx 24rpx; padding: 24rpx; } .item { margin: 16rpx 24rpx; padding: 24rpx; }
.t { display: block; font-weight: 600; } .t { display: block; font-weight: 600; }
.s { font-size: 24rpx; color: #737686; } .s { font-size: 24rpx; color: #6B7280; }
.empty { padding: 80rpx; text-align: center; color: #737686; } .empty { padding: 80rpx; text-align: center; color: #6B7280; }
</style> </style>
+2 -2
View File
@@ -27,6 +27,6 @@ export default {
<style scoped> <style scoped>
.item { margin: 16rpx 24rpx; padding: 24rpx; } .item { margin: 16rpx 24rpx; padding: 24rpx; }
.t { display: block; font-weight: 600; } .t { display: block; font-weight: 600; }
.s { font-size: 24rpx; color: #737686; } .s { font-size: 24rpx; color: #6B7280; }
.empty { padding: 80rpx; text-align: center; color: #737686; } .empty { padding: 80rpx; text-align: center; color: #6B7280; }
</style> </style>
+5 -5
View File
@@ -26,9 +26,9 @@ export default {
</script> </script>
<style scoped> <style scoped>
.item { margin: 16rpx 24rpx; padding: 24rpx; } .item { margin: 16rpx 28rpx; padding: 28rpx; }
.t { display: block; font-weight: 600; font-size: 30rpx; } .t { display: block; font-weight: 650; font-size: 30rpx; line-height: 1.45; }
.s { font-size: 22rpx; color: #737686; } .s { display: block; font-size: 24rpx; color: #6B7280; margin-top: 10rpx; }
.c { display: block; font-size: 26rpx; margin-top: 8rpx; } .c { display: block; font-size: 28rpx; margin-top: 16rpx; color: #374151; line-height: 1.65; }
.empty { padding: 80rpx; text-align: center; color: #737686; } .empty { padding: 120rpx 40rpx; text-align: center; color: #6B7280; font-size: 28rpx; }
</style> </style>
+3 -3
View File
@@ -52,10 +52,10 @@ export default {
<style scoped> <style scoped>
.body { padding: 40rpx; } .body { padding: 40rpx; }
.hint { font-size: 26rpx; color: #737686; display: block; margin-bottom: 32rpx; } .hint { font-size: 26rpx; color: #6B7280; display: block; margin-bottom: 32rpx; }
.field { margin-bottom: 24rpx; } .field { margin-bottom: 24rpx; }
.lab { font-size: 24rpx; color: #434655; display: block; margin-bottom: 8rpx; } .lab { font-size: 24rpx; color: #4B5563; display: block; margin-bottom: 8rpx; }
.box { height: 96rpx; background: #fff; border-radius: 16rpx; padding: 0 24rpx; display: flex; align-items: center; } .box { height: 96rpx; background: #fff; border-radius: 16rpx; padding: 0 24rpx; display: flex; align-items: center; }
.box input { flex: 1; } .box input { flex: 1; }
.err { color: #ba1a1a; font-size: 24rpx; margin-top: 16rpx; display: block; } .err { color: #DC2626; font-size: 24rpx; margin-top: 16rpx; display: block; }
</style> </style>
+3 -3
View File
@@ -59,11 +59,11 @@ export default {
<style scoped> <style scoped>
.form { margin: 24rpx; padding: 24rpx; } .form { margin: 24rpx; padding: 24rpx; }
.box { background: #f2f3ff; border-radius: 12rpx; padding: 20rpx; margin-bottom: 16rpx; } .box { background: #F3F6FB; border-radius: 12rpx; padding: 20rpx; margin-bottom: 16rpx; }
.box.tall { min-height: 160rpx; } .box.tall { min-height: 160rpx; }
.item { margin: 0 24rpx 16rpx; padding: 24rpx; } .item { margin: 0 24rpx 16rpx; padding: 24rpx; }
.t { display: block; font-weight: 600; } .t { display: block; font-weight: 600; }
.s { font-size: 22rpx; color: #737686; } .s { font-size: 22rpx; color: #6B7280; }
.c { display: block; font-size: 26rpx; margin-top: 8rpx; } .c { display: block; font-size: 26rpx; margin-top: 8rpx; }
.deny { padding: 80rpx; text-align: center; color: #737686; } .deny { padding: 80rpx; text-align: center; color: #6B7280; }
</style> </style>
+8 -8
View File
@@ -4,7 +4,7 @@
<view class="search"> <view class="search">
<input v-model="q" placeholder="搜索同事 / 会话 / 聊天记录" confirm-type="search" focus /> <input v-model="q" placeholder="搜索同事 / 会话 / 聊天记录" confirm-type="search" focus />
</view> </view>
<view v-if="!q.trim()" class="empty">输入关键字搜索</view> <view v-if="!q.trim()" class="empty">搜索同事会话或待办</view>
<view v-else> <view v-else>
<view v-if="people.length" class="sec">同事</view> <view v-if="people.length" class="sec">同事</view>
<view v-for="p in people" :key="'p' + p.id" class="item" @click="openPerson(p)"> <view v-for="p in people" :key="'p' + p.id" class="item" @click="openPerson(p)">
@@ -38,7 +38,7 @@
<text class="n">{{ t.title || t.no }}</text> <text class="n">{{ t.title || t.no }}</text>
</view> </view>
</view> </view>
<view v-if="!people.length && !convs.length && !hits.length && !todos.length" class="empty">没有找到结果</view> <view v-if="!people.length && !convs.length && !hits.length && !todos.length" class="empty">没有找到相关内容</view>
</view> </view>
</view> </view>
</template> </template>
@@ -96,15 +96,15 @@ export default {
</script> </script>
<style scoped> <style scoped>
.search { padding: 16rpx 24rpx; } .search { padding: 12rpx 28rpx 16rpx; }
.search input { height: 72rpx; background: #ededed; border-radius: 8rpx; padding: 0 24rpx; } .search input { height: 80rpx; background: #fff; border-radius: 20rpx; padding: 0 28rpx; font-size: 28rpx; border: 1rpx solid rgba(17,24,39,0.06); }
.sec { padding: 20rpx 24rpx 8rpx; font-size: 22rpx; color: #888; background: #f7f7f7; } .sec { padding: 24rpx 28rpx 8rpx; font-size: 24rpx; color: #6B7280; }
.item { display: flex; align-items: center; padding: 20rpx 24rpx; background: #fff; } .item { display: flex; align-items: center; padding: 20rpx 24rpx; background: #fff; }
.av { width: 72rpx; height: 72rpx; border-radius: 10rpx; background: #e2e7ff; color: #004ac6; display: flex; align-items: center; justify-content: center; font-weight: 700; overflow: hidden; flex-shrink: 0; } .av { width: 72rpx; height: 72rpx; border-radius: 10rpx; background: #E8F1FF; color: #1677FF; display: flex; align-items: center; justify-content: center; font-weight: 700; overflow: hidden; flex-shrink: 0; }
.av.img { width: 72rpx; height: 72rpx; } .av.img { width: 72rpx; height: 72rpx; }
.av.work { background: #2563eb; color: #fff; } .av.work { background: #1677FF; color: #fff; }
.meta { margin-left: 16rpx; min-width: 0; } .meta { margin-left: 16rpx; min-width: 0; }
.n { display: block; font-size: 28rpx; } .n { display: block; font-size: 28rpx; }
.s { font-size: 22rpx; color: #888; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .s { font-size: 22rpx; color: #888; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.empty { text-align: center; color: #888; padding: 80rpx; font-size: 26rpx; } .empty { text-align: center; color: #6B7280; padding: 120rpx 40rpx; font-size: 28rpx; }
</style> </style>
+12 -12
View File
@@ -102,23 +102,23 @@ export default {
<style scoped> <style scoped>
.body { padding: 16rpx 24rpx 40rpx; } .body { padding: 16rpx 24rpx 40rpx; }
.clock-box { background: #f2f3ff; border-radius: 16rpx; padding: 36rpx 0; text-align: center; } .clock-box { background: #fff; border-radius: 24rpx; padding: 48rpx 0 40rpx; text-align: center; border: 1rpx solid rgba(17,24,39,0.06); }
.now { display: block; font-size: 68rpx; font-weight: 700; letter-spacing: 2rpx; } .now { display: block; font-size: 72rpx; font-weight: 650; letter-spacing: 2rpx; color: #111827; }
.shift { font-size: 22rpx; color: #434655; } .shift { font-size: 22rpx; color: #4B5563; }
.grid { display: flex; gap: 16rpx; margin: 20rpx 0; } .grid { display: flex; gap: 16rpx; margin: 20rpx 0; }
.stat { flex: 1; padding: 24rpx; } .stat { flex: 1; padding: 24rpx; }
.lab { font-size: 26rpx; font-weight: 600; display: block; } .lab { font-size: 26rpx; font-weight: 600; display: block; }
.val { font-size: 24rpx; color: #434655; display: block; margin-top: 12rpx; } .val { font-size: 24rpx; color: #4B5563; display: block; margin-top: 12rpx; }
.val.ok { color: #006c49; font-weight: 700; } .val.ok { color: #16A34A; font-weight: 650; }
.tiny { font-size: 20rpx; color: #737686; } .tiny { font-size: 20rpx; color: #6B7280; }
.geo { display: block; text-align: center; font-size: 22rpx; color: #434655; margin: 16rpx 0 24rpx; } .geo { display: block; text-align: center; font-size: 22rpx; color: #4B5563; margin: 16rpx 0 24rpx; }
.quick { display: flex; gap: 12rpx; } .quick { display: flex; gap: 12rpx; }
.q { flex: 1; height: 72rpx; background: #fff; border-radius: 12rpx; text-align: center; line-height: 72rpx; font-size: 24rpx; } .q { flex: 1; height: 72rpx; background: #fff; border-radius: 12rpx; text-align: center; line-height: 72rpx; font-size: 24rpx; }
.sec { margin: 32rpx 0 12rpx; font-size: 28rpx; font-weight: 600; } .sec { margin: 32rpx 0 12rpx; font-size: 28rpx; font-weight: 600; }
.rec { display: flex; justify-content: space-between; align-items: center; padding: 24rpx 28rpx; border-bottom: 1rpx solid #eaedff; } .rec { display: flex; justify-content: space-between; align-items: center; padding: 24rpx 28rpx; border-bottom: 1rpx solid #E8ECF2; }
.rt { display: block; font-size: 28rpx; font-weight: 600; } .rt { display: block; font-size: 28rpx; font-weight: 600; }
.rl { display: block; font-size: 22rpx; color: #737686; } .rl { display: block; font-size: 22rpx; color: #6B7280; }
.ok { color: #006c49; font-size: 24rpx; } .ok { color: #16A34A; font-size: 24rpx; }
.empty { padding: 40rpx; text-align: center; color: #737686; } .empty { padding: 40rpx; text-align: center; color: #6B7280; }
.deny { padding: 120rpx 40rpx; text-align: center; color: #737686; } .deny { padding: 120rpx 40rpx; text-align: center; color: #6B7280; }
</style> </style>
+13 -13
View File
@@ -131,27 +131,27 @@ export default {
<style scoped> <style scoped>
.search { padding: 16rpx 24rpx; } .search { padding: 16rpx 24rpx; }
.search input { height: 80rpx; background: #fff; border-radius: 12rpx; padding: 0 24rpx; font-size: 26rpx; } .search input { height: 80rpx; background: #fff; border-radius: 20rpx; padding: 0 28rpx; font-size: 28rpx; border: 1rpx solid rgba(17,24,39,0.06); }
.org { margin: 0 24rpx 16rpx; background: #fff; border-radius: 16rpx; padding: 20rpx; display: flex; align-items: center; } .org { margin: 0 24rpx 16rpx; background: #fff; border-radius: 16rpx; padding: 20rpx; display: flex; align-items: center; }
.obox { width: 64rpx; height: 64rpx; border-radius: 12rpx; background: #eaedff; display: flex; align-items: center; justify-content: center; } .obox { width: 64rpx; height: 64rpx; border-radius: 12rpx; background: #E8ECF2; display: flex; align-items: center; justify-content: center; }
.ometa { flex: 1; margin-left: 16rpx; } .ometa { flex: 1; margin-left: 16rpx; }
.on { display: block; font-size: 28rpx; font-weight: 700; } .on { display: block; font-size: 28rpx; font-weight: 700; }
.os { font-size: 22rpx; color: #737686; } .os { font-size: 22rpx; color: #6B7280; }
.arr { color: #c3c6d7; } .arr { color: #D1D5DB; }
.block { margin: 8rpx 24rpx 24rpx; } .block { margin: 8rpx 24rpx 24rpx; }
.dept { display: flex; align-items: center; padding: 16rpx 12rpx; font-size: 26rpx; font-weight: 600; background: #f2f3ff; border-radius: 12rpx 12rpx 0 0; } .dept { display: flex; align-items: center; padding: 16rpx 12rpx; font-size: 26rpx; font-weight: 600; background: #F3F6FB; border-radius: 12rpx 12rpx 0 0; }
.cnt { color: #737686; font-weight: 400; font-size: 22rpx; margin-left: 8rpx; } .cnt { color: #6B7280; font-weight: 400; font-size: 22rpx; margin-left: 8rpx; }
.item { display: flex; align-items: center; padding: 20rpx 20rpx; } .item { display: flex; align-items: center; padding: 20rpx 20rpx; }
.av-wrap { position: relative; width: 72rpx; height: 72rpx; } .av-wrap { position: relative; width: 72rpx; height: 72rpx; }
.av { width: 72rpx; height: 72rpx; border-radius: 50%; } .av { width: 72rpx; height: 72rpx; border-radius: 50%; }
.av.txt { background: #eaedff; color: #434655; display: flex; align-items: center; justify-content: center; font-weight: 600; } .av.txt { background: #E8ECF2; color: #4B5563; display: flex; align-items: center; justify-content: center; font-weight: 600; }
.dot { position: absolute; right: 0; bottom: 0; width: 16rpx; height: 16rpx; border-radius: 50%; background: #006c49; border: 2rpx solid #fff; } .dot { position: absolute; right: 0; bottom: 0; width: 16rpx; height: 16rpx; border-radius: 50%; background: #006c49; border: 2rpx solid #fff; }
.meta { flex: 1; margin-left: 16rpx; min-width: 0; } .meta { flex: 1; margin-left: 16rpx; min-width: 0; }
.name { display: block; font-size: 28rpx; font-weight: 600; } .name { display: block; font-size: 28rpx; font-weight: 600; }
.sub { font-size: 22rpx; color: #737686; } .sub { font-size: 22rpx; color: #6B7280; }
.chip { font-size: 20rpx; color: #004ac6; background: #e2e7ff; padding: 4rpx 12rpx; border-radius: 999rpx; margin-right: 8rpx; } .chip { font-size: 20rpx; color: #1677FF; background: #E8F1FF; padding: 4rpx 12rpx; border-radius: 999rpx; margin-right: 8rpx; }
.mini { width: 56rpx; text-align: center; font-size: 28rpx; color: #004ac6; } .mini { width: 56rpx; text-align: center; font-size: 28rpx; color: #1677FF; }
.empty { text-align: center; color: #737686; padding: 80rpx; } .empty { text-align: center; color: #6B7280; padding: 80rpx; }
.foot { display: block; text-align: center; color: #737686; font-size: 22rpx; padding: 20rpx 0 40rpx; } .foot { display: block; text-align: center; color: #6B7280; font-size: 22rpx; padding: 20rpx 0 40rpx; }
.ico { padding: 8rpx 16rpx; color: #2563eb; font-size: 26rpx; } .ico { padding: 8rpx 16rpx; color: #1677FF; font-size: 26rpx; }
</style> </style>
+18 -17
View File
@@ -1,6 +1,6 @@
<template> <template>
<view class="page"> <view class="page">
<fy-header title="我" /> <fy-header title="我" />
<view class="body"> <view class="body">
<view class="card profile"> <view class="card profile">
<view class="row"> <view class="row">
@@ -109,26 +109,27 @@ export default {
</script> </script>
<style scoped> <style scoped>
.body { padding: 16rpx 24rpx 40rpx; } .body { padding: 8rpx 28rpx 48rpx; }
.profile { padding: 28rpx; } .profile { padding: 32rpx 28rpx 24rpx; }
.row { display: flex; align-items: center; } .row { display: flex; align-items: center; }
.av { width: 112rpx; height: 112rpx; border-radius: 50%; } .av { width: 112rpx; height: 112rpx; border-radius: 50%; }
.av.txt { background: #004ac6; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 40rpx; font-weight: 700; } .av.txt { background: #1677FF; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 40rpx; font-weight: 650; }
.info { margin-left: 20rpx; flex: 1; min-width: 0; } .info { margin-left: 24rpx; flex: 1; min-width: 0; }
.nm { display: flex; align-items: center; gap: 12rpx; } .nm { display: flex; align-items: center; gap: 12rpx; }
.name { font-size: 34rpx; font-weight: 700; } .name { font-size: 36rpx; font-weight: 650; }
.st { font-size: 20rpx; background: rgba(108, 248, 187, 0.3); color: #006c49; padding: 2rpx 12rpx; border-radius: 999rpx; } .st { font-size: 22rpx; background: #E8F8EF; color: #16A34A; padding: 4rpx 12rpx; border-radius: 8rpx; }
.dept, .ph { display: block; font-size: 22rpx; color: #737686; margin-top: 6rpx; } .dept, .ph { display: block; font-size: 24rpx; color: #6B7280; margin-top: 8rpx; }
.stats { display: flex; margin-top: 24rpx; padding-top: 20rpx; border-top: 1rpx solid #eaedff; } .stats { display: flex; margin-top: 28rpx; padding-top: 24rpx; border-top: 1rpx solid #F0F2F5; }
.s { flex: 1; text-align: center; } .s { flex: 1; text-align: center; }
.mid { border-left: 1rpx solid #eaedff; border-right: 1rpx solid #eaedff; } .mid { border-left: 1rpx solid #F0F2F5; border-right: 1rpx solid #F0F2F5; }
.n { display: block; font-size: 36rpx; font-weight: 700; color: #004ac6; } .n { display: block; font-size: 34rpx; font-weight: 650; color: #111827; }
.n.ok { color: #006c49; font-size: 30rpx; } .n.ok { color: #16A34A; font-size: 28rpx; }
.l { font-size: 20rpx; color: #737686; } .l { font-size: 22rpx; color: #6B7280; margin-top: 4rpx; }
.menu { margin-top: 20rpx; overflow: hidden; } .menu { margin-top: 20rpx; overflow: hidden; }
.mi { display: flex; align-items: center; padding: 28rpx 24rpx; border-bottom: 1rpx solid #eaedff; } .mi { display: flex; align-items: center; min-height: 100rpx; padding: 0 28rpx; }
.ii { width: 48rpx; } .mi + .mi { border-top: 1rpx solid #F0F2F5; }
.ii { width: 48rpx; color: #1677FF; font-weight: 650; }
.it { flex: 1; font-size: 28rpx; } .it { flex: 1; font-size: 28rpx; }
.arr { color: #c3c6d7; } .arr { color: #C4C9D4; font-size: 32rpx; }
.danger .it { color: #ba1a1a; } .danger .it { color: #DC2626; }
</style> </style>
+19 -19
View File
@@ -126,26 +126,26 @@ export default {
</script> </script>
<style scoped> <style scoped>
.msg { display: flex; flex-direction: column; height: 100vh; background: #fff; } .msg { display: flex; flex-direction: column; height: 100vh; background: #F5F7FA; }
.list { flex: 1; height: 0; } .list { flex: 1; height: 0; background: #fff; }
.ico.sm { font-size: 36rpx; } .ico.sm { font-size: 34rpx; color: #1677FF; }
.item { display: flex; align-items: center; padding: 20rpx 24rpx; background: #fff; } .item { display: flex; align-items: center; padding: 22rpx 28rpx; background: #fff; }
.item.pin { background: #f7f7f7; } .item.pin { background: #F7F8FA; }
.av-wrap { position: relative; width: 96rpx; height: 96rpx; flex-shrink: 0; } .av-wrap { position: relative; width: 92rpx; height: 92rpx; flex-shrink: 0; }
.av { width: 96rpx; height: 96rpx; border-radius: 12rpx; } .av { width: 92rpx; height: 92rpx; border-radius: 20rpx; }
.av.txt { display: flex; align-items: center; justify-content: center; font-size: 34rpx; font-weight: 600; } .av.txt { display: flex; align-items: center; justify-content: center; font-size: 32rpx; font-weight: 600; }
.av.work { background: #2563eb; color: #fff; } .av.work { background: #1677FF; color: #fff; }
.av.file { background: #e2e7ff; color: #434655; } .av.file { background: #F3F6FB; color: #4B5563; }
.av.plain { background: #e2e7ff; color: #004ac6; } .av.plain { background: #E8F1FF; color: #1677FF; }
.abs { position: absolute; top: -8rpx; right: -8rpx; } .abs { position: absolute; top: -8rpx; right: -8rpx; }
.dotu { position: absolute; top: -4rpx; right: -4rpx; width: 16rpx; height: 16rpx; border-radius: 50%; background: #fa5151; } .dotu { position: absolute; top: -4rpx; right: -4rpx; width: 16rpx; height: 16rpx; border-radius: 50%; background: #DC2626; }
.meta { flex: 1; margin-left: 20rpx; min-width: 0; padding: 4rpx 0; border-bottom: 1rpx solid #f0f0f0; } .meta { flex: 1; margin-left: 20rpx; min-width: 0; padding: 8rpx 0 18rpx; border-bottom: 1rpx solid #F0F2F5; }
.top { display: flex; justify-content: space-between; align-items: center; } .top { display: flex; justify-content: space-between; align-items: center; }
.name { font-size: 32rpx; font-weight: 500; max-width: 420rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .name { font-size: 30rpx; font-weight: 600; max-width: 420rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.time { font-size: 22rpx; color: #b2b2b2; } .time { font-size: 22rpx; color: #9CA3AF; }
.bot { display: flex; align-items: center; margin-top: 8rpx; } .bot { display: flex; align-items: center; margin-top: 8rpx; }
.prev { flex: 1; font-size: 24rpx; color: #888; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .prev { flex: 1; font-size: 24rpx; color: #6B7280; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mute { font-size: 22rpx; margin-left: 8rpx; } .mute { font-size: 22rpx; margin-left: 8rpx; color: #9CA3AF; }
.empty { padding: 120rpx; text-align: center; color: #888; font-size: 26rpx; } .empty { padding: 160rpx 40rpx; text-align: center; color: #6B7280; font-size: 28rpx; background: #fff; }
.ico { font-size: 40rpx; color: #111; padding: 8rpx 16rpx; } .ico { font-size: 36rpx; color: #1677FF; padding: 8rpx 12rpx; }
</style> </style>
+101 -52
View File
@@ -1,41 +1,59 @@
<template> <template>
<view class="page"> <view class="page">
<fy-header title="工作台"> <fy-header :title="greet">
<template #right> <template #right>
<text class="ico" @click="goSearch"></text> <text class="ico" @click="goSearch"></text>
</template> </template>
</fy-header> </fy-header>
<view class="body"> <view class="body">
<view class="hello">
<text class="hello-sub">今天也要高效完成工作</text>
</view>
<view class="stats">
<view class="stat" @click="goTodo">
<text class="sn">{{ todoCount }}</text>
<text class="sl">待办</text>
</view>
<view class="stat" @click="goApply">
<text class="sn">{{ flows.length }}</text>
<text class="sl">可发起</text>
</view>
<view class="stat" @click="openNotice">
<text class="sn">{{ apps.length }}</text>
<text class="sl">办公应用</text>
</view>
</view>
<view v-if="announce" class="notice" @click="openNotice"> <view v-if="announce" class="notice" @click="openNotice">
<text class="nlab">公告 · {{ announce }}</text> <text class="ntag">公告</text>
<text class="nlab">{{ announce }}</text>
<text class="arr"></text> <text class="arr"></text>
</view> </view>
<view class="card apps"> <view class="sec-h">
<view class="cap"> <text class="sec-t">快捷办公</text>
<text>常用业务入口</text> <text class="more" @click="goApply">全部流程</text>
<text class="cap-sub more" @click="goApply">全部流程 </text>
</view> </view>
<view class="card apps">
<view v-if="!flows.length" class="empty">暂无可用审批流请确认账号已开通申请权限</view> <view v-if="!flows.length" class="empty">暂无可用审批流请确认账号已开通申请权限</view>
<view class="grid"> <view class="grid">
<view v-for="a in flows" :key="a.key" class="app" @click="openFlow(a)"> <view v-for="a in flows" :key="a.key" class="app" @click="openFlow(a)">
<view class="icon"><text>{{ a.emoji }}</text></view> <view class="icon"><text class="mark">{{ mark(a.label) }}</text></view>
<text class="al">{{ a.label }}</text> <text class="al">{{ a.label }}</text>
<text v-if="a.desc" class="ad">{{ a.desc }}</text>
</view> </view>
</view> </view>
</view> </view>
<view v-if="apps.length" class="card apps"> <view v-if="apps.length" class="sec-h">
<view class="cap"> <text class="sec-t">个人办公</text>
<text>个人办公</text>
<text class="cap-sub">按你的权限显示</text>
</view> </view>
<view v-if="apps.length" class="card apps">
<view class="grid"> <view class="grid">
<view v-for="a in apps" :key="a.id" class="app" @click="open(a)"> <view v-for="a in apps" :key="a.id" class="app" @click="open(a)">
<view class="icon"> <view class="icon">
<text>{{ a.icon }}</text> <text class="mark">{{ mark(a.title) }}</text>
<text v-if="a.badge === 'todo' && todoCount" class="badge abs">{{ todoCount }}</text> <text v-if="a.badge === 'todo' && todoCount" class="badge abs">{{ todoCount }}</text>
</view> </view>
<text class="al">{{ a.title }}</text> <text class="al">{{ a.title }}</text>
@@ -43,33 +61,36 @@
</view> </view>
</view> </view>
<view v-if="erp.length" class="card mods"> <view v-if="erp.length" class="sec-h">
<view class="cap"> <text class="sec-t">管理应用</text>
<text>管理应用</text>
<text class="cap-sub">Web 授权后才会出现</text>
</view> </view>
<view v-if="erp.length" class="card mods">
<view v-for="m in erp" :key="m.id" class="mod" @click="open(m)"> <view v-for="m in erp" :key="m.id" class="mod" @click="open(m)">
<text class="mi">{{ m.icon }}</text> <view class="mi"><text>{{ mark(m.title) }}</text></view>
<text class="mt">{{ m.title }}</text> <text class="mt">{{ m.title }}</text>
<text class="arr"></text> <text class="arr"></text>
</view> </view>
</view> </view>
<view class="todo-head"> <view class="sec-h">
<view class="th"> <view class="th">
<text>我的待办</text> <text class="sec-t">我的待办</text>
<text v-if="todoCount" class="badge">{{ todoCount }}</text> <text v-if="todoCount" class="badge">{{ todoCount }}</text>
</view> </view>
<text class="more" @click="goTodo">查看全部 </text> <text class="more" @click="goTodo">查看全部</text>
</view>
<view v-if="!pending.length" class="empty-card">
<text class="et">暂无待办</text>
<text class="es">需要处理的审批和协同会出现在这里</text>
</view> </view>
<view v-if="!pending.length" class="empty">暂无待办</view>
<view v-for="t in pending" :key="pendKey(t)" class="card todo" @click="openPending(t)"> <view v-for="t in pending" :key="pendKey(t)" class="card todo" @click="openPending(t)">
<view class="av">{{ (t.submitter || t.applicant || '?').slice(0, 1) }}</view>
<view class="tm"> <view class="tm">
<text class="tag">{{ t.tag || t.typeLabel || t.type || '流程审批' }}</text>
<text class="tn">{{ t.title || t.no }}</text> <text class="tn">{{ t.title || t.no }}</text>
<text class="ts">{{ t.tag || t.typeLabel || t.type || '流程审批' }} · {{ t.submitter || '' }}</text> <text class="ts">{{ t.submitter || '' }}</text>
</view> </view>
<text class="chip">{{ t.btn || '去办理' }}</text> <text class="chip">{{ t.btn || '去办理' }}</text>
<text class="arr"></text>
</view> </view>
</view> </view>
</view> </view>
@@ -89,6 +110,12 @@ export default {
return { apps: [], erp: [], todos: [], pendingItems: [], shortcuts: [], todoCount: 0, announce: '', off: null } return { apps: [], erp: [], todos: [], pendingItems: [], shortcuts: [], todoCount: 0, announce: '', off: null }
}, },
computed: { computed: {
greet() {
const name = (store.me && store.me.name) || ''
const h = new Date().getHours()
const hi = h < 12 ? '上午好' : h < 18 ? '下午好' : '晚上好'
return name ? hi + '' + name : '工作台'
},
flows() { flows() {
const fromApi = (this.shortcuts || []).map((s, i) => ({ const fromApi = (this.shortcuts || []).map((s, i) => ({
key: 'sc-' + (s.to || s.label || i), key: 'sc-' + (s.to || s.label || i),
@@ -160,6 +187,7 @@ export default {
else toast('没有发起申请权限') else toast('没有发起申请权限')
}, },
goTodo() { uni.navigateTo({ url: '/pages/todo/list' }) }, goTodo() { uni.navigateTo({ url: '/pages/todo/list' }) },
mark(s) { return String(s || '应').replace(/\s/g, '').slice(0, 1) },
pendKey(t) { return t.no || t.id || t.to || t.title }, pendKey(t) { return t.no || t.id || t.to || t.title },
openPending(t) { openPending(t) {
if (t.source === 'work' || t.taskId) { if (t.source === 'work' || t.taskId) {
@@ -180,37 +208,58 @@ export default {
</script> </script>
<style scoped> <style scoped>
.body { padding: 16rpx 24rpx 40rpx; } .body { padding: 8rpx 28rpx 48rpx; }
.notice { .hello { margin: 4rpx 4rpx 20rpx; }
background: rgba(219, 225, 255, 0.4); .hello-sub { font-size: 26rpx; color: #6B7280; }
border: 1rpx solid #dbe1ff; .stats { display: flex; gap: 16rpx; margin-bottom: 20rpx; }
border-radius: 16rpx; .stat {
padding: 20rpx 24rpx; flex: 1; background: #fff; border-radius: 20rpx; padding: 22rpx 8rpx;
display: flex; justify-content: space-between; align-items: center; text-align: center; border: 1rpx solid rgba(17,24,39,0.06);
margin-bottom: 20rpx;
} }
.nlab { font-size: 24rpx; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .sn { display: block; font-size: 36rpx; font-weight: 650; color: #1677FF; font-variant-numeric: tabular-nums; }
.arr { color: #737686; } .sl { font-size: 24rpx; color: #6B7280; }
.apps, .mods { padding: 24rpx; margin-bottom: 20rpx; } .notice {
.cap { display: flex; justify-content: space-between; align-items: center; font-size: 30rpx; font-weight: 600; margin-bottom: 16rpx; border-bottom: 1rpx solid #eaedff; padding-bottom: 16rpx; } background: #fff;
.cap-sub { font-size: 22rpx; color: #737686; font-weight: 400; } border: 1rpx solid rgba(17,24,39,0.06);
border-radius: 20rpx;
padding: 20rpx 24rpx;
display: flex; align-items: center;
margin-bottom: 8rpx;
}
.ntag { font-size: 22rpx; color: #EA8C00; background: #FFF6E8; border-radius: 8rpx; padding: 4rpx 10rpx; margin-right: 12rpx; }
.nlab { font-size: 26rpx; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #111827; }
.arr { color: #C4C9D4; font-size: 32rpx; margin-left: 8rpx; }
.sec-h { display: flex; justify-content: space-between; align-items: center; margin: 28rpx 4rpx 14rpx; }
.sec-t { font-size: 30rpx; font-weight: 650; color: #111827; }
.th { display: flex; align-items: center; gap: 10rpx; }
.more { font-size: 26rpx; color: #1677FF; }
.apps, .mods { padding: 12rpx 8rpx 20rpx; }
.grid { display: flex; flex-wrap: wrap; } .grid { display: flex; flex-wrap: wrap; }
.app { width: 25%; display: flex; flex-direction: column; align-items: center; padding: 16rpx 4rpx; box-sizing: border-box; } .app { width: 25%; display: flex; flex-direction: column; align-items: center; padding: 16rpx 4rpx; box-sizing: border-box; }
.icon { width: 80rpx; height: 80rpx; border-radius: 20rpx; background: #f2f3ff; display: flex; align-items: center; justify-content: center; position: relative; margin-bottom: 8rpx; font-size: 32rpx; } .icon {
width: 88rpx; height: 88rpx; border-radius: 24rpx; background: #F3F6FB;
display: flex; align-items: center; justify-content: center;
position: relative; margin-bottom: 10rpx;
}
.mark { font-size: 30rpx; font-weight: 650; color: #1677FF; }
.abs { position: absolute; top: -8rpx; right: -8rpx; } .abs { position: absolute; top: -8rpx; right: -8rpx; }
.al { font-size: 22rpx; text-align: center; } .al { font-size: 24rpx; text-align: center; color: #111827; line-height: 1.35; }
.ad { font-size: 18rpx; color: #737686; text-align: center; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .mod { display: flex; align-items: center; padding: 22rpx 16rpx; }
.mod { display: flex; align-items: center; padding: 20rpx 0; border-top: 1rpx solid #eaedff; } .mod + .mod { border-top: 1rpx solid #F0F2F5; }
.mi { width: 48rpx; } .mi {
width: 64rpx; height: 64rpx; border-radius: 16rpx; background: #F3F6FB;
color: #1677FF; display: flex; align-items: center; justify-content: center;
font-weight: 650; margin-right: 16rpx;
}
.mt { flex: 1; font-size: 28rpx; } .mt { flex: 1; font-size: 28rpx; }
.todo-head { display: flex; justify-content: space-between; align-items: center; margin: 16rpx 8rpx; } .todo { display: flex; align-items: center; padding: 24rpx 24rpx; margin-bottom: 16rpx; }
.th { display: flex; align-items: center; gap: 10rpx; font-size: 30rpx; font-weight: 600; } .tm { flex: 1; min-width: 0; }
.more { font-size: 22rpx; color: #434655; } .tag { display: inline-block; font-size: 22rpx; color: #1677FF; background: #E8F1FF; border-radius: 8rpx; padding: 2rpx 10rpx; margin-bottom: 8rpx; }
.todo { display: flex; align-items: center; padding: 24rpx; margin-bottom: 16rpx; }
.av { width: 80rpx; height: 80rpx; border-radius: 50%; background: #dbe1ff; color: #004ac6; display: flex; align-items: center; justify-content: center; font-weight: 700; }
.tm { flex: 1; margin: 0 16rpx; min-width: 0; }
.tn { display: block; font-size: 28rpx; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .tn { display: block; font-size: 28rpx; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ts { font-size: 22rpx; color: #737686; } .ts { display: block; font-size: 24rpx; color: #6B7280; margin-top: 4rpx; }
.empty { padding: 24rpx; text-align: center; color: #737686; font-size: 24rpx; } .empty { padding: 28rpx; text-align: center; color: #6B7280; font-size: 26rpx; }
.ico { padding: 8rpx 16rpx; } .empty-card { background: #fff; border-radius: 24rpx; padding: 48rpx 32rpx; text-align: center; border: 1rpx solid rgba(17,24,39,0.06); }
.et { display: block; font-size: 28rpx; font-weight: 600; }
.es { display: block; font-size: 24rpx; color: #6B7280; margin-top: 8rpx; }
.ico { padding: 8rpx 8rpx; font-size: 28rpx; color: #1677FF; }
</style> </style>
+39 -20
View File
@@ -33,13 +33,17 @@
</view> </view>
<view v-if="logs.length" class="card block"> <view v-if="logs.length" class="card block">
<text class="h">流转轨迹</text> <text class="h">审批流程</text>
<view v-for="(log, i) in logs" :key="i" class="log"> <view v-for="(log, i) in logs" :key="i" class="log">
<text class="who">{{ log.who || log.actor || log.userName }} · {{ log.action }}</text> <view class="dot" :class="{ last: i === logs.length - 1 }" />
<view class="logb">
<text class="who">{{ log.who || log.actor || log.userName }}</text>
<text class="act">{{ log.action }}</text>
<text v-if="log.comment" class="s">{{ log.comment }}</text> <text v-if="log.comment" class="s">{{ log.comment }}</text>
<text class="s">{{ log.label || log.time || log.at || '' }}</text> <text class="s">{{ log.label || log.time || log.at || '' }}</text>
</view> </view>
</view> </view>
</view>
<view v-if="canAct" class="acts"> <view v-if="canAct" class="acts">
<view class="field"> <view class="field">
@@ -149,26 +153,41 @@ export default {
</script> </script>
<style scoped> <style scoped>
.body { padding: 24rpx; padding-bottom: 80rpx; } .body { padding: 24rpx 28rpx 200rpx; }
.card { padding: 28rpx; margin-bottom: 16rpx; } .card { padding: 28rpx; margin-bottom: 16rpx; }
.block { padding: 24rpx 28rpx; } .block { padding: 24rpx 28rpx; }
.h { display: block; font-size: 26rpx; font-weight: 700; margin-bottom: 12rpx; } .h { display: block; font-size: 30rpx; font-weight: 650; margin-bottom: 16rpx; }
.t { display: block; font-size: 34rpx; font-weight: 700; } .t { display: block; font-size: 34rpx; font-weight: 650; line-height: 1.4; }
.s { display: block; font-size: 24rpx; color: #737686; margin-top: 8rpx; } .s { display: block; font-size: 24rpx; color: #6B7280; margin-top: 8rpx; }
.amt { display: block; margin-top: 12rpx; color: #004ac6; font-weight: 700; font-size: 32rpx; } .amt { display: block; margin-top: 16rpx; color: #1677FF; font-weight: 650; font-size: 36rpx; }
.kv { display: flex; padding: 10rpx 0; border-bottom: 1rpx solid #eaedff; } .kv { display: flex; padding: 16rpx 0; }
.k { width: 180rpx; color: #737686; font-size: 24rpx; } .kv + .kv { border-top: 1rpx solid #F0F2F5; }
.v { flex: 1; font-size: 26rpx; } .k { width: 180rpx; color: #6B7280; font-size: 26rpx; }
.inv { padding: 12rpx 0; border-bottom: 1rpx solid #eaedff; } .v { flex: 1; font-size: 28rpx; text-align: right; }
.inv { padding: 16rpx 0; border-bottom: 1rpx solid #F0F2F5; }
.tn { display: block; font-weight: 600; font-size: 26rpx; } .tn { display: block; font-weight: 600; font-size: 26rpx; }
.log { padding: 12rpx 0; border-bottom: 1rpx solid #eaedff; } .log { display: flex; position: relative; padding: 0 0 28rpx 8rpx; }
.who { display: block; font-size: 26rpx; font-weight: 600; } .dot {
.field { margin: 24rpx 0; } width: 16rpx; height: 16rpx; border-radius: 50%; background: #1677FF; margin-top: 10rpx; flex-shrink: 0;
.lab { font-size: 24rpx; color: #434655; } box-shadow: 0 0 0 6rpx #E8F1FF;
.box { background: #fff; border-radius: 16rpx; padding: 20rpx; min-height: 140rpx; } }
.dot::after {
content: ''; position: absolute; left: 14rpx; top: 36rpx; bottom: 0; width: 2rpx; background: #E8ECF2;
}
.log:last-child .dot::after { display: none; }
.logb { margin-left: 20rpx; flex: 1; }
.who { display: block; font-size: 28rpx; font-weight: 600; }
.act { display: block; font-size: 24rpx; color: #1677FF; margin-top: 4rpx; }
.field { margin: 8rpx 0 20rpx; }
.lab { font-size: 26rpx; color: #4B5563; }
.box { background: #F5F7FA; border-radius: 16rpx; padding: 20rpx; min-height: 140rpx; margin-top: 10rpx; }
.acts {
position: fixed; left: 0; right: 0; bottom: 0; background: #fff;
border-top: 1rpx solid #E8ECF2; padding: 16rpx 28rpx calc(16rpx + env(safe-area-inset-bottom));
}
.btns { display: flex; gap: 16rpx; } .btns { display: flex; gap: 16rpx; }
.btn { flex: 1; height: 88rpx; border-radius: 16rpx; display: flex; align-items: center; justify-content: center; } .btn { flex: 1; height: 88rpx; border-radius: 16rpx; display: flex; align-items: center; justify-content: center; font-size: 30rpx; font-weight: 600; }
.no { background: #ffdad6; color: #ba1a1a; } .no { background: #fff; color: #DC2626; border: 1rpx solid #FECACA; }
.yes { flex: 1; } .yes { flex: 1.4; }
.empty { padding: 80rpx; text-align: center; color: #737686; } .empty { padding: 80rpx; text-align: center; color: #6B7280; }
</style> </style>
+26 -12
View File
@@ -3,17 +3,24 @@
<fy-header title="待办审批" back /> <fy-header title="待办审批" back />
<view v-if="!can" class="deny">当前账号没有审批或申请权限</view> <view v-if="!can" class="deny">当前账号没有审批或申请权限</view>
<view v-else> <view v-else>
<view class="tabs"> <scroll-view scroll-x class="tabs" :show-scrollbar="false">
<text v-for="t in tabs" :key="t.id" class="tab" :class="{ on: tab === t.id }" @click="switchTab(t.id)">{{ t.title }}</text> <text v-for="t in tabs" :key="t.id" class="tab" :class="{ on: tab === t.id }" @click="switchTab(t.id)">{{ t.title }}</text>
</scroll-view>
<view v-if="loading" class="empty">
<view class="sk" /><view class="sk short" />
</view>
<view v-else-if="!rows.length" class="empty">
<text class="et">暂无事项</text>
<text class="es">当前分类下没有需要处理的记录</text>
</view> </view>
<view v-if="loading" class="empty">加载中</view>
<view v-else-if="!rows.length" class="empty">暂无记录</view>
<view v-for="r in rows" :key="r.no || r.id" class="card item" @click="open(r)"> <view v-for="r in rows" :key="r.no || r.id" class="card item" @click="open(r)">
<view> <view class="main">
<text class="type">{{ r.typeLabel || r.type || '审批' }}</text>
<text class="t">{{ r.title || r.no }}</text> <text class="t">{{ r.title || r.no }}</text>
<text class="s">{{ r.typeLabel || r.type }} · {{ r.submitter || r.assigneeName || '' }}</text> <text class="s">{{ r.submitter || r.assigneeName || '' }}</text>
</view> </view>
<text class="chip">{{ r.status || '待处理' }}</text> <text class="chip">{{ r.status || '待处理' }}</text>
<text class="arr"></text>
</view> </view>
</view> </view>
</view> </view>
@@ -83,11 +90,18 @@ export default {
</script> </script>
<style scoped> <style scoped>
.tabs { display: flex; padding: 16rpx 16rpx 0; } .tabs { white-space: nowrap; padding: 8rpx 20rpx 0; }
.tab { flex: 1; text-align: center; font-size: 24rpx; color: #737686; padding: 16rpx 0; } .tab { display: inline-block; font-size: 28rpx; color: #6B7280; padding: 18rpx 24rpx; }
.tab.on { color: #2563eb; font-weight: 700; border-bottom: 4rpx solid #2563eb; } .tab.on { color: #1677FF; font-weight: 650; border-bottom: 4rpx solid #1677FF; }
.item { margin: 16rpx 24rpx; padding: 24rpx; display: flex; justify-content: space-between; align-items: center; } .item { margin: 16rpx 28rpx; padding: 24rpx; display: flex; align-items: center; }
.t { display: block; font-size: 28rpx; font-weight: 600; } .main { flex: 1; min-width: 0; }
.s { font-size: 22rpx; color: #737686; } .type { display: inline-block; font-size: 22rpx; color: #1677FF; background: #E8F1FF; border-radius: 8rpx; padding: 2rpx 10rpx; margin-bottom: 8rpx; }
.empty, .deny { padding: 80rpx; text-align: center; color: #737686; } .t { display: block; font-size: 28rpx; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.s { display: block; font-size: 24rpx; color: #6B7280; margin-top: 6rpx; }
.arr { color: #C4C9D4; font-size: 32rpx; margin-left: 8rpx; }
.empty, .deny { padding: 80rpx 40rpx; text-align: center; color: #6B7280; }
.et { display: block; font-size: 30rpx; font-weight: 600; color: #111827; }
.es { display: block; font-size: 24rpx; margin-top: 8rpx; }
.sk { height: 28rpx; background: #E8ECF2; border-radius: 8rpx; margin: 0 auto 16rpx; width: 60%; }
.sk.short { width: 36%; }
</style> </style>
+6 -6
View File
@@ -1,6 +1,6 @@
$fy-brand: #2563eb; $fy-brand: #1677FF;
$fy-brand-deep: #004ac6; $fy-brand-deep: #0958D9;
$fy-surface: #faf8ff; $fy-surface: #F5F7FA;
$fy-ink: #131b2e; $fy-ink: #111827;
$fy-muted: #737686; $fy-muted: #6B7280;
$fy-line: #eaedff; $fy-line: #E8ECF2;