fix: 解决批量修改文件权限错误的问题 (#2799)

frontend/src/components/file-role/index.vue

@@ -1,6 +1,6 @@
 <template>
     <div>
-        <el-form ref="ruleForm" label-position="left" :model="form" label-width="100px">
+        <el-form ref="ruleForm" label-position="left" :model="form" label-width="100px" :rules="rules">
             <el-form-item :label="$t('file.owner')">
                 <el-checkbox v-model="form.owner.r" :label="$t('file.rRole')" />
                 <el-checkbox v-model="form.owner.w" :label="$t('file.wRole')" />
@@ -16,15 +16,16 @@
                 <el-checkbox v-model="form.public.w" :label="$t('file.wRole')" />
                 <el-checkbox v-model="form.public.x" :label="$t('file.xRole')" />
             </el-form-item>
-            <el-form-item :label="$t('file.role')" required>
+            <el-form-item :label="$t('file.role')" required prop="mode">
                 <el-input v-model="form.mode" maxlength="4" @input="changeMode"></el-input>
             </el-form-item>
         </el-form>
     </div>
 </template>
 <script setup lang="ts">
-import { FormInstance } from 'element-plus';
+import { FormInstance, FormRules } from 'element-plus';
-import { computed, ref, toRefs, watch, onUpdated, onMounted } from 'vue';
+import { computed, ref, toRefs, watch, onUpdated, onMounted, reactive } from 'vue';
+import { Rules } from '@/global/form-rules';
 
 interface Role {
     r: boolean;
@@ -46,6 +47,9 @@ const roles = ref<string[]>(['0', '1', '2', '3', '4', '5', '6', '7']);
 const props = withDefaults(defineProps<Props>(), {
     mode: '0755',
 });
+const rules = reactive<FormRules>({
+    mode: [Rules.requiredInput, Rules.filePermission],
+});
 
 const { mode } = toRefs(props);
 const ruleForm = ref<FormInstance>();

frontend/src/global/form-rules.ts

@@ -461,6 +461,19 @@ const checkParamSimple = (rule: any, value: any, callback: any) => {
     }
 };
 
+const checkFilePermission = (rule, value, callback) => {
+    if (value === '' || typeof value === 'undefined' || value == null) {
+        callback(new Error(i18n.global.t('commons.rule.filePermission')));
+    } else {
+        const regFilePermission = /^[0-7]{3,4}$/;
+        if (!regFilePermission.test(value)) {
+            callback(new Error(i18n.global.t('commons.rule.filePermission')));
+        } else {
+            callback();
+        }
+    }
+};
+
 interface CommonRule {
     requiredInput: FormItemRule;
     requiredSelect: FormItemRule;
@@ -493,6 +506,7 @@ interface CommonRule {
     disabledFunctions: FormItemRule;
     leechExts: FormItemRule;
     domainWithPort: FormItemRule;
+    filePermission: FormItemRule;
 
     paramCommon: FormItemRule;
     paramComplexity: FormItemRule;
@@ -692,4 +706,9 @@ export const Rules: CommonRule = {
         validator: checkDomainWithPort,
         trigger: 'blur',
     },
+    filePermission: {
+        required: true,
+        validator: checkFilePermission,
+        trigger: 'blur',
+    },
 };

frontend/src/lang/modules/en.ts

@@ -189,6 +189,7 @@ const message = {
             disableFunction: 'Only support letters ,underscores,and,',
             leechExts: 'Only support letters, numbers and,',
             paramSimple: 'Support lowercase letters and numbers, length 1-128',
+            filePermission: 'File Permission Error',
         },
         res: {
             paramError: 'The request failed, please try again later!',

frontend/src/lang/modules/tw.ts

@@ -188,6 +188,7 @@ const message = {
             disableFunction: '僅支持字母、下劃線和,',
             leechExts: '僅支持字母數字和,',
             paramSimple: '支持小寫字母和數字,長度 1-128',
+            filePermission: '權限錯誤',
         },
         res: {
             paramError: '請求失敗,請稍後重試!',

frontend/src/lang/modules/zh.ts

@@ -188,6 +188,7 @@ const message = {
             disableFunction: '仅支持字母、下划线和,',
             leechExts: '仅支持字母数字和,',
             paramSimple: '支持小写字母和数字,长度1-128',
+            filePermission: '权限错误',
         },
         res: {
             paramError: '请求失败,请稍后重试!',

frontend/src/views/host/file-management/batch-role/index.vue

@@ -5,16 +5,9 @@
         </template>
 
         <el-row>
-            <el-col :span="22" :offset="1">
+            <el-col :span="22" :offset="1" v-loading="loading">
-                <FileRole v-loading="loading" :mode="mode" @get-mode="getMode"></FileRole>
+                <FileRole :mode="mode" @get-mode="getMode"></FileRole>
-                <el-form
+                <el-form ref="fileForm" label-position="left" :model="addForm" label-width="100px" :rules="rules">
-                    ref="fileForm"
-                    label-position="left"
-                    :model="addForm"
-                    label-width="100px"
-                    :rules="rules"
-                    v-loading="loading"
-                >
                     <el-form-item :label="$t('commons.table.user')" prop="user">
                         <el-input v-model.trim="addForm.user" />
                     </el-form-item>
@@ -76,6 +69,7 @@ const addForm = reactive({
 });
 
 const acceptParams = (props: BatchRoleProps) => {
+    addForm.paths = [];
     files.value = props.files;
     files.value.forEach((file) => {
         addForm.paths.push(file.path);
@@ -94,7 +88,12 @@ const getMode = (val: number) => {
 };
 
 const submit = async () => {
+    const regFilePermission = /^[0-7]{3,4}$/;
+    if (!regFilePermission.test(addForm.mode.toString(8))) {
+        return;
+    }
     loading.value = true;
+
     BatchChangeRole(addForm)
         .then(() => {
             MsgSuccess(i18n.global.t('commons.msg.updateSuccess'));