From feaf0a9778879ef211c5587a513ba4cbdabb52d0 Mon Sep 17 00:00:00 2001 From: ZZJ <10913410+zzj2100@user.noreply.gitee.com> Date: 星期四, 23 六月 2022 17:42:58 +0800 Subject: [PATCH] bug修复 --- src/pages/settings/components/AuthorizationSetting.vue | 238 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 235 insertions(+), 3 deletions(-) diff --git a/src/pages/settings/components/AuthorizationSetting.vue b/src/pages/settings/components/AuthorizationSetting.vue index 2b19384..4161551 100644 --- a/src/pages/settings/components/AuthorizationSetting.vue +++ b/src/pages/settings/components/AuthorizationSetting.vue @@ -1,10 +1,242 @@ <template> - <div class="AuthorizationSetting">AuthorizationSetting</div> + <div class="AuthorizationSetting"> + <div class="content"> + <div class="title">璁惧鎺堟潈閰嶇疆</div> + + <el-form + :model="settingForm" + :rules="rules" + ref="joinForm" + class="join-form" + > + <!-- 鎺堟潈绠$悊鏂瑰紡 --> + <el-form-item> + <div class="row"> + <div class="item-title">璁惧鎺堟潈绠$悊鏂瑰紡</div> + <div class="inputContain"> + <el-select + v-model="settingForm.need_auth_pwd" + placeholder="璇烽�夋嫨" + size="small" + :popper-append-to-body="false" + > + <el-option + v-for="item in typeOptions" + :key="item.value" + :label="item.label" + :value="item.value" + ></el-option> + </el-select> + </div> + </div> + </el-form-item> + + <!-- 鎺堟潈瀵嗙爜 --> + <el-form-item prop="auth_pwd" v-if="settingForm.need_auth_pwd == 1"> + <div class="row"> + <div class="item-title">鎺堟潈瀵嗛挜</div> + <div class="inputContain"> + <el-input + v-model="settingForm.auth_pwd" + placeholder="璇疯緭鍏�6浣嶆巿鏉冨瘑閽�" + maxlength="6" + show-auth_pwd + ></el-input> + </div> + </div> + </el-form-item> + </el-form> + + <div class="save" @click="submit">淇濆瓨</div> + </div> + </div> </template> <script> -export default {}; +import { getAuthInfo, setAuthInfo } from "@/api/system"; + +export default { + created() { + this.getAuth(); + }, + data() { + return { + settingForm: { + need_auth_pwd: 0, //鎺堟潈绠$悊鏂瑰紡 + auth_pwd: "", //鎺堟潈瀵嗛挜 + id: "", //璁惧id + }, + typeOptions: [ + { + label: "濮嬬粓鍏佽", + value: 0, + }, + { + label: "瀵嗙爜鏍¢獙", + value: 1, + }, + ], //鎺堟潈绠$悊鏂瑰紡閫夐」 + rules: { + auth_pwd: [ + { min: 6, max: 6, message: "闀垮害涓�6涓瓧绗�", trigger: "blur" }, + ], + }, //姝e垯鏍¢獙 + }; + }, + methods: { + //鑾峰彇鎺堟潈淇℃伅 + async getAuth() { + const res = await getAuthInfo(); + if (res.code === 200 && res.success) { + //鎺堟潈鏁版嵁鍥炲~ + this.settingForm = res.data; + } else { + this.$notify.error({ + title: "閿欒", + message: "鑾峰彇鎺堟潈淇℃伅澶辫触", + }); + } + }, + //鎻愪氦鎺堟潈閰嶇疆 + async submit() { + const res = await setAuthInfo(this.settingForm); + if (res.code === 200 && res.success) { + this.$notify.success({ + title: "鎴愬姛", + message: "淇敼鎴愬姛", + }); + } else { + this.$notify.error({ + title: "閿欒", + message: "淇敼澶辫触", + }); + } + }, + }, +}; </script> -<style> +<style lang="scss" scoped> +.AuthorizationSetting { + position: relative; + + .content { + width: 456px; + margin: 0 auto; + } + + .title { + height: 48px; + font-size: 16px; + line-height: 48px; + color: #4f4f4f; + font-weight: bold; + background: #f2f2f7; + border-radius: 8px; + margin-bottom: 4px; + } + + .row { + margin: 0 auto; + height: 48px; + margin-bottom: 4px; + background-color: #f2f2f7; + border-radius: 8px; + + line-height: 48px; + display: flex; + justify-content: space-between; + align-items: center; + background: #f2f2f7; + border-radius: 8px; + padding: 0 20px; + + .item-title { + font-size: 14px; + color: #4f4f4f; + font-weight: 700; + } + + .el-select ::v-deep { + width: 280px; + height: 32px; + + input { + border-radius: 20px; + border-color: #fff; + padding-left: 20px; + font-size: 12px; + color: #333; + font-weight: 700; + } + + .popper__arrow, + .popper__arrow::after { + display: none; + } + + .el-select-dropdown { + top: 30px; + height: 84px; + box-shadow: 0px 4px 12px rgba(5, 95, 230, 0.25); + border-radius: 8px; + + .el-select-dropdown__item { + font-size: 12px; + font-weight: 400; + color: #333; + + &.selected { + span { + color: #4e94ff; + } + } + } + } + } + + .el-input ::v-deep { + width: 280px; + height: 32px; + + input { + height: 32px; + border-radius: 20px; + border-color: #fff; + padding-left: 20px; + font-size: 12px; + color: #333; + font-weight: 700; + + &::-webkit-input-placeholder { + /* WebKit browsers */ + color: #828282; + font-weight: normal; + font-size: 12px; + } + } + } + } + + .save { + position: absolute; + top: 375px; + left: 50%; + margin-left: -94px; + width: 188px; + height: 40px; + background: var(--colorCard); + border-radius: 25px; + font-weight: bold; + font-size: 16px; + line-height: 40px; + color: #fff; + text-align: center; + cursor: pointer; + } + + .el-form-item { + margin-bottom: 0; + } +} </style> \ No newline at end of file -- Gitblit v1.8.0