Add native place cascading selector and generated data

web/src/views/PersonnelView.vue

@@ -5,6 +5,7 @@ import { useRoute, useRouter } from 'vue-router'
 import http, { apiErrorMessage } from '../api/http'
 import { downloadApiFile, importExcel } from '../api/excel'
 import { useAuthStore } from '../stores/auth'
+import NativePlaceCascader from '../components/NativePlaceCascader.vue'
 
 type Registry = 'teachers' | 'students'
 interface PageResult {
@@ -636,7 +637,7 @@ watch(active, async () => {
           </div>
           <div class="form-grid">
             <el-form-item label="政治面貌"><el-input v-model="form.politicalStatus" /></el-form-item>
-            <el-form-item label="籍贯"><el-input v-model="form.nativePlace" /></el-form-item>
+            <el-form-item label="籍贯"><NativePlaceCascader v-model="form.nativePlace" /></el-form-item>
           </div>
           <div class="form-grid">
             <el-form-item label="户籍地址"><el-input v-model="form.householdAddress" /></el-form-item>

web/src/views/StudentProfileView.vue

@@ -2,6 +2,7 @@
 import { onMounted, reactive, ref } from 'vue'
 import { Check, EditPen, Refresh } from '@element-plus/icons-vue'
 import http, { apiErrorMessage } from '../api/http'
+import NativePlaceCascader from '../components/NativePlaceCascader.vue'
 
 const loading = ref(true)
 const saving = ref(false)
@@ -127,7 +128,7 @@ onMounted(load)
           <el-form-item label="国籍"><el-input v-model="form.nationality" maxlength="50" /></el-form-item>
           <el-form-item label="民族"><el-input v-model="form.ethnicity" maxlength="50" /></el-form-item>
           <el-form-item label="政治面貌"><el-input v-model="form.politicalStatus" maxlength="50" /></el-form-item>
-          <el-form-item label="籍贯"><el-input v-model="form.nativePlace" maxlength="100" /></el-form-item>
+          <el-form-item label="籍贯" class="span-2"><NativePlaceCascader v-model="form.nativePlace" /></el-form-item>
         </div>
       </article>