From c5a0ff2661fe362dddbe88c6a28d19c48c24c39b Mon Sep 17 00:00:00 2001 From: jiangping <jp@doumee.com> Date: 星期一, 21 十月 2024 20:39:32 +0800 Subject: [PATCH] 最新版本541200007 --- admin/src/components/common/CommonHeader.vue | 151 ++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 122 insertions(+), 29 deletions(-) diff --git a/admin/src/components/common/CommonHeader.vue b/admin/src/components/common/CommonHeader.vue index 10523a8..4d0bd3f 100644 --- a/admin/src/components/common/CommonHeader.vue +++ b/admin/src/components/common/CommonHeader.vue @@ -2,14 +2,26 @@ <div class="common-header"> <div class="header"> <div class="logo"> - <div>{{title}}</div> + <div class="title">{{ title }}</div> + <div class="list"> + <div class="item active"> + <div>鏈嶅姟涓績</div> + <div class="linellae"></div> + </div> + <div class="item" @click="getHeaderNav('0')">瀹夐槻涓績</div> + <div class="item" @click="getHeaderNav('1')">娑堟帶涓績</div> + <div class="item" @click="getHeaderNav('2')">鑳界涓績</div> + <div class="item" @click="getHeaderNav('3')">椹鹃┒鑸�</div> + </div> <!-- <div class="title-en">Diagnosis of Intelligent Manufacturing Integrated Service Platfrom</div> --> </div> <div class="user"> <el-dropdown v-if="isLogined" trigger="click"> <span class="el-dropdown-link"> <!-- <img v-if="userInfo != null" :src="userInfo.avatar == null ? `${require('@/assets/avatar/man.png')}` : userInfo.avatar" alt="">{{userInfo | displayName}}<i class="el-icon-arrow-down el-icon--right"></i> --> - <img v-if="userInfo != null" style="width: 30px !important;" src="@/assets/avatar/man.png" alt="">{{userInfo | displayName}}<i class="el-icon-arrow-down el-icon--right"></i> + <img v-if="userInfo != null" style="width: 30px !important" src="@/assets/avatar/man.png" alt="" />{{ + userInfo | displayName + }}<i class="el-icon-arrow-down el-icon--right"></i> </span> <el-dropdown-menu slot="dropdown"> <el-dropdown-item @click.native="changePwd">淇敼瀵嗙爜</el-dropdown-item> @@ -19,21 +31,23 @@ </div> </div> <!-- 淇敼瀵嗙爜 --> - <GlobalAlertWindow - title="淇敼瀵嗙爜" - :visible.sync="visible.changePwd" - @confirm="confirmChangePwd" - @close="visible.changePwd = false" - > + <GlobalAlertWindow title="淇敼瀵嗙爜" :visible.sync="visible.changePwd" + :showClose="!userInfo.needChangePwd || userInfo.needChangePwd == '1'" + :showCancel="!userInfo.needChangePwd || userInfo.needChangePwd == '1'" @confirm="confirmChangePwd" + @close="visible.changePwd = false"> <el-form :model="changePwdData.form" ref="changePwdDataForm" :rules="changePwdData.rules"> <el-form-item label="鍘熷瀵嗙爜" prop="oldPwd" required> - <el-input v-model="changePwdData.form.oldPwd" type="password" placeholder="璇疯緭鍏ュ師濮嬪瘑鐮�" maxlength="30" show-password></el-input> + <el-input v-model="changePwdData.form.oldPwd" type="password" placeholder="璇疯緭鍏ュ師濮嬪瘑鐮�" maxlength="30" + show-password></el-input> </el-form-item> <el-form-item label="鏂板瘑鐮�" prop="newPwd" required> - <el-input v-model="changePwdData.form.newPwd" type="password" placeholder="璇疯緭鍏ユ柊瀵嗙爜" maxlength="30" show-password></el-input> + <el-input v-model="changePwdData.form.newPwd" type="password" placeholder="璇疯緭鍏ユ柊瀵嗙爜锛屽瘑鐮侀渶鍖呭惈瀛楁瘝銆佹暟瀛楀強鐗规畩瀛楃涓殑鑷冲皯涓ょ" maxlength="20" + show-password></el-input> </el-form-item> + <!-- <div style="font-size: 12px;color:#999999">瀵嗙爜闇�鍖呭惈瀛楁瘝銆佹暟瀛楀強鐗规畩瀛楃涓殑鑷冲皯涓ょ</div> --> <el-form-item label="纭鏂板瘑鐮�" prop="confirmPwd" required> - <el-input v-model="changePwdData.form.confirmPwd" type="password" placeholder="璇峰啀娆¤緭鍏ユ柊瀵嗙爜" maxlength="30" show-password></el-input> + <el-input v-model="changePwdData.form.confirmPwd" type="password" placeholder="璇峰啀娆¤緭鍏ユ柊瀵嗙爜" maxlength="20" + show-password></el-input> </el-form-item> </el-form> </GlobalAlertWindow> @@ -44,6 +58,7 @@ import { mapState, mapMutations } from 'vuex' import GlobalAlertWindow from './GlobalAlertWindow' import { logout, updatePwd } from '@/api/system/common' +import { getAppHeaderNav } from '@/api' export default { name: 'CommonHeader', components: { GlobalAlertWindow }, @@ -53,9 +68,10 @@ default: true } }, - data () { + data() { return { title: process.env.VUE_APP_TITLE, + headerNavData: {}, visible: { // 淇敼瀵嗙爜 changePwd: false @@ -77,7 +93,8 @@ { required: true, message: '璇疯緭鍏ュ師濮嬪瘑鐮�' } ], newPwd: [ - { required: true, message: '璇疯緭鍏ユ柊瀵嗙爜' } + { required: true, message: '璇疯緭鍏ュ瘑鐮�', trigger: 'blur' }, + { validator: this.validatePassword, trigger: 'blur' }, ], confirmPwd: [ { required: true, message: '璇峰啀娆¤緭鍏ユ柊瀵嗙爜' } @@ -92,9 +109,16 @@ // return this.$route.meta.title // } }, + mounted() { + // console.log('userInfo',this.userInfo); + if (!this.userInfo.needChangePwd || this.userInfo.needChangePwd == '0') { + this.visible.changePwd = true + } + + }, filters: { // 灞曠ず鍚嶇О - displayName (userInfo) { + displayName(userInfo) { if (userInfo == null) { return '' } @@ -107,14 +131,39 @@ methods: { ...mapMutations(['setUserInfo', 'switchCollapseMenu', 'clearUserInfo']), // 淇敼瀵嗙爜 - changePwd () { + changePwd() { this.visible.changePwd = true this.$nextTick(() => { this.$refs.changePwdDataForm.resetFields() }) }, + validatePassword(rule, value, callback) { + if (!value) { + callback(new Error('璇疯緭鍏ュ瘑鐮�')) + } else { + const lengthValid = /^.{6,20}$/.test(value) + const hasLetter = /[a-zA-Z]/.test(value) + const hasNumber = /[0-9]/.test(value) + const hasSpecial = /[!@#$%^&*(),.?":{}|<>]/.test(value) + + const typesCount = [hasLetter, hasNumber, hasSpecial].filter(Boolean).length + + if (!lengthValid) { + callback(new Error('瀵嗙爜闀垮害闇�涓�6鍒�20涓瓧绗�')) + } else if (typesCount < 2) { + callback(new Error('瀵嗙爜闇�鍖呭惈瀛楁瘝銆佹暟瀛楀強鐗规畩瀛楃涓殑鑷冲皯涓ょ')) + } else { + callback() // 楠岃瘉閫氳繃 + } + } + }, + getHeaderNav(type) { + getAppHeaderNav(type).then(res => { + window.open(res, "_blank") + }) + }, // 纭畾淇敼瀵嗙爜 - confirmChangePwd () { + confirmChangePwd() { if (this.isWorking.changePwd) { return } @@ -138,7 +187,7 @@ this.visible.changePwd = false }) .catch(e => { - this.$tip.apiFailed(e) + // this.$tip.apiFailed(e) }) .finally(() => { this.isWorking.changePwd = false @@ -146,7 +195,7 @@ }) }, // 閫�鍑虹櫥褰� - logout () { + logout() { logout() .then(() => { this.clearUserInfo() @@ -155,7 +204,7 @@ window.location.reload() }) .catch(e => { - this.$tip.apiFailed(e) + // this.$tip.apiFailed(e) }) } } @@ -164,9 +213,40 @@ <style scoped lang="scss"> @import "@/assets/style/variables.scss"; + .common-header { - background-color: #1457C7; + background-color: #2080f7; } + +.list { + flex: 1; + display: flex; + align-items: center; + margin-left: 60px; + + .item { + margin-right: 40px; + font-size: 16px; + font-weight: 400; + display: flex; + flex-direction: column; + align-items: center; + justify-content: flex-start; + height: 40px; + cursor: pointer; + + .linellae { + width: 64px; + height: 2px; + background: #FFFFFF; + } + } + + .active { + font-weight: 500; + } +} + .header { overflow: hidden; // background: #fff; @@ -175,16 +255,23 @@ justify-content: space-between; .logo { - background: url('../../assets/images/top_ic_chilun@2x.png') no-repeat; + /* background: url("../../assets/images/top_ic_chilun@2x.png") no-repeat; */ box-sizing: border-box; - min-width: 280px; - height: 70px; - padding: 17px 30px; + min-width: 360px; + height: 56px; + padding: 10px 30px; // flex-shrink: 0; line-height: 36px; font-size: 22px; font-weight: 600; color: #fff; + display: flex; + align-items: center; + + .title { + width: 200px; + } + // display: inline; .title-en { font-size: 11px; @@ -192,18 +279,22 @@ color: rgb(202, 214, 238); } } + .user { - width: 712px; + width: 212px; box-sizing: border-box; - height: 70px; + height: 56px; padding-right: 25px; - background: url('../../assets/images/top_ic_bolang@2x.png') no-repeat; + background: url("../../assets/images/top_ic_bolang@2x.png") no-repeat; flex-shrink: 0; text-align: right; + cursor: pointer; + .el-dropdown { - top: 10px; + top: 2px; color: #fff; } + img { width: 32px; position: relative; @@ -212,11 +303,13 @@ } } } + // 涓嬫媺鑿滃崟妗� .el-dropdown-menu { width: 140px; + .el-dropdown-menu__item:hover { - background: #E3EDFB; + background: #e3edfb; color: $primary-color; } } -- Gitblit v1.9.3