对注册加了修改

components.d.ts

@@ -7,17 +7,24 @@ export {}
 
 declare module 'vue' {
   export interface GlobalComponents {
+    ElAvatar: typeof import('element-plus/es')['ElAvatar']
     ElButton: typeof import('element-plus/es')['ElButton']
     ElCard: typeof import('element-plus/es')['ElCard']
     ElCol: typeof import('element-plus/es')['ElCol']
     ElContainer: typeof import('element-plus/es')['ElContainer']
+    ElDescriptions: typeof import('element-plus/es')['ElDescriptions']
+    ElDescriptionsItem: typeof import('element-plus/es')['ElDescriptionsItem']
+    ElDivider: typeof import('element-plus/es')['ElDivider']
     ElForm: typeof import('element-plus/es')['ElForm']
     ElFormItem: typeof import('element-plus/es')['ElFormItem']
+    ElHeader: typeof import('element-plus/es')['ElHeader']
+    ElIcon: typeof import('element-plus/es')['ElIcon']
     ElInput: typeof import('element-plus/es')['ElInput']
     ElMain: typeof import('element-plus/es')['ElMain']
     ElOption: typeof import('element-plus/es')['ElOption']
     ElRow: typeof import('element-plus/es')['ElRow']
     ElSelect: typeof import('element-plus/es')['ElSelect']
+    ElTag: typeof import('element-plus/es')['ElTag']
     Header: typeof import('./src/components/Header.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']

src/api/user.ts

@@ -12,13 +12,13 @@ type RegisterInfo = {
     phone: string,
     password: string,
     address: string,
-    storeId: number | null,
+    storeId?: number,
 }
 
 type UpdateInfo = {
-    name: string | null,
-    password: string | null,
-    address: string | null,
+    name?: string,
+    password?: string,
+    address?: string,
 }
 
 // 如果有“Vue: This may be converted to an async function”警告，可以不管

src/views/user/Register.vue

@@ -10,7 +10,9 @@ const tel = ref('')
 const address = ref('')
 const password = ref('')
 const confirmPassword = ref('')
-const storeId = ref(null)
+
+//对于商家用户，还需要在注册时选择所属商店，从而传入storeId。但由于Lab2才会开发商店模块，所以这里暂且设置一个Id为1的商店，待Lab2完善
+const storeId = ref<number>()
 
 // 电话号码是否为空
 const hasTelInput = computed(() => tel.value != '')
@@ -23,7 +25,7 @@ const hasAddressInput = computed(() => address.value != '')
 // 身份是否为空
 const hasIdentityChosen = computed(() => identity.value != '')
 // 对于商家用户，商店Id是否为空
-const hasStoreId = computed(() => storeId.value != '')
+const hasStoreName = computed(() => storeId.value != undefined)
 // 电话号码的规则
 const chinaMobileRegex = /^1(3[0-9]|4[579]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[189])\d{8}$/
 const telLegal = computed(() => chinaMobileRegex.test(tel.value))
@@ -33,25 +35,15 @@ const isPasswordIdentical = computed(() => password.value == confirmPassword.val
 const registerDisabled = computed(() => {
   if (!hasIdentityChosen.value) {
     return true
-  } else if (identity.value === 'CUSTOMER') {
+  } else if (identity.value == 'CUSTOMER') {
     return !(hasTelInput.value && hasPasswordInput.value && hasConfirmPasswordInput && hasAddressInput.value &&
         telLegal.value && isPasswordIdentical.value)
-  } else if (identity.value === 'STAFF') {
+  } else if (identity.value == 'STAFF') {
     return !(hasTelInput.value && hasPasswordInput.value && hasConfirmPasswordInput && hasAddressInput.value &&
-        hasStoreId.value && telLegal.value && isPasswordIdentical.value)
+        hasStoreName.value && telLegal.value && isPasswordIdentical.value)
   }
 })
 
-function identityChange() {
-  if (identity.value === 'STAFF') {
-    storeId.value = 1    //对于商家用户，可以暂且将所属商店Id硬编码为1，这会待Lab2开发商店模块时进行完善
-  } else if (identity.value === 'CUSTOMER') {
-    storeId.value = null
-  }
-  console.log(storeId.value)
-  console.log(typeof storeId.value)
-}
-
 // 注册按钮触发
 function handleRegister() {
   userRegister({
@@ -68,7 +60,7 @@ function handleRegister() {
         type: 'success',
         center: true,
       })
-      storeId.value = null
+      storeId.value = undefined
       router.push({path: "/login"})
     } else if (res.data.code === '400') {
       ElMessage({
@@ -106,7 +98,6 @@ function handleRegister() {
                 <label for="identity">身份</label>
                 <el-select id="identity"
                            v-model="identity"
-                           @change="identityChange()"
                            placeholder="请选择"
                            style="width: 100%;"
                 >
@@ -168,13 +159,16 @@ function handleRegister() {
                 <label for="address">
                   所属商店（需待Lab2中完善）
                 </label>
-                <el-input id="storeId"
-                          v-model="storeId"
-                          placeholder="请填入商店Id"/>
+                <el-select id="storeName"
+                           v-model="storeId"
+                           placeholder="请选择"
+                           style="width: 100%;"
+                >
+                  <el-option value="1" label="商店"/>
+                </el-select>
               </el-form-item>
             </el-col>
 
-
           </el-row>
 
           <el-form-item>