From 2063c7f98867bf696bc0d1e9c6a069844d61528a Mon Sep 17 00:00:00 2001
From: zxl <763096477@qq.com>
Date: 星期五, 20 六月 2025 09:17:08 +0800
Subject: [PATCH] 导入组件代码清理
---
pages/userPermissions/addStoreMember.vue | 277 ++++++++++++++++++++++++++++++++++++++++---------------
1 files changed, 201 insertions(+), 76 deletions(-)
diff --git a/pages/userPermissions/addStoreMember.vue b/pages/userPermissions/addStoreMember.vue
index 265e0fc..4bb8e45 100644
--- a/pages/userPermissions/addStoreMember.vue
+++ b/pages/userPermissions/addStoreMember.vue
@@ -3,7 +3,7 @@
<u-navbar :is-back="true" :title="title" title-color="#333" back-icon-color="#333"></u-navbar>
<!-- 琛ㄥ崟鍖哄煙 -->
<view class="form-card">
- <u-form :model="form" ref="uForm1" label-width="150rpx">
+ <u-form :model="form" ref="uForm1" label-width="150rpx" :rules="rules">
<!-- 鐪熷疄濮撳悕 -->
<u-form-item label="鐪熷疄濮撳悕" prop="realName" borderBottom required="true">
@@ -14,30 +14,31 @@
<u-form-item label="鐢佃瘽" prop="mobile" borderBottom required="true">
<u-input v-model="form.mobile" placeholder="璇疯緭鍏ユ墜鏈哄彿鐮�" border="none" type="number" />
</u-form-item>
- <!-- 鏃у瘑鐮� -->
- <u-form-item label="鏃у瘑鐮�" prop="password" borderBottom required="true" v-if="false">
- <u-input v-model="form.oldPassword" placeholder="璇疯緭鍏ュ瘑鐮�" border="none" type="password" />
- </u-form-item>
<!-- 瀵嗙爜 -->
- <u-form-item label="鏂板瘑鐮�" prop="password" borderBottom required="true">
+ <u-form-item label="瀵嗙爜" prop="password" borderBottom required="true" v-if="!form.id">
<u-input v-model="form.password" placeholder="璇疯緭鍏ュ瘑鐮�" border="none" type="password" />
</u-form-item>
- <!-- 瑙掕壊閫夋嫨 -->
- <u-form-item label="瑙掕壊" prop="role" borderBottom required="true">
- <!-- 澶嶉�夋缁勶紝澧炲姞甯冨眬鍜岄棿璺� -->
+ <u-form-item label="瓒呯骇绠＄悊鍛�" prop="isSuper" borderBottom required="true">
+ <view class="switch-wrapper">
+ <u-switch v-model="form.isSuper"></u-switch>
+ </view>
+ </u-form-item>
+ <u-form-item label="瑙掕壊" prop="role" v-if="!form.isSuper">
<u-checkbox-group @change="checkboxGroupChange" class="checkbox-group">
- <u-checkbox @change="checkboxChange" v-model="item.checked" v-for="(item, index) in list"
- :key="index" :name="item.name" class="custom-checkbox">
+ <u-checkbox @change="checkboxChange" v-model="item.checked" v-for="(item, index) in roleList"
+ :key="index" :name="item.id" class="custom-checkbox">
<span class="checkbox-label">{{ item.name }}</span>
</u-checkbox>
-
</u-checkbox-group>
- <!-- 鍏ㄩ�夋寜閽紝澧炲姞闂磋窛鍜屾牱寮� -->
- <!-- <u-button type="text" @click="checkedAll" class="select-all-btn">
- 鍏ㄩ��
- </u-button> -->
</u-form-item>
+ <u-form-item label="鎵�灞為儴闂�" prop="departmentId" borderBottom>
+ </u-form-item>
+ <DaTreeVue2 :data="roomTreeData" labelField="name" valueField="id" defaultExpandAll
+ :defaultCheckedKeys="defaultCheckedKeysValue" @change="handleTreeChange"
+ @expand="handleExpandChange" />
+ <!-- 瑙掕壊閫夋嫨 -->
+
</u-form>
@@ -53,68 +54,79 @@
import {
add,
update,
- getDetail
+ getDetail,
+ getStoreRoleList,
+ getDeptTree,
+ check
} from "@/api/userPermissions.js"
- import UIcon from '@/uview-components/uview-ui/components/u-icon/u-icon.vue';
- import UButton from '@/uview-components/uview-ui/components/u-button/u-button.vue';
- import UForm from '@/uview-components/uview-ui/components/u-form/u-form.vue';
- import UFormItem from '@/uview-components/uview-ui/components/u-form-item/u-form-item.vue';
- import UInput from '@/uview-components/uview-ui/components/u-input/u-input.vue';
- import USearch from '@/uview-components/uview-ui/components/u-search/u-search.vue';
- import UPopup from '@/uview-components/uview-ui/components/u-popup/u-popup.vue';
- import ULoading from '@/uview-components/uview-ui/components/u-loading/u-loading.vue';
+ import '@/components/uview-components/uview-ui';
- import UCheckbox from '@/uview-components/uview-ui/components/u-checkbox/u-checkbox.vue';
- import UCheckboxGroup from '@/uview-components/uview-ui/components/u-checkbox-group/u-checkbox-group.vue';
+ import DaTreeVue2 from '@/components/da-tree-vue2/index.vue'
export default {
components: {
- UIcon,
- UButton,
- UForm,
- UFormItem,
- UInput,
- USearch,
- UPopup,
- ULoading,
- UCheckbox,
- UCheckboxGroup
+ DaTreeVue2,
},
data() {
return {
+ checking: false, // 妫�鏌ョ姸鎬�
+ lastRequest: null, // 鏈�鍚庝竴娆¤姹傜殑鏍囪瘑锛堢敤浜庨槻鎶栵級
+
+ rules: {
+ realName: {
+ required: true,
+ trigger: ['blur'],
+ message: '濮撳悕涓嶈兘涓虹┖'
+
+ },
+ mobile: [{
+ required: true,
+ trigger: ['blur'],
+ message: '鐢佃瘽鍙风爜涓嶈兘涓虹┖'
+ },
+ {
+ pattern: /^1[3-9]\d{9}$/,
+ message: "鎵嬫満鍙锋牸寮忎笉姝ｇ‘锛堝繀椤绘槸11浣嶄腑鍥藉ぇ闄嗘墜鏈哄彿锛�",
+ trigger: ["blur"]
+ },
+ {
+ validator: this.checkPhoneUsage,
+ trigger: ['blur']
+ }
+ ],
+
+
+ password: {
+ required: true,
+ trigger: ['blur', 'change'],
+ message: '瀵嗙爜涓嶈兘涓虹┖'
+
+ },
+ },
+ defaultCheckedKeysValue: '',
title: '',
// 琛ㄥ崟鏁版嵁
form: {
- id: '',
+ id: '',//灞炰簬搴楀憳琛╥d
mobile: '',
realName: '',
password: '',
- role: '',
- oldPassword: ''
+ role: [],
+ isSuper: true,
+ departmentId: ''
},
+ memberId:'',
- role: [],
// 鍔犺浇鐘舵��
loading: false,
// 瑙掕壊閫夐」
- list: [{
- name: '绠＄悊鍛�',
- checked: false,
- disabled: false
- },
- {
- name: '绠＄悊鍛�2',
- checked: false,
- disabled: false
- },
- {
- name: '绠＄悊鍛�3',
- checked: false,
- disabled: false
- }
- ],
-
+ roleList: [],
+ roomTreeData: [],
};
+ },
+ onReady() {
+ //onReady 涓簎ni-app鏀寔鐨勭敓鍛藉懆鏈熶箣涓�
+
},
onLoad(options) {
// 鎺ユ敹 URL 鍙傛暟
@@ -126,8 +138,108 @@
} else {
this.title = '鏂板鐢ㄦ埛';
}
+ this.getRole()
+ this.getDeptTree()
+ setTimeout(() => {
+ this.$refs.uForm1.setRules(this.rules)
+ }, 500)
},
methods: {
+ // 鑷畾涔夊紓姝ラ獙璇佹柟娉�
+ checkPhoneUsage(rule, value, callback) {
+ if (!value || !/^1[3-9]\d{9}$/.test(value)) {
+ return callback() // 鏍煎紡閿欒鏃惰烦杩囨帴鍙ｆ鏌�
+ }
+
+ this.checking = true
+ const currentRequest = Symbol() // 鐢熸垚鍞竴鏍囪瘑
+ this.lastRequest = currentRequest
+
+ // 璋冪敤API妫�鏌ユ墜鏈哄彿锛堢ず渚嬩娇鐢╱ni.request锛�
+ const form ={
+ mobile:value,
+ memberId:this.memberId
+ }
+ check(form)
+ .then(res => {
+ // 3.1 濡傛灉涓嶆槸鏈�鍚庝竴娆¤姹傦紝蹇界暐缁撴灉
+ if (this.lastRequest !== currentRequest) return;
+ console.log(res)
+ // 3.2 鏍规嵁涓氬姟閫昏緫鍒ゆ柇鏄惁鍙敤
+ if (res.statusCode === 200) {
+ //鍒ゆ柇鏄惁宸插瓨鍦�
+ callback(); // 楠岃瘉閫氳繃
+ } else {
+ callback(new Error(res.message || '璇ユ墜鏈哄彿宸茶浣跨敤'));
+ }
+ })
+ .catch(err => {
+ // 3.3 缃戠粶閿欒澶勭悊
+ callback(new Error('楠岃瘉澶辫触锛岃绋嶅悗閲嶈瘯'));
+ })
+ .finally(() => {
+ // 3.4 鏃犺鎴愬姛澶辫触閮藉彇娑堝姞杞界姸鎬�
+ if (this.lastRequest === currentRequest) {
+ this.checking = false;
+ }
+ });
+
+ },
+ change(e) {
+ console.log('change', e);
+ },
+ //杞崲鏍戠姸缁撴瀯
+ renameTitleToName(treeData) {
+ return treeData.map(item => {
+ const newItem = {
+ ...item,
+ name: item.title // 灏唗itle璧嬪�肩粰name
+ }
+ delete newItem.title // 鍒犻櫎鍘焧itle瀛楁
+
+ if (item.children && item.children.length > 0) {
+ newItem.children = this.renameTitleToName(item.children)
+ }
+
+ return newItem
+ })
+ },
+
+ getDeptTree() {
+ getDeptTree().then(res => {
+ if (res.statusCode === 200) {
+ console.log(res.data.data)
+ this.roomTreeData = this.renameTitleToName(res.data.data)
+ }
+ })
+ console.log(this.roomTreeData)
+ },
+ doExpandTree(keys, expand) {
+ this.$refs.DaTreeRef?.setExpandedKeys(keys, expand)
+
+ const gek = this.$refs.DaTreeRef?.getExpandedKeys()
+ console.log('褰撳墠宸插睍寮�鐨凨EY ==>', gek)
+ },
+ doCheckedTree(keys, checked) {
+ this.$refs.DaTreeRef?.setCheckedKeys(keys, checked)
+
+ const gek = this.$refs.DaTreeRef?.getCheckedKeys()
+ console.log('褰撳墠宸查�変腑鐨凨EY ==>', gek)
+ },
+ handleTreeChange(allSelectedKeys, currentItem) {
+ console.log('handleTreeChange ==>', allSelectedKeys, currentItem)
+ this.form.departmentId = allSelectedKeys
+ },
+ handleExpandChange(expand, currentItem) {
+ console.log('handleExpandChange ==>', expand, currentItem)
+ },
+ getRole() {
+ getStoreRoleList().then(res => {
+ if (res.statusCode === 200) {
+ this.roleList = res.data.data
+ }
+ })
+ },
//鑾峰緱璇︽儏
getDetail() {
uni.showLoading({
@@ -138,29 +250,31 @@
if (res.statusCode === 200) {
this.form.mobile = res.data.data.mobile;
this.form.realName = res.data.data.realName;
- this.form.password = res.data.data.password;
+ this.form.isSuper = res.data.data.isSuper;
+ this.defaultCheckedKeysValue = res.data.data.departmentId;
+ this.memberId = res.data.data.memberId
// 瑙ｆ瀽瑙掕壊鏁扮粍
- const roles = JSON.parse(res.data.data.role);
+ const roles = res.data.data.roleIds.split(',');
// 鏇存柊澶嶉�夋閫変腑鐘舵��
- this.list = this.list.map(item => {
+ this.roleList = this.roleList.map(item => {
return {
...item,
- checked: roles.includes(item.name)
+ checked: roles.includes(item.id)
};
});
-
-
this.form.role = roles;
}
+
})
},
// 瑙掕壊閫夋嫨鍙樺寲
checkboxChange(e) {
- // console.log(e);
+ console.log(e);
},
checkboxGroupChange(e) {
- this.role = e;
+ console.log(e)
+ this.form.role = e;
},
// 鍏ㄩ��
checkedAll() {
@@ -172,14 +286,23 @@
async submitForm() {
// 1. 鎵嬪姩瑙﹀彂琛ㄥ崟楠岃瘉
this.$refs.uForm1.validate(valid => {
+
if (valid) {
this.loading = true;
// 2. 澶勭悊瑙掕壊鏁版嵁锛堝皢 checked=true 鐨勯」杞负 role 鏁扮粍锛�
+ const form = {
- this.form.role = JSON.stringify(this.role);
- console.log(this.form)
- if (this.form.id) {
- update(this.form).then(res => {
+ id: this.form.id,
+ mobile: this.form.mobile,
+ realName: this.form.realName,
+ password: this.form.password,
+ role: this.form.role,
+ isSuper:this.form.isSuper,
+ departmentId:this.form.departmentId,
+ }
+
+ if (form.id) {
+ update(form).then(res => {
this.loading = false;
if (res.statusCode === 200) {
uni.showToast({
@@ -192,7 +315,7 @@
}
})
} else {
- add(this.form).then(res => {
+ add(form).then(res => {
this.loading = false;
if (res.statusCode === 200) {
uni.showToast({
@@ -218,12 +341,14 @@
<style lang="scss" scoped>
.checkbox-group {
- display: flex;
- flex-wrap: wrap;
gap: 16px;
- /* 閫夐」闂磋窛 */
- margin-bottom: 16px;
- /* 涓庢寜閽殑闂磋窛 */
+
+ }
+
+ .switch-wrapper {
+ display: flex;
+ justify-content: flex-start;
+ width: 100%;
}
/* 鍗曚釜澶嶉�夋鏍峰紡 */
--
Gitblit v1.8.0