From 53810114ede12653f7617326dc31cdbc67df7ab0 Mon Sep 17 00:00:00 2001
From: ZF sun <34314687@qq.com>
Date: Tue, 13 Oct 2026 14:58:59 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=91=98=E5=B7=A5=E7=AB=AF=E7=94=B3?=
 =?UTF-8?q?=E8=AF=B7=E5=90=8D=E7=89=87=E5=85=A5=E5=8F=A3=E4=B8=8E=E7=94=B3?=
 =?UTF-8?q?=E8=AF=B7=E9=A1=B5(=E9=85=8D=E5=90=88=E5=95=86=E5=AE=B6?=
 =?UTF-8?q?=E5=90=8E=E5=8F=B0=E5=AE=A1=E6=89=B9=E9=97=AD=E7=8E=AF)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- list.vue 空态新增「申请」入口(仅无名片时显示)
- 新增 apply.vue: 姓名+手机号提交 /card/api/apply/submit
- pages.json 注册 card/apply 路由
---
 pages.json                |   6 ++
 pages_tool/card/apply.vue | 155 ++++++++++++++++++++++++++++++++++++++
 pages_tool/card/list.vue  |  18 ++++-
 3 files changed, 177 insertions(+), 2 deletions(-)
 create mode 100644 pages_tool/card/apply.vue

diff --git a/pages.json b/pages.json
index 39d107c..7b8094b 100644
--- a/pages.json
+++ b/pages.json
@@ -1486,6 +1486,12 @@
 						"navigationBarTitleText": "编辑名片"
 					}
 				},
+				{
+					"path": "card/apply",
+					"style": {
+						"navigationBarTitleText": "申请名片"
+					}
+				},
 				{
 					"path": "card/leads",
 					"style": {
diff --git a/pages_tool/card/apply.vue b/pages_tool/card/apply.vue
new file mode 100644
index 0000000..8714f33
--- /dev/null
+++ b/pages_tool/card/apply.vue
@@ -0,0 +1,155 @@
+<template>
+	<view class="card-apply">
+		<view class="tips">
+			<text class="tips-title">向商家申请一张数字名片</text>
+			<text class="tips-sub">提交后商家会收到通知，同意后名片自动出现在你的名片夹</text>
+		</view>
+
+		<view class="form-group">
+			<view class="form-row">
+				<view class="row-label"><text class="req-star">*</text>姓名</view>
+				<input class="row-input" :value="form.name" placeholder="你希望名片上显示的姓名"
+					@input="e => form.name = e.detail.value" />
+			</view>
+			<view class="form-row">
+				<view class="row-label"><text class="req-star">*</text>手机号</view>
+				<input class="row-input" type="number" :value="form.mobile" placeholder="你注册本店使用的手机号"
+					@input="e => form.mobile = e.detail.value" />
+			</view>
+		</view>
+
+		<view class="save-bar">
+			<button class="save-btn" :disabled="submitting" @tap="submit">{{ submitting ? '提交中…' : '提交申请' }}</button>
+		</view>
+	</view>
+</template>
+
+<script>
+export default {
+	data() {
+		return {
+			form: { name: '', mobile: '' },
+			submitting: false
+		};
+	},
+	onLoad() {
+		uni.setNavigationBarTitle({ title: '申请名片' });
+	},
+	methods: {
+		submit() {
+			if (this.submitting) return;
+			const name = String(this.form.name || '').trim();
+			const mobile = String(this.form.mobile || '').trim();
+			if (!name) {
+				uni.showToast({ title: '请填写姓名', icon: 'none' });
+				return;
+			}
+			if (!/^1\d{10}$/.test(mobile)) {
+				uni.showToast({ title: '请填写正确的 11 位手机号', icon: 'none' });
+				return;
+			}
+			this.submitting = true;
+			this.$api.sendJson({
+				url: '/card/api/apply/submit',
+				data: { name: name, mobile: mobile },
+				success: res => {
+					this.submitting = false;
+					if (res.code == 0) {
+						uni.showToast({ title: '申请已提交', icon: 'success' });
+						setTimeout(() => uni.navigateBack(), 600);
+					} else {
+						uni.showToast({ title: res.message || '提交失败', icon: 'none' });
+					}
+				},
+				fail: () => {
+					this.submitting = false;
+					uni.showToast({ title: '网络异常，请稍后重试', icon: 'none' });
+				}
+			});
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+.card-apply {
+	min-height: 100vh;
+	background-color: #f6f7f9;
+	padding: 24rpx 24rpx 60rpx;
+	box-sizing: border-box;
+}
+
+.tips {
+	padding: 20rpx 8rpx 24rpx;
+	display: flex;
+	flex-direction: column;
+
+	.tips-title {
+		font-size: 32rpx;
+		font-weight: 600;
+		color: #333;
+	}
+
+	.tips-sub {
+		margin-top: 8rpx;
+		font-size: 24rpx;
+		color: #999;
+		line-height: 1.6;
+	}
+}
+
+.form-group {
+	background-color: #ffffff;
+	border-radius: 16rpx;
+	overflow: hidden;
+
+	.form-row {
+		display: flex;
+		align-items: center;
+		padding: 28rpx 24rpx;
+		border-bottom: 1rpx solid #f0f0f0;
+
+		&:last-child {
+			border-bottom: none;
+		}
+
+		.row-label {
+			width: 160rpx;
+			font-size: 28rpx;
+			color: #666;
+			flex-shrink: 0;
+
+			.req-star {
+				color: #f5222d;
+				margin-right: 4rpx;
+				font-weight: 600;
+			}
+		}
+
+		.row-input {
+			flex: 1;
+			font-size: 28rpx;
+			color: #333;
+		}
+	}
+}
+
+.save-bar {
+	padding: 40rpx 0 0;
+
+	.save-btn {
+		height: 88rpx;
+		line-height: 88rpx;
+		background-color: var(--main-color, #0054a5);
+		color: #ffffff;
+		font-size: 30rpx;
+		border-radius: 44rpx;
+
+		&[disabled] {
+			opacity: 0.6;
+			color: #ffffff;
+			background-color: var(--main-color, #0054a5);
+		}
+	}
+}
+</style>
diff --git a/pages_tool/card/list.vue b/pages_tool/card/list.vue
index ee2f730..bf36d49 100644
--- a/pages_tool/card/list.vue
+++ b/pages_tool/card/list.vue
@@ -9,6 +9,7 @@
 				<text class="iconfont icon-sousuo3" @tap="onSearch"></text>
 			</view>
 			<view class="claim-btn create-btn" @tap="goCreate">新建</view>
+			<view class="claim-btn apply-btn" v-if="!isLoading && list.length === 0" @tap="goApply">申请</view>
 			<view class="claim-btn" @tap="onClaimTap">认领</view>
 		</view>
 
@@ -54,7 +55,7 @@ export default {
 			count: 0,
 			keyword: '',
 			isLoading: false,
-			emptyText: '暂无名片，可点击右上角「新建」或「认领」添加'
+			emptyText: '暂无名片，可「新建」「申请」或「认领」添加'
 		};
 	},
 	onLoad() {
@@ -105,7 +106,7 @@ export default {
 						this.list = pageNo === 1 ? rows : this.list.concat(rows);
 						this.emptyText = this.keyword.trim()
 							? '未找到匹配的名片'
-							: '暂无名片，可点击右上角「新建」或「认领」添加';
+							: '暂无名片，可「新建」「申请」或「认领」添加';
 					} else {
 						this.handleApiError(res);
 					}
@@ -130,6 +131,12 @@ export default {
 				url: '/pages_tool/card/edit'
 			});
 		},
+		// 员工已注册但没有名片时, 向商家提交建卡申请(商家后台审批后自动归属)
+		goApply() {
+			uni.navigateTo({
+				url: '/pages_tool/card/apply'
+			});
+		},
 		onClaimTap() {
 			uni.showModal({
 				title: '认领名片',
@@ -240,6 +247,13 @@ export default {
 			background-color: var(--main-color-shallow, #e8f1fb);
 			color: var(--main-color, #0054a5);
 		}
+
+		/* 「申请」: 仅空态出现的第三入口, 边框幽灵式再弱一档 */
+		&.apply-btn {
+			background-color: #ffffff;
+			color: #666666;
+			border: 1rpx solid #dcdfe6;
+		}
 	}
 }