微信小程序页面迁移校验之前 P5任务处理之前

apps/miniprogram - 副本/miniprogram/components/note-modal/note-modal.json

@@ -0,0 +1,9 @@
+{
+  "component": true,
+  "usingComponents": {
+    "t-rate": "tdesign-miniprogram/rate/rate",
+    "t-textarea": "tdesign-miniprogram/textarea/textarea",
+    "t-button": "tdesign-miniprogram/button/button",
+    "t-icon": "tdesign-miniprogram/icon/icon"
+  }
+}

apps/miniprogram - 副本/miniprogram/components/note-modal/note-modal.ts

@@ -0,0 +1,79 @@
+Component({
+  properties: {
+    /** 控制弹窗显示/隐藏 */
+    visible: {
+      type: Boolean,
+      value: false,
+    },
+    /** 客户名（弹窗标题显示） */
+    customerName: {
+      type: String,
+      value: '',
+    },
+    /** 初始评分 0-10 */
+    initialScore: {
+      type: Number,
+      value: 0,
+    },
+    /** 初始备注内容 */
+    initialContent: {
+      type: String,
+      value: '',
+    },
+  },
+
+  observers: {
+    'visible, initialScore, initialContent'(visible: boolean) {
+      if (visible) {
+        const clamped = Math.max(0, Math.min(10, this.data.initialScore))
+        this.setData({
+          starValue: clamped / 2,
+          content: this.data.initialContent,
+          score: clamped,
+        })
+      }
+    },
+  },
+
+  data: {
+    /** 星星值 0-5（半星制） */
+    starValue: 0,
+    /** 内部评分 0-10 */
+    score: 0,
+    /** 备注内容 */
+    content: '',
+  },
+
+  methods: {
+    /** 星星评分变化 */
+    onRateChange(e: WechatMiniprogram.CustomEvent<{ value: number }>) {
+      const starVal = e.detail.value
+      this.setData({
+        starValue: starVal,
+        score: starVal * 2,
+      })
+    },
+
+    /** 文本内容变化 */
+    onContentChange(e: WechatMiniprogram.CustomEvent<{ value: string }>) {
+      this.setData({ content: e.detail.value })
+    },
+
+    /** 确认提交 */
+    onConfirm() {
+      if (!this.data.content.trim()) return
+      this.triggerEvent('confirm', {
+        score: this.data.score,
+        content: this.data.content.trim(),
+      })
+    },
+
+    /** 取消关闭 */
+    onCancel() {
+      this.triggerEvent('cancel')
+    },
+
+    /** 阻止冒泡 */
+    noop() {},
+  },
+})

apps/miniprogram - 副本/miniprogram/components/note-modal/note-modal.wxml

@@ -0,0 +1,46 @@
+<view class="modal-mask" wx:if="{{visible}}" catchtap="onCancel">
+  <view class="modal-content" catchtap="noop">
+    <!-- 头部 -->
+    <view class="modal-header">
+      <text class="modal-title">添加备注{{customerName ? ' - ' + customerName : ''}}</text>
+      <view class="modal-close" bindtap="onCancel">
+        <t-icon name="close" size="40rpx" color="#a6a6a6" />
+      </view>
+    </view>
+
+    <!-- 评分区域 -->
+    <view class="rating-section">
+      <text class="rating-label">评分</text>
+      <t-rate
+        value="{{starValue}}"
+        count="{{5}}"
+        allow-half="{{true}}"
+        size="48rpx"
+        bind:change="onRateChange"
+      />
+    </view>
+
+    <!-- 文本输入 -->
+    <view class="textarea-section">
+      <t-textarea
+        value="{{content}}"
+        placeholder="请输入备注内容..."
+        maxlength="{{500}}"
+        autosize="{{true}}"
+        bind:change="onContentChange"
+      />
+    </view>
+
+    <!-- 底部按钮 -->
+    <view class="modal-footer">
+      <t-button theme="default" size="large" block bindtap="onCancel">取消</t-button>
+      <t-button
+        theme="primary"
+        size="large"
+        block
+        disabled="{{!content.trim()}}"
+        bindtap="onConfirm"
+      >确认</t-button>
+    </view>
+  </view>
+</view>

apps/miniprogram - 副本/miniprogram/components/note-modal/note-modal.wxss

@@ -0,0 +1,68 @@
+.modal-mask {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 1000;
+  display: flex;
+  align-items: flex-end;
+}
+
+.modal-content {
+  width: 100%;
+  background: #ffffff;
+  border-radius: 48rpx 48rpx 0 0;
+  padding: 40rpx 40rpx 60rpx;
+  box-sizing: border-box;
+}
+
+.modal-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 32rpx;
+}
+
+.modal-title {
+  font-size: var(--font-lg, 36rpx);
+  font-weight: 600;
+  color: var(--color-gray-13, #242424);
+}
+
+.modal-close {
+  width: 64rpx;
+  height: 64rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  background: var(--color-gray-1, #f3f3f3);
+}
+
+.rating-section {
+  display: flex;
+  align-items: center;
+  gap: 24rpx;
+  margin-bottom: 32rpx;
+}
+
+.rating-label {
+  font-size: var(--font-sm, 28rpx);
+  color: var(--color-gray-9, #5e5e5e);
+  flex-shrink: 0;
+}
+
+.textarea-section {
+  margin-bottom: 40rpx;
+}
+
+.modal-footer {
+  display: flex;
+  gap: 24rpx;
+}
+
+.modal-footer t-button {
+  flex: 1;
+}