✨ feat: 增加乐跑账号备注功能

src/pages/admin/lepaoAccount/accountList.vue

@@ -13,7 +13,7 @@
                                 <a-form-item field="area" label="跑区">
                                     <a-select v-model="queryData.area" placeholder="请选择乐跑跑区" default-value="">
                                         <a-option value="">所有</a-option>
-                                        <a-option v-for="(item, index) in areas" :key="index" :value="item">
+                                        <a-option v-for="(item, index) in area" :key="index" :value="item">
                                             {{ item }}
                                         </a-option>
                                     </a-select>
@@ -125,21 +125,52 @@
                     <a-dropdown :popup-max-height="false" trigger="hover">
                         <a-button>操作 <icon-down /></a-button>
                         <template #content>
+                            <a-doption @click="editAccount(record)"><icon-edit /> 编辑账号</a-doption>
                             <a-doption @click="SingleRun(record)"><icon-play-circle /> 开始单次乐跑</a-doption>
                             <a-doption @click="ChangeAutoRun(record)"><icon-translate /> {{ record.auto_run ? '关闭' :
                                 '开启' }}自动乐跑</a-doption>
-                            <a-doption @click="DeleteAccount(record)"><icon-delete /> 解绑账号</a-doption>
+                            <a-doption @click="DeleteAccount(record)"><icon-minus-circle /> 解绑账号</a-doption>
                         </template>
                     </a-dropdown>
                 </template>
             </a-table>
         </a-card>
     </div>
+
+    <!-- 账号编辑对话框 -->
+    <a-modal v-model:visible="visible" title="编辑账号" @cancel="handleCancel" @before-ok="handleBeforeOk" draggable
+        :ok-loading="ok_loading" esc-to-close closable>
+        <a-form :model="form">
+            <a-form-item field="student_num" label="学号">
+                <a-input v-model="form.student_num" placeholder="账号所有者学号，填写错误将无法登录" />
+            </a-form-item>
+            <a-form-item field="email" label="通知邮箱">
+                <a-input v-model="form.email" placeholder="用于接收乐跑失败、登录失效的通知" />
+            </a-form-item>
+            <a-form-item field="area" label="乐跑跑区">
+                <a-select v-model="form.area" placeholder="请选择乐跑跑区" default-value="">
+                    <a-option value="">随机分配</a-option>
+                    <a-option v-for="(item, index) in area" :key="index" :value="item">
+                        <span class="vipcontent">
+                            <span>{{ item }} </span>
+                        </span>
+                    </a-option>
+                </a-select>
+            </a-form-item>
+            <a-form-item field="area" label="自动乐跑时段">
+                <a-select v-model="form.auto_time" placeholder="请选择每天自动乐跑的时段" :options="auto_time" />
+            </a-form-item>
+            <a-form-item field="notes" label="备注">
+                <a-textarea v-model="form.notes" placeholder="添加对账号的备注（非必填）" :max-length="{ length: 50 }" allow-clear
+                    show-word-limit />
+            </a-form-item>
+        </a-form>
+    </a-modal>
 </template>
 
 <script setup>
 import { ref, reactive, onMounted, h } from 'vue'
-import { adminAccountList, deleteAccount, changeAutoRun, singleRun } from '@/api/lepao'
+import { addAccount, adminAccountList, deleteAccount, changeAutoRun, singleRun } from '@/api/lepao'
 import { Modal, Notification, Message } from '@arco-design/web-vue'
 
 const queryData = reactive({
@@ -157,13 +188,26 @@ const pagination = reactive({
     pagesize: 20
 })
 
+const visible = ref(false)
+const ok_loading = ref(false)
+const form = reactive({
+    id: null,
+    student_num: '',
+    email: '',
+    distance: [2.00, 4.00],
+    area: '',
+    auto_time: 8,
+    notes: ''
+})
+
+
 const loading = ref(false)
 const data = ref([])
 
 const state = [
     { label: '全部', value: -1 }, { label: '需登录', value: 0 }, { label: '正常', value: 1 }, { label: '状态异常', value: 2 }
 ]
-const areas = ["兰花湖校区跑区", "主校区北跑区", "主校区南跑区"]
+const area = ["兰花湖校区跑区", "主校区北跑区", "主校区南跑区"]
 
 const columns = [
 
@@ -233,6 +277,10 @@ const columns = [
         title: '上次更新时间',
         slotName: 'update_time',
         width: 150
+    }, {
+        title: '备注',
+        dataIndex: 'notes',
+        width: 200
     }, {
         title: '操作',
         slotName: 'optional',
@@ -281,6 +329,77 @@ const getAccounts = async () => {
     }
 }
 
+const editAccount = (item) => {
+    if (item) {
+        form.id = item.id
+        form.student_num = item.student_num
+        form.email = item.email
+        form.area = item.area
+        form.auto_time = item.auto_time
+        form.notes = item.notes
+    } else {
+        form.id = null
+        form.student_num = ''
+        form.email = email.value
+        form.notes = ''
+    }
+    visible.value = true
+}
+
+const handleBeforeOk = async (done) => {
+    try {
+        ok_loading.value = true
+        const { student_num, email } = form
+        if (!student_num || !email) {
+            Message.error('请填写完整的账号信息')
+            return false
+        }
+
+        const studentNumRegex = /^\d{10}$/
+        if (!studentNumRegex.test(student_num)) {
+            Message.error('请检查学号格式是否正确')
+            return false
+        }
+
+        const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/
+        if (!emailRegex.test(email)) {
+            Message.error('请检查邮箱格式是否正确')
+            return false
+        }
+
+        let data = {
+            ...form,
+            min_distance: form.distance[0],
+            max_distance: form.distance[1]
+        }
+
+        const res = await addAccount(data)
+        if (!res || res.code !== 0) {
+            Notification.error({
+                title: '保存乐跑账号失败！',
+                content: res?.msg ?? '请稍后再试'
+            })
+            return false
+        }
+
+        Message.success('保存成功！')
+        done()
+        getAccounts()
+    } catch (error) {
+        Notification.error({
+            title: '保存乐跑账号失败！',
+            content: error.message || '请稍后再试'
+        })
+        return false
+    } finally {
+        ok_loading.value = false
+    }
+}
+
+const handleCancel = () => {
+  visible.value = false;
+}
+
 // 分页 - 页码变化
 const handlePageChange = (page) => {
     pagination.current = page

src/pages/lepao/accountList/index.vue

@@ -157,6 +157,11 @@
               {{ stramptoTime(record.update_time || record.create_time) }}
             </template>
           </a-table-column>
+          <a-table-column title="备注" :width="200" ellipsis tooltip>
+            <template #cell="{ record }">
+              {{ record.notes }}
+            </template>
+          </a-table-column>
 
           <a-table-column title="" fixed="right" :width="100">
             <template #cell="{ record }">
@@ -167,7 +172,7 @@
                   <a-doption @click="SingleRun(record)"><icon-play-circle /> 开始单次乐跑</a-doption>
                   <a-doption @click="ChangeAutoRun(record)"><icon-translate /> {{ record.auto_run ? '关闭' :
                     '开启' }}自动乐跑</a-doption>
-                  <a-doption @click="DeleteAccount(record)"><icon-delete /> 解绑账号</a-doption>
+                  <a-doption @click="DeleteAccount(record)"><icon-minus-circle /> 解绑账号</a-doption>
                 </template>
               </a-dropdown>
             </template>
@@ -201,6 +206,10 @@
       <a-form-item field="area" label="自动乐跑时段">
         <a-select v-model="form.auto_time" placeholder="请选择每天自动乐跑的时段" :options="auto_time" />
       </a-form-item>
+      <a-form-item field="notes" label="备注">
+        <a-textarea v-model="form.notes" placeholder="添加对账号的备注（非必填）" :max-length="{length:50}" allow-clear
+                show-word-limit />
+      </a-form-item>
       <!-- <a-form-item field="distance" label="距离区间">
         <a-select v-model="form.distance" placeholder="请选择距离区间">
           <a-option :value="0">默认(2~4Km)</a-option>
@@ -283,6 +292,7 @@ const form = reactive({
   distance: [2.00, 4.00],
   area: '',
   auto_time: 8,
+  notes: ''
 })
 
 const download = () => {
@@ -300,14 +310,14 @@ const editAccount = (item) => {
     form.id = item.id
     form.student_num = item.student_num
     form.email = item.email
-    form.distance[0] = item.min_distance
-    form.distance[1] = item.max_distance
     form.area = item.area
     form.auto_time = item.auto_time
+    form.notes = item.notes
   } else {
     form.id = null
     form.student_num = ''
     form.email = email.value
+    form.notes = ''
   }
   visible.value = true
 }
@@ -363,7 +373,7 @@ const handleBeforeOk = async (done) => {
 }
 
 const handleCancel = () => {
-  visible.value = false;
+  visible.value = false
 }
 
 const getAccounts = async () => {
@@ -446,7 +456,6 @@ const ChangeAutoRun = async (record) => {
   }
 }
 
-
 const stramptoTime = (time) => {
   return new Date(time).toLocaleString('zh-CN', { year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit', second: '2-digit' })
 }

src/router/index.js

@@ -116,7 +116,7 @@ const routes = [
         component: DEFAULT_LAYOUT,
         meta: {
             title: '校园乐跑',
-            icon: 'icon-robot'
+            icon: 'icon-thunderbolt'
         },
         children: [
             {