From 999f9a47da7783388d0214b9f8d987ea2d9f2916 Mon Sep 17 00:00:00 2001 From: heyujie <516346543@qq.com> Date: 星期一, 11 四月 2022 13:55:05 +0800 Subject: [PATCH] 子账户管理新 --- src/views/personalCenter/components/BasicInfo.vue | 374 +++++++++++++++++------------------------------------ 1 files changed, 120 insertions(+), 254 deletions(-) diff --git a/src/views/personalCenter/components/BasicInfo.vue b/src/views/personalCenter/components/BasicInfo.vue index 934021f..bd41987 100644 --- a/src/views/personalCenter/components/BasicInfo.vue +++ b/src/views/personalCenter/components/BasicInfo.vue @@ -1,9 +1,9 @@ <template> <div class="basic-info"> - <div class="head-name">瀛愯处鎴风鐞�</div> + <div class="head-name">鍩烘湰璧勬枡</div> <el-form - :model="ruleForm" + :model="userInfo" :rules="rules" :label-position="'left'" ref="ruleForm" @@ -11,60 +11,59 @@ class="add-ruleForm" > <div class="area-title">鍩烘湰淇℃伅</div> - <el-form-item label="鐢ㄦ埛鍚�" prop="name"> - <el-input v-model="ruleForm.name" style="width: 200px"></el-input> + <el-form-item label="鐢ㄦ埛鍚�" prop="username"> + <el-input v-model="userInfo.username" style="width: 200px"></el-input> </el-form-item> <el-form-item label="娉ㄥ唽绫诲瀷" prop="type"> - <el-radio v-model="ruleForm.type" label="1">涓汉</el-radio> - <el-radio v-model="ruleForm.type" label="2">鍏徃</el-radio> + <el-radio-group v-model="userInfo.userType"> + <el-radio :label="1">涓汉</el-radio> + <el-radio :label="2">鍏徃</el-radio> + </el-radio-group> </el-form-item> - <el-form-item label="濮撳悕" prop="name"> - <el-input v-model="ruleForm.name" style="width: 200px"></el-input> + <el-form-item label="濮撳悕" prop="trueName"> + <el-input v-model="userInfo.trueName" style="width: 200px"></el-input> </el-form-item> - <div class="area-title" style="margin-top: 60px">涓氬姟淇℃伅</div> + <div class="area-title" style="margin-top: 50px">涓氬姟淇℃伅</div> - <el-form-item label="琛屼笟搴旂敤" prop="region"> + <el-form-item label="琛屼笟搴旂敤" prop="industryId"> <el-select - v-model="ruleForm.region" - placeholder="璇烽�夋嫨琛屼笟搴旂敤" + v-model="userInfo.industryId" + placeholder="琛屼笟" style="width: 410px" > - <el-option label="鍖哄煙涓�" value="shanghai"></el-option> - <el-option label="鍖哄煙浜�" value="beijing"></el-option> + <el-option + v-for="(item, index) in industrys" + :label="item.name" + :value="item.id" + :key="index" + ></el-option> </el-select> </el-form-item> - <el-form-item label="鍏徃鍚嶇О" prop="region"> - <el-input v-model="ruleForm.name" style="width: 410px"></el-input> + <el-form-item label="鍏徃鍚嶇О" prop="companyName"> + <el-input + v-model="userInfo.companyName" + style="width: 410px" + ></el-input> </el-form-item> - <div class="area-title" style="margin-top: 60px">鑱旂郴淇℃伅</div> + <div class="area-title" style="margin-top: 50px">鑱旂郴淇℃伅</div> - <el-form-item label="鎵�鍦ㄥ湴鍖�" prop="region"> - <el-select - v-model="ruleForm.region" - placeholder="璇烽�夋嫨鍩庡競" - style="width: 200px; margin-right: 10px" - > - <el-option label="鍖哄煙涓�" value="shanghai"></el-option> - <el-option label="鍖哄煙浜�" value="beijing"></el-option> - </el-select> - <el-select - v-model="ruleForm.region" - placeholder="璇烽�夋嫨鍖�" - style="width: 200px" - > - <el-option label="鍖哄煙涓�" value="shanghai"></el-option> - <el-option label="鍖哄煙浜�" value="beijing"></el-option> - </el-select> + <el-form-item label="鎵�鍦ㄥ湴鍖�" prop="areaId"> + <el-cascader + v-model="userInfo.address" + :props="options" + style="width: 410px" + @change="handleChange" + ></el-cascader> </el-form-item> - <el-form-item label="鎵嬫満鍙�" prop="name"> - <el-input v-model="ruleForm.name" style="width: 200px"></el-input> + <el-form-item label="鎵嬫満鍙�" prop="phoneNum"> + <el-input v-model="userInfo.phoneNum" style="width: 200px"></el-input> </el-form-item> - <el-form-item label="閭" prop="name"> - <el-input v-model="ruleForm.password" style="width: 410px"></el-input> + <el-form-item label="閭" prop="email"> + <el-input v-model="userInfo.email" style="width: 410px"></el-input> </el-form-item> </el-form> <div class="btns"> @@ -74,6 +73,8 @@ </template> <script> +import { getUserInfo, getAreas, getDic, entireUserInfo } from "@/api/login"; + export default { components: {}, data() { @@ -85,23 +86,50 @@ page: 1, size: 10, //鍒嗛〉鐩稿叧 inputText: "", //杈撳叆妗嗗唴瀹� - activeStep: 0, + industrys: [], activeIndex: 0, total: 0, //鎬绘暟 - dataList: [ - { - name: "basic", - phone: "1121313232", - userType: "涓汉", - duration: "姘镐箙", - authList: "闆嗙兢1锛岄泦缇�2", - isBind: 1, - }, - ], isShowAdd: false, //鏄惁灞曠ず鏂板寮圭獥 isShowUnbind: false, //鏄惁灞曠ず瑙g粦寮圭獥 isShowRelate: false, unbindId: "", + options: { + lazy: true, + lazyLoad(node, resolve) { + // 鎳掑姞杞借妭鐐圭渷甯傛暟鎹� + const { level } = node; + let nodes; + console.log("鑺傜偣锛�", level, node); + getAreas({ parentId: level == 0 ? 0 : node.value }) + .then((json) => { + nodes = json.data.list; + nodes = nodes.map((item) => ({ + value: item.id, + label: item.name, + level: item.level, + leaf: level >= 1, + })); + resolve(nodes); + }) + .catch((err) => { + console.log(err); + }); + }, + }, + userInfo: { + userId: "", + username: "panlei", + phoneNum: "17610829559", + type: "", // 鏅�氱敤鎴疯繕鏄紑鍙戣�� + userType: 1, // 涓汉杩樻槸鍏徃 + industryId: "", + address: [110100, 110105], + areaId: "", + provinceId: "", + trueName: "", + companyName: "", + email: "", + }, durationArr: [ { value: 0, @@ -116,165 +144,19 @@ showQuit: false, //灞曠ず閫�鍑洪泦缇ょ殑寮圭獥 showJoin: false, //灞曠ず鍔犲叆闆嗙兢鐨勫脊绐� activeEquipment: null, //澶勭悊涓殑璁惧 - ruleForm: { - name: "", - region: "", - password: "", - date1: "", - date2: "", - delivery: false, - type: [], - resource: "", - desc: "", - authList: { - menuAuth: [], - dataAuth: [], - }, - }, rules: { - name: [ - { required: true, message: "璇疯緭鍏ユ椿鍔ㄥ悕绉�", trigger: "blur" }, - { min: 3, max: 5, message: "闀垮害鍦� 3 鍒� 5 涓瓧绗�", trigger: "blur" }, + trueName: [ + { required: true, message: "璇峰~鍐欑湡瀹炲鍚�", trigger: "change" }, ], - region: [ - { required: true, message: "璇烽�夋嫨娲诲姩鍖哄煙", trigger: "change" }, + username: [ + { required: true, message: "璇峰~鍐欑敤鎴峰悕", trigger: "change" }, ], - date1: [ - { - type: "date", - required: true, - message: "璇烽�夋嫨鏃ユ湡", - trigger: "change", - }, - ], - date2: [ - { - type: "date", - required: true, - message: "璇烽�夋嫨鏃堕棿", - trigger: "change", - }, + phoneNum: [ + { required: true, message: "璇峰~鍐欐墜鏈哄彿", trigger: "change" }, ], type: [ - { - type: "array", - required: true, - message: "璇疯嚦灏戦�夋嫨涓�涓椿鍔ㄦ�ц川", - trigger: "change", - }, + { required: true, message: "璇烽�夋嫨娉ㄥ唽绫诲瀷", trigger: "change" }, ], - resource: [ - { required: true, message: "璇烽�夋嫨娲诲姩璧勬簮", trigger: "change" }, - ], - desc: [{ required: true, message: "璇峰~鍐欐椿鍔ㄥ舰寮�", trigger: "blur" }], - }, - data1: [ - { - id: 1, - label: "涓�绾� 1", - children: [ - { - id: 4, - label: "浜岀骇 1-1", - children: [ - { - id: 9, - label: "涓夌骇 1-1-1", - }, - { - id: 10, - label: "涓夌骇 1-1-2", - }, - ], - }, - ], - }, - { - id: 2, - label: "涓�绾� 2", - children: [ - { - id: 5, - label: "浜岀骇 2-1", - }, - { - id: 6, - label: "浜岀骇 2-2", - }, - ], - }, - { - id: 3, - label: "涓�绾� 3", - children: [ - { - id: 7, - label: "浜岀骇 3-1", - }, - { - id: 8, - label: "浜岀骇 3-2", - }, - ], - }, - ], - defaultProps1: { - children: "children", - label: "label", - }, - data2: [ - { - id: 1, - label: "涓�绾� 1", - children: [ - { - id: 4, - label: "浜岀骇 1-1", - children: [ - { - id: 9, - label: "涓夌骇 1-1-1", - }, - { - id: 10, - label: "涓夌骇 1-1-2", - }, - ], - }, - ], - }, - { - id: 2, - label: "涓�绾� 2", - children: [ - { - id: 5, - label: "浜岀骇 2-1", - }, - { - id: 6, - label: "浜岀骇 2-2", - }, - ], - }, - { - id: 3, - label: "涓�绾� 3", - children: [ - { - id: 7, - label: "浜岀骇 3-1", - }, - { - id: 8, - label: "浜岀骇 3-2", - }, - ], - }, - ], - defaultProps2: { - children: "children", - label: "label", }, }; }, @@ -286,8 +168,27 @@ goto(i) { this.activeIndex = i; }, - save(){ - + async getIndustrys() { + let res = await getDic(); + if (res.success) { + this.industrys = res.data.dics; + } else { + console.log("鏌ヨ琛屼笟鍒楄〃澶辫触锛�"); + } + }, + save() { + this.userInfo.provinceId = this.userInfo.address[0]; + this.userInfo.areaId = this.userInfo.address[1]; + entireUserInfo(this.userInfo) + .then((res) => { + this.$notify.success("璐︽埛淇℃伅淇濆瓨鎴愬姛"); + }) + .catch((err) => { + if (err && err.status == 401) { + return; + } + this.$notify.error("璐︽埛淇℃伅淇濆瓨澶辫触"); + }); }, // 璺冲埌璁惧璇︽儏 checkDetail(row) { @@ -313,35 +214,6 @@ }, }); }, - - // 鏌ヨ鍒楄〃 - // searchingBtn() { - // let param = { - // page: this.page, - // size: this.size, - // // startTime: this.searchTime[0], - // // endTime: this.searchTime[1], - // inputText: this.inputText, - // }; - // findDevList(param) - // .then((res) => { - // this.dataList = res.data.list; - // //鏃堕棿鍒嗚鏄剧ず - - // this.dataList.forEach((item) => { - // item.installTime = item.installTime.split(" "); - // item.firstUseTime = item.firstUseTime.split(" "); - // }); - // this.total = res.data.total; - // if (res.data.total <= this.size) { - // this.page = 1; - // } - // }) - // .catch((err) => { - // console.log(err); - // }); - // }, - //鍒嗛〉鍔熻兘 handleSizeChange(size) { this.size = size; @@ -408,6 +280,13 @@ }, }, mounted() {}, + created() { + getUserInfo().then((res) => { + this.userInfo = res.data; + this.userInfo.address = [this.userInfo.provinceId, this.userInfo.areaId]; + }); + this.getIndustrys(); + }, }; </script> @@ -424,6 +303,10 @@ margin-bottom: 30px; } .add-ruleForm::v-deep { + .el-form-item__label { + font-size: 14px; + color: #999999; + } .area-title { font-weight: 700; color: #666666; @@ -439,31 +322,14 @@ height: 32px; line-height: 32px; } - .user-tree { - .el-form-item__content { - display: flex; - .tree-box { - .t { - height: 32px; - background: #f0f5fa; - border-radius: 3px 3px 0px 0px; - line-height: 32px; - text-align: center; - border-bottom: 1px solid #c0c5cc; - } - width: 336px; - height: 480px; - border: 1px solid #c0c5cc; - margin-right: 20px; - box-sizing: border-box; - } - } - } } .searchBtn { - width: 80px;margin-top: 38px; + width: 80px; + margin-top: 50px; height: 40px; line-height: 40px; + border-radius: 3px; + cursor: pointer; text-align: center; color: #fff; background: #0065ff; -- Gitblit v1.8.0