upload tip user

src/views/system/user/index.vue

@@ -80,7 +80,8 @@
           </el-form-item>
           <el-form-item>
             <el-button icon="Search" type="primary" @click="handleQuery"
-              >搜索</el-button
+            >搜索
+            </el-button
             >
             <el-button icon="Refresh" @click="resetQuery">重置</el-button>
           </el-form-item>
@@ -151,7 +152,7 @@
             :data="userList"
             @selection-change="handleSelectionChange"
         >
-          <el-table-column align="center" type="selection" width="50" />
+          <el-table-column align="center" type="selection" width="50"/>
           <el-table-column
               v-if="columns[0].visible"
               key="userId"
@@ -459,21 +460,16 @@
           drag
       >
         <el-icon class="el-icon--upload">
-          <upload-filled />
+          <upload-filled/>
         </el-icon>
         <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
         <template #tip>
           <div class="el-upload__tip text-center">
-            <div class="el-upload__tip">
+            <ol style="text-align: start;margin-left: 20px;">
-              <el-checkbox v-model="upload.updateSupport" />
+              <li>(*)为必填项</li>
-              是否更新已经存在的用户数据
+              <li>角色,岗位请填数字编号</li>
-            </div>
+              <li>角色,岗位若存在多个,| 隔开即可</li>
-            <div>
+              <li><span>仅允许导入xls、xlsx格式文件。</span>
-              1. (*)为必填项
-              2. 角色,岗位请填数字编号
-              3. 角色,岗位若存在多个,| 隔开即可
-            </div>
-            <span>仅允许导入xls、xlsx格式文件。</span>
                 <el-link
                     :underline="false"
                     style="font-size: 12px; vertical-align: baseline"
@@ -481,6 +477,9 @@
                     @click="importTemplate"
                 >下载模板
                 </el-link>
+              </li>
+            </ol>
+
           </div>
         </template>
       </el-upload>
@@ -495,7 +494,7 @@
 </template>
 
 <script lang="jsx" name="User" setup>
-import { getToken } from "@/utils/auth";
+import {getToken} from "@/utils/auth";
 import {
   addUser,
   changeUserStatus,
@@ -506,11 +505,11 @@ import {
   resetUserPwd,
   updateUser,
 } from "@/api/system/user";
-import { sys_normal_disable, sys_user_gender } from "@/constant/dict";
+import {sys_normal_disable, sys_user_gender} from "@/constant/dict";
-import { ElMessageBox } from "element-plus";
+import {ElMessageBox} from "element-plus";
 
 const router = useRouter();
-const { proxy } = getCurrentInstance();
+const {proxy} = getCurrentInstance();
 
 const userList = ref([]);
 const open = ref(false);
@@ -538,19 +537,19 @@ const upload = reactive({
   // 是否更新已经存在的用户数据
   updateSupport: 0,
   // 设置上传的请求头部
-  headers: { Authorization: "Bearer " + getToken() },
+  headers: {Authorization: "Bearer " + getToken()},
   // 上传的地址
   url: import.meta.env.VITE_APP_BASE_API + "/system/user/importData",
 });
 // 列显隐信息
 const columns = ref([
-  { key: 0, label: `用户编号`, visible: true },
+  {key: 0, label: `用户编号`, visible: true},
-  { key: 1, label: `登录账号`, visible: true },
+  {key: 1, label: `登录账号`, visible: true},
-  { key: 2, label: `姓名`, visible: true },
+  {key: 2, label: `姓名`, visible: true},
-  { key: 3, label: `部门`, visible: true },
+  {key: 3, label: `部门`, visible: true},
-  { key: 4, label: `手机号码`, visible: true },
+  {key: 4, label: `手机号码`, visible: true},
-  { key: 5, label: `状态`, visible: true },
+  {key: 5, label: `状态`, visible: true},
-  { key: 6, label: `创建时间`, visible: true },
+  {key: 6, label: `创建时间`, visible: true},
 ]);
 
 const data = reactive({
@@ -566,7 +565,7 @@ const data = reactive({
   },
   rules: {
     userName: [
-      { required: true, message: "登录账号不能为空", trigger: "blur" },
+      {required: true, message: "登录账号不能为空", trigger: "blur"},
       {
         min: 2,
         max: 20,
@@ -574,9 +573,9 @@ const data = reactive({
         trigger: "blur",
       },
     ],
-    nickName: [{ required: true, message: "姓名不能为空", trigger: "blur" }],
+    nickName: [{required: true, message: "姓名不能为空", trigger: "blur"}],
     password: [
-      { required: true, message: "登录密码不能为空", trigger: "blur" },
+      {required: true, message: "登录密码不能为空", trigger: "blur"},
       {
         min: 5,
         max: 20,
@@ -601,7 +600,7 @@ const data = reactive({
   },
 });
 
-const { queryParams, form, rules } = toRefs(data);
+const {queryParams, form, rules} = toRefs(data);
 
 /** 通过条件过滤节点  */
 const filterNode = (value, data) => {
@@ -688,7 +687,8 @@ function handleDelete(row) {
         getList();
         proxy.$modal.msgSuccess("删除成功");
       })
-    .catch(() => {});
+      .catch(() => {
+      });
 }
 
 /** 导出按钮操作 */
@@ -748,12 +748,13 @@ function handleResetPwd(row) {
         inputPattern: /^.{5,20}$/,
         inputErrorMessage: "登录密码长度必须介于 5 和 20 之间",
       })
-    .then(({ value }) => {
+      .then(({value}) => {
         resetUserPwd(row.userId, value).then((response) => {
           proxy.$modal.msgSuccess("修改成功，新密码是：" + value);
         });
       })
-    .catch(() => {});
+      .catch(() => {
+      });
 }
 
 /** 选择条数  */
@@ -777,6 +778,7 @@ function importTemplate() {
       `user_template_${new Date().getTime()}.xlsx`
   );
 }
+
 /**文件上传中处理 */
 const handleFileUploadProgress = (event, file, fileList) => {
   upload.isUploading = true;
@@ -791,7 +793,7 @@ const handleFileSuccess = (response, file, fileList) => {
       response.msg +
       "</div>",
       "导入结果",
-    { dangerouslyUseHTMLString: true }
+      {dangerouslyUseHTMLString: true}
   );
   getList();
 };