@yqg/permission 1.3.3 → 1.3.5-alpha.0

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@yqg/permission",
-    "version": "1.3.3",
+    "version": "1.3.5-alpha.0",
     "main": "dist/index.js",
     "module": "dist/index.js",
     "type": "module",

package/src/App.vue

@@ -1,20 +1,24 @@
 <script setup lang="ts">
-import {ref} from 'vue';
+import { ref, reactive } from 'vue';
 import {Button} from 'ant-design-vue';
 
 // 中英印尼菲律宾
 type LocaleType = 'zh-CN' | 'en-US' | 'id-ID' | 'fil-PH';
 
 const color = ref<string>('#1677ff');
-const locale = ref<LocaleType>('zh-CN');
+const locale = ref<LocaleType>('id-ID');
 
-const permissions = ref('CALL_CENTER.DATA_BUSINESS.QUERY,CALL_CENTER.ENTER_ADMIN,CALL_CENTER.USER.QUERY,CALL_CENTER.USER.MANAGE,CALL_CENTER.BUSINESS.QUERY,CALL_CENTER.SKILL_GROUP.QUERY');
+// const permissions = ref('CALL_CENTER.DATA_BUSINESS.QUERY,CALL_CENTER.ENTER_ADMIN,CALL_CENTER.USER.QUERY,CALL_CENTER.USER.MANAGE,CALL_CENTER.BUSINESS.QUERY,CALL_CENTER.SKILL_GROUP.QUERY');
+const permissions = reactive([
+	'yewei0313.REAQS.DEPAWED_ANQ2.QUERY',
+]);
+//05615
 // const permissions = reactive(['CRANE.BUSINESS.QUERY', 'RANE.BUSINESS.CREATE', 'CRANE.BUSINESS.UPDATE', 'CRANE.BUSINESS.DELETE']);
 const changeColor = () => {
 	color.value = color.value === '#f00' ? '#1677ff' : '#f00';
 }
 const changeLocale = () => {
-	locale.value = locale.value === 'zh-CN' ? 'en-US' : 'zh-CN';
+	locale.value = locale.value === 'id-ID' ? 'en-US' : 'id-ID';
 }
 
 </script>
@@ -29,7 +33,7 @@ const changeLocale = () => {
 			<!-- 03541 -->
 			<!-- 02124 -->
 			<!-- 05184 -->
-			<yqg-permission :permissions="permissions" workNumber="05615" :color="color" :locale="locale"
+			<yqg-permission :permissions="permissions" workNumber="03817" :color="color" :locale="locale"
 				@onSuccess="() => {console.log('成功')}">
 			</yqg-permission>
 		</div>

package/src/components/apply-modal.vue

@@ -1,65 +1,66 @@
 <template>
-    <Modal
-        v-model:open="open"
-        width="1100px"
-        :maskClosable="false"
-        :zIndex="zIndex"
-    >
-        <template #footer>
-            <Button @click="open = false" v-show="!isAllChecked && permissionList.length">{{ t('cancel') }}</Button>
-            <Button type="primary" @click="handleOk" :loading="loading">{{ t('submit') }}</Button>
-        </template>
-        <template #title>
-            <span>{{ t('permissionApply') }}</span>
-            <span v-show="isAllChecked && permissionList.length" class="crane-permission-title-tips">{{
-                t('isAllOwnTips') }}</span>
-        </template>
-        <ConfigProvider :getPopupContainer="getPopupContainer">
-            <Form ref="formRef" :model="formState" :labelCol="{ span: 4 }" :wrapperCol="{ span: 19 }">
-                <FormItem :label="t('applyPermission')" name="features"
-                    :rules="[{ required: true, message: t('selectPlaceholder') }]">
-                    <Spin :spinning="spining">
-                        <span v-if="!permissionList.length">
-                            {{ t('noPermissionTips') }}
-                        </span>
-
-                        <Tree checkable :default-expand-all="true" :tree-data="permissionList" :height="200"
-                            :expandedKeys="expandedKeys" :checkedKeys="formState.features" class="crane-permission-tree"
-                            @check="onCheck" @expand="expandedKeys = $event">
-                            <template #title="item: PermissionType">
-                                <div v-if="item.children && item.children.length">
-                                    {{ item.shortName }}
-                                </div>
-                                <PermissionItem
-                                    v-else :checkedKeys="formState.features" :item="item"
-                                    @onChangeTime="onChangeTime" @updateTime="setDefaultTime"
-                                    :validTimeOptions="validTimeOptions" />
-                            </template>
-                        </Tree>
-                        <CategorySelector v-if="categoryList.length" :categoryList="categoryList" ref="categoryRef" />
-                    </Spin>
-                </FormItem>
-                <FormItem name="applyReason" :label="t('applyReason')" :rules="[{
+	<Modal v-model:open="open" width="1100px" :maskClosable="false" :zIndex="zIndex">
+		<template #footer>
+			<Button @click="open = false" v-show="!isAllChecked && permissionList.length">{{ t('cancel') }}</Button>
+			<Button type="primary" @click="handleOk" :loading="loading">{{ t('submit') }}</Button>
+		</template>
+		<template #title>
+			<span>{{ t('permissionApply') }}</span>
+			<span v-show="isAllChecked && permissionList.length" class="crane-permission-title-tips">{{
+				t('isAllOwnTips') }}</span>
+		</template>
+		<ConfigProvider :getPopupContainer="getPopupContainer" prefixCls="yqg-permission" :theme="{
+			token: {
+				colorPrimary: color,
+			}
+		}">
+			<Form ref="formRef" :model="formState" :labelCol="{ span: 4 }" :wrapperCol="{ span: 19 }">
+				<FormItem :label="t('applyPermission')" name="features"
+					:rules="[{ required: true, message: t('selectPlaceholder') }]">
+					<Spin :spinning="spining">
+						<span v-if="!permissionList.length">
+							{{ t('noPermissionTips') }}
+						</span>
+
+						<Tree checkable :default-expand-all="true" :tree-data="permissionList" :height="200"
+							:expandedKeys="expandedKeys" :checkedKeys="formState.features" class="crane-permission-tree"
+							@check="onCheck" @expand="expandedKeys = $event">
+							<template #title="item: PermissionType">
+								<div v-if="item.children && item.children.length">
+									{{ item.shortName }}
+								</div>
+								<PermissionItem v-else :checkedKeys="formState.features" :item="item"
+									@onChangeTime="onChangeTime" @updateTime="setDefaultTime"
+									:validTimeOptions="validTimeOptions" />
+							</template>
+						</Tree>
+						<CategorySelector v-if="categoryList.length" :categoryList="categoryList" ref="categoryRef" />
+					</Spin>
+				</FormItem>
+				<FormItem name="applyReason" :label="t('applyReason')" :rules="[{
                     required: true, message: t('reasonPlaceholder'), trigger: ['change']
                 }, {
                     max: 300, message: t('maxLengthTips', { length: 300 }), trigger: ['change', 'blur']
                 }]">
-                    <Textarea v-model:value.trim="formState.applyReason" :placeholder="t('applyReasonPlaceholder')"
-                        :auto-size="{ minRows: 4, maxRows: 4 }" :disabled="isAllChecked || !permissionList.length">
+					<Textarea v-model:value.trim="formState.applyReason" :placeholder="t('applyReasonPlaceholder')"
+						:auto-size="{ minRows: 4, maxRows: 4 }" :disabled="isAllChecked || !permissionList.length">
             </Textarea>
-                    <span class="reason-tips" style="font-size: 12px">
-                        {{ t('applyReasonTips') }}
-                    </span>
-                </FormItem>
-
-                <FormItem :label="t('approvalProcess')">
-                    <ApprovalSteps :stepNodes="stepNodes" />
-                </FormItem>
-            </Form>
-
-            <SuccessModal ref="successModal" />
-        </ConfigProvider>
-    </Modal>
+					<span class="reason-tips" style="font-size: 12px">
+						{{ t('applyReasonTips') }}
+					</span>
+				</FormItem>
+
+				<FormItem :label="t('approvalProcess')">
+					<ApprovalSteps :stepNodes="stepNodes" />
+				</FormItem>
+
+			</Form>
+
+			<SuccessModal ref="successModal" />
+
+		</ConfigProvider>
+
+	</Modal>
 </template>
 <script lang="ts" setup>
 import {
@@ -124,6 +125,10 @@ const props = defineProps({
 		type: Number,
 		default: 1000
 	},
+	color: {
+		type: String,
+		default: '#1677ff'
+	}
 
 });
 const emit = defineEmits(['onSubmit', 'onSuccess']);

package/src/components/yqg-permission.vue

@@ -1,10 +1,10 @@
 <template>
-	<ConfigProvider prefixCls="yqg-permission" :theme="{
+	<ConfigProvider prefixCls="yqg-permission" :key="locale" :theme="{
 		token: {
-			colorPrimary: props.color,
+			colorPrimary: color,
 		}
 	}">
-		<div class="crane-wraper">
+		<div class="crane-wraper" :key="locale">
 			<template v-if="[COM_TYPE.FLOATBUTTON, COM_TYPE.TEXT].includes(type)">
 				<FloatButton ref="dragElement" type="primary" :tooltip="t('clickToApply')" :style="{
 					right: RIGHT_DEFAULT,
@@ -62,12 +62,12 @@
 			</template>
 		</div>
 
-		<ApplyModal v-model="open" :permissionList="permissionList" :spining="loading" :workNumber="workNumber" :zIndex="zIndex"
-			:defaultCheckedIds="defaultCheckedIds" :isAllChecked="isAllChecked" @onSuccess="() => emit('onSuccess')"
-			@onSubmit="getPermissions">
+		<ApplyModal v-model="open" :permissionList="permissionList" :spining="loading" :workNumber="workNumber"
+			:zIndex="zIndex" :defaultCheckedIds="defaultCheckedIds" :isAllChecked="isAllChecked"
+			@onSuccess="() => emit('onSuccess')" @onSubmit="getPermissions" :color="color">
 		</ApplyModal>
-
 	</ConfigProvider>
+
 </template>
 <script lang="ts" setup>
 import { ref, defineAsyncComponent, computed, watchEffect, watch } from 'vue';
@@ -75,10 +75,11 @@ import { Button, ConfigProvider, Popover, message, FloatButton } from 'ant-desig
 import applyIconUrl from '@/assets/applyicon.png';
 import noauthority from '@/assets/noauthority.png';
 import Http from '../axios/index';
-import t from '../utils';
+import t, { setLocale } from '../utils';
 import useDraggable from '../hooks/useDragable';
 import useStatus from '../hooks/useStatus';
 import useFormat from '../hooks/useFormat';
+import '../style/reset.css';
 
 const STATUS_MAP = {
 	DEFAULT: 'DEFAULT',
@@ -95,7 +96,7 @@ const COM_TYPE = {
 const RIGHT_DEFAULT = '10px';
 
 // 重置 message 类名，避免被全局样式覆盖
-message.config({ prefixCls: 'yqg-permission-message' });
+message.config({ prefixCls : 'yqg-permission-message'});
 
 const ApplyModal = defineAsyncComponent(() => import('./apply-modal.vue'));
 
@@ -112,7 +113,7 @@ const props = defineProps({
 	},
 	locale: {
 		type: String,
-		default: 'zh-CN'
+		default: 'zh'
 	},
 	color: {
 		type: String,
@@ -192,7 +193,7 @@ watchEffect(() => {
 });
 watch(() => props.locale, (cur, pre) => {
 	if (cur === pre) return;
-	localStorage.setItem('permission_locale', props.locale);
+	setLocale(cur);
 }, { immediate: true });
 </script>
 

package/src/i18n/en-US.ts

@@ -1,57 +1,57 @@
 export default {
-    permissionApply: '权限申请',
-    applyPermission: '申请权限',
-    applyReason: '申请理由',
-    approvalProcess: '审批流程',
-    applyReasonPlaceholder: '请尽可能详细说明申请原因和使用场景，不要只填写“工作需要”之类的理由，以免影响你获取权限的审批时间。',
-    applyReasonTips: '示例：由于XX项目需要，需要查看/操作XXXX场景/问题，涉及到XXX权限的使用，因此提交申请！',
-    cancel: '取消',
-    submit: '确定',
-    close: '关闭',
-    viewApprovalDetail: '查看审批详情',
-    applyMore: '继续申请其他权限',
-    successTips: '已提交申请，审批通过后可拥有相关权限',
-    resoultTitle: '操作结果反馈',
-    start: '发起',
-    end: '结束',
-    noNeed: '无需审批',
-    adaptDepartment: '适用部门',
-    noApprovalProcess: '无审批流程',
-    excessTips: '一次最多可申请{number}个权限',
-    unavailableTips: '您暂无权限查看/操作该页面，请点击下方按钮进行申请',
-    appliedTips: '权限已申请，正在{status}...',
-    unapplyTips: '您暂无权限查看/操作该页面，且该页面中没有您可以申请的权限，',
-    callManager: '如有需要请联系系统管理员',
-    manager: '系统管理员',
-    availableTime: '有效期',
-    selectPlaceholder: '请选择权限点',
-    reasonPlaceholder: '请输入申请理由',
-    maxCountTips: '一次最多只可申请{count}个权限',
-    maxLengthTips: '最多{length}个字符',
-    lastDays: '{count}天后到期',
-    taday: '今天到期',
-    clickToApply: '点击申请权限',
-    noPermissionTips: '该菜单下暂无权限点',
-    availiables: {
-        SEVEN_DAYS: '7天',
-        THIRTY_DAYS: '30天',
-        SIXTY_DAYS: '60天',
-        NINETY_DAYS: '90天',
-        FOREVER: '永久有效',
-    },
+    permissionApply: 'Permission Application',
+    applyPermission: 'Apply for Permission',
+    applyReason: 'Application Reason',
+    approvalProcess: 'Approval Process',
+    isAllOwnTips: 'The current page already has permission or is under approval, no need to apply',
+    applyReasonPlaceholder: 'Please describe your reason and usage scenario in detail. Avoid vague explanations like "work needs" to prevent delays in approval.',
+    applyReasonTips: 'Example: Due to requirements of XX project, need to view/operate XXXX scenario/issue, which involves the use of XXX permission, hence submitting this application!',
+    cancel: 'Cancel',
+    submit: 'Confirm',
+    close: 'Close',
+    viewApprovalDetail: 'View Approval Details',
+    applyMore: 'Continue applying for other permissions',
+    successTips: 'Application submitted. Relevant permissions will be granted upon approval.',
+    resoultTitle: 'Operation Result Feedback',
+    start: 'Start',
+    end: 'End',
+    noNeed: 'No Approval Required',
+    adaptDepartment: 'Applicable Department',
+    noApprovalProcess: 'No approval process required',
+    excessTips: 'You can apply for up to {number} permissions at a time',
+    unavailableTips: 'You currently don\'t have permission to view/operate this page. Please click the button below to apply.',
+    appliedTips: 'Permission request submitted, currently {status}...',
+    unapplyTips: 'You don’t have permission to view or operate this page. There are no available permissions to apply for.',
+    callManager: 'If needed, please contact the system administrator',
+    manager: 'System Administrator',
+    availableTime: 'Validity Period',
+    selectPlaceholder: 'Please select permission points',
+    reasonPlaceholder: 'Please enter your reason for applying',
+    pleaseChoose: 'Please select',
+    maxCountTips: 'You can apply for up to {count} permissions at a time',
+    maxLengthTips: 'Up to {length} characters',
+    today: 'Expires today',
+    clickToApply: 'Click to apply for permission',
+    noPermissionTips: 'There are no permission points under this menu, no need to apply',
+    lastDays: '{count} days',
+    categoryTips: 'Your current data scope:',
+    empty: 'None',
+    category: 'Data Permission',
+    categotySelectTips: 'The selected permissions include data scope settings. Please apply for or update the scope based on your actual needs.',
+    categoryChangeTips: 'Please verify whether full access to "{category}" is necessary for your role. Be sure to explain the use case clearly in your application to avoid rejection.',
     levels: {
-        L1: '低',
-        L2: '中',
-        L3: '高',
+        L1: 'Low',
+        L2: 'Medium',
+        L3: 'High',
     },
     status: {
-        PENDING: '审批中',
-        NO: '不可申请',
-        OWNER: '永久拥有',
-        TEMP_OWNER: '临时拥有',
+        PENDING: 'Under review',
+        NO: 'Not applicable for application',
+        OWNER: 'Permanent permission',
+        TEMP_OWNER: 'Temporary permission',
     },
     operationType: {
-        QUERY: '查询',
-        MANAGE: '操作',
+        QUERY: 'Query',
+        MANAGE: 'Action',
     }
-};
+};

package/src/i18n/in-ID.ts

@@ -0,0 +1,57 @@
+export default {
+    permissionApply: 'Aplikasi Izin',
+    applyPermission: 'Ajukan Permohonan Izin',
+    applyReason: 'Alasan Permohonan',
+    approvalProcess: 'Proses Persetujuan',
+    isAllOwnTips: 'Halaman ini sudah memiliki izin atau sedang dalam proses persetujuan, tidak perlu mengajukan permohonan',
+    applyReasonPlaceholder: 'Harap jelaskan alasan dan skenario penggunaan secara detail. Hindari penjelasan yang tidak jelas seperti "kebutuhan kerja" untuk mencegah penundaan persetujuan.',
+    applyReasonTips: 'Contoh: Karena kebutuhan proyek XX, perlu melihat/mengoperasikan skenario/masalah XXXX, yang melibatkan penggunaan izin XXX, oleh karena itu mengajukan permohonan ini!',
+    cancel: 'Batal',
+    submit: 'Konfirmasi',
+    close: 'Tutup',
+    viewApprovalDetail: 'Lihat Detail Persetujuan',
+    applyMore: 'Lanjutkan mengajukan izin lainnya',
+    successTips: 'Permohonan telah diajukan. Izin terkait akan diberikan setelah disetujui.',
+    resoultTitle: 'Umpan Balik Hasil Operasi',
+    start: 'Mulai',
+    end: 'Selesai',
+    noNeed: 'Tidak Perlu Persetujuan',
+    adaptDepartment: 'Departemen yang Berlaku',
+    noApprovalProcess: 'Tidak perlu proses persetujuan',
+    excessTips: 'Anda dapat mengajukan hingga {number} izin sekaligus',
+    unavailableTips: 'Anda saat ini tidak memiliki izin untuk melihat/mengoperasikan halaman ini. Silakan klik tombol di bawah untuk mengajukan permohonan.',
+    appliedTips: 'Permohonan izin telah diajukan, saat ini {status}...',
+    unapplyTips: 'Anda tidak memiliki izin untuk melihat atau mengoperasikan halaman ini. Tidak ada izin yang tersedia untuk diajukan.',
+    callManager: 'Jika diperlukan, silakan hubungi administrator sistem',
+    manager: 'Administrator Sistem',
+    availableTime: 'Masa Berlaku',
+    selectPlaceholder: 'Silakan pilih titik izin',
+    reasonPlaceholder: 'Silakan masukkan alasan permohonan Anda',
+    pleaseChoose: 'Silakan pilih',
+    maxCountTips: 'Anda dapat mengajukan hingga {count} izin sekaligus',
+    maxLengthTips: 'Maksimal {length} karakter',
+    today: 'Kadaluarsa hari ini',
+    clickToApply: 'Klik untuk mengajukan izin',
+    noPermissionTips: 'Tidak ada titik izin di bawah menu ini, tidak perlu mengajukan permohonan',
+    lastDays: '{count} hari',
+    categoryTips: 'Cakupan data Anda saat ini:',
+    empty: 'Tidak ada',
+    category: 'Izin Data',
+    categotySelectTips: 'Izin yang dipilih termasuk pengaturan cakupan data. Silakan ajukan atau perbarui cakupan berdasarkan kebutuhan aktual Anda.',
+    categoryChangeTips: 'Harap verifikasi apakah akses penuh ke "{category}" diperlukan untuk peran Anda. Pastikan untuk menjelaskan kasus penggunaan secara jelas dalam permohonan Anda untuk menghindari penolakan.',
+    levels: {
+        L1: 'Rendah',
+        L2: 'Sedang',
+        L3: 'Tinggi',
+    },
+    status: {
+        PENDING: 'Dalam tinjauan',
+        NO: 'Tidak berlaku untuk aplikasi',
+        OWNER: 'Izin permanen',
+        TEMP_OWNER: 'Izin sementara',
+    },
+    operationType: {
+        QUERY: 'Kueri',
+        MANAGE: 'Aksi',
+    }
+};

package/src/i18n/index.ts

@@ -1,11 +1,14 @@
 import enUS from './en-US';
 import zhCH from './zh-CH';
+// import inID from './in-ID';
 
 const language: {
     [key: string]: any;
 } = {
-    'zh-CN': zhCH,
-    'en-US': enUS,
+    'zh': zhCH,
+    'en': enUS,
+    // 'id': inID,
 };
 
+
 export default language;

package/src/i18n/zh-CH.ts

@@ -39,14 +39,6 @@ export default {
     category: '数据权限',
     categotySelectTips: '上方选中的权限包含数据权限，请根据实际工作需要申请/更改数据范围。',
     categoryChangeTips: '提醒：您选择的数据权限范围较大！请确认实际工作场景是否需要全量「{category}」权限，并在申请理由中写明，避免审批不通过！',
-    availiables: {
-        SEVEN_DAYS: '7天',
-        THIRTY_DAYS: '30天',
-        SIXTY_DAYS: '60天',
-        NINETY_DAYS: '90天',
-        ONE_YEARS: '1年',
-        FOREVER: '永久有效',
-    },
     levels: {
         L1: '低',
         L2: '中',

package/src/style/reset.css

@@ -0,0 +1,3 @@
+.yqg-permission-message {
+	z-index: 10010;
+}

package/src/utils/index.ts

@@ -1,13 +1,15 @@
 import language from '../i18n';
 
+const localkey = 'yqg_permission_sdk_locale';
+
 type optionsType = {
     [key: string]: any;
 };
 const t = (key: string, options?: optionsType) => {
     // key的格式为：'xxx.xxx.xxx'//国际化todo
-	const en = localStorage.getItem('permission_locale') || 'zh-CN';
+	const en = localStorage.getItem(localkey) || 'en';
     const keys = key.split('.');
-    let result = language[en as string] || language['en-US'];
+    let result = language[en as string] || language['en'];
     for (let i = 0; i < keys.length; i++) {
         result = result[keys[i]];
     }
@@ -54,3 +56,15 @@ export const deepTree = (tree: any[], fn: (item:any) => void) => {
 }
 
 export default t;
+
+export const setLocale = (locale: string) => {
+	let finalLocale = '';
+	if (locale.startsWith('zh')) {
+		finalLocale = 'zh';
+	} else if (locale.startsWith('en')) {
+		finalLocale = 'en';
+	} else if (locale.startsWith('id') || locale.startsWith('in')) {
+		finalLocale = 'id';
+	}
+	localStorage.setItem(localkey, finalLocale);
+}