|
|
@@ -0,0 +1,197 @@
|
|
|
+<template>
|
|
|
+ <div class="passwordIdx">
|
|
|
+ <s-header :name="$t('device.devicePasswordPage.title')" :noback="false"></s-header>
|
|
|
+ <div class="headerCon kBordBott o-plr-10 o-ptb-16 l-flex-RC">
|
|
|
+ <div class="line o-mr-6"></div>
|
|
|
+ <div>
|
|
|
+ <span class="c-color c-text-14">{{ $t('device.devicePasswordPage.equipmentName') }}：</span>
|
|
|
+ <span class="c-text-color c-text-14">{{ equipmentName }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <van-config-provider :theme-vars="themeVars">
|
|
|
+ <van-dropdown-menu active-color="#1989fa">
|
|
|
+ <van-dropdown-item v-model="pwdValue" :options="pwdType" />
|
|
|
+ </van-dropdown-menu>
|
|
|
+ <van-form v-if="pwdValue==0" @submit="onSubmit">
|
|
|
+ <van-cell-group inset>
|
|
|
+ <van-field v-model="adminPwd" type="password" :label="$t('device.devicePasswordPage.deivcePwd')"
|
|
|
+ :placeholder="$t('device.devicePasswordPage.passwordPlaceholder')"
|
|
|
+ :rules="[{ validator, message: $t('device.devicePasswordPage.passwordPlaceholder') }]" />
|
|
|
+ <van-field v-model="checkAmdinPwd" type="password" :label="$t('device.devicePasswordPage.checkDeivcePwd')"
|
|
|
+ :placeholder="$t('device.devicePasswordPage.passwordCheckRequired')"
|
|
|
+ :rules="[{ validator, message: $t('device.devicePasswordPage.passwordPlaceholder') }]" />
|
|
|
+ </van-cell-group>
|
|
|
+ <div style="margin: 16px;">
|
|
|
+ <van-button round block type="primary" native-type="submit">
|
|
|
+ {{$t('device.submitAndPushDeviceUpdates')}}
|
|
|
+ </van-button>
|
|
|
+ </div>
|
|
|
+ </van-form>
|
|
|
+ <van-form v-else @submit="onSubmit">
|
|
|
+ <van-cell-group inset>
|
|
|
+ <van-field v-model="guestPwd" type="password" :label="$t('device.devicePasswordPage.deivcePwd')"
|
|
|
+ :placeholder="$t('device.devicePasswordPage.passwordPlaceholder')"
|
|
|
+ :rules="[{ validator, message: $t('device.devicePasswordPage.passwordPlaceholder') }]" />
|
|
|
+ <van-field v-model="checkGuestPwd" type="password" :label="$t('device.devicePasswordPage.checkDeivcePwd')"
|
|
|
+ :placeholder="$t('device.devicePasswordPage.passwordCheckRequired')"
|
|
|
+ :rules="[{ validator, message: $t('device.devicePasswordPage.passwordPlaceholder') }]" />
|
|
|
+ </van-cell-group>
|
|
|
+ <div style="margin: 16px;">
|
|
|
+ <van-button round block type="primary" native-type="submit">
|
|
|
+ {{$t('device.submitAndPushDeviceUpdates')}}
|
|
|
+ </van-button>
|
|
|
+ </div>
|
|
|
+ </van-form>
|
|
|
+ </van-config-provider>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ // 导入接口
|
|
|
+ import {
|
|
|
+ updateDevicePassword
|
|
|
+ } from '@/service/device/index';
|
|
|
+ import sHeader from "@/components/SimpleHeader";
|
|
|
+ import {
|
|
|
+ ref,
|
|
|
+ reactive
|
|
|
+ } from "@vue/reactivity";
|
|
|
+ import {
|
|
|
+ onMounted
|
|
|
+ } from '@vue/runtime-core';
|
|
|
+ import {
|
|
|
+ useRoute, useRouter
|
|
|
+ } from 'vue-router';
|
|
|
+ import {
|
|
|
+ Notify, Dialog, Toast
|
|
|
+ } from 'vant';
|
|
|
+ import {
|
|
|
+ useI18n
|
|
|
+ } from "vue-i18n";
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ sHeader
|
|
|
+ },
|
|
|
+ setup() {
|
|
|
+ // 引入语言
|
|
|
+ const { t } = useI18n();
|
|
|
+ // 路由
|
|
|
+ const route = useRoute();
|
|
|
+ const router = useRouter();
|
|
|
+ // 设备名称
|
|
|
+ const equipmentName = ref('');
|
|
|
+ const pwdValue = ref();
|
|
|
+ const adminPwd = ref();
|
|
|
+ const checkAmdinPwd = ref();
|
|
|
+ const guestPwd = ref();
|
|
|
+ const checkGuestPwd = ref();
|
|
|
+
|
|
|
+ const validator = (val) => /\w{6,}/.test(val);
|
|
|
+ const themeVars = {
|
|
|
+ dropdownMenuTitleTextColor: '#404d74'
|
|
|
+ };
|
|
|
+ const pwdType = [{
|
|
|
+ text: t('device.devicePasswordPage.adminPassword'),
|
|
|
+ value: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ text: t('device.devicePasswordPage.guestPassword'),
|
|
|
+ value: 1
|
|
|
+ },
|
|
|
+ ]
|
|
|
+ // 刚进页面
|
|
|
+ onMounted(() => {
|
|
|
+ console.log(pwdType[0].value)
|
|
|
+ pwdValue.value = pwdType[0].value;
|
|
|
+ console.log(pwdValue.value)
|
|
|
+ const id = route.query.deviceId || "";
|
|
|
+ const name = route.query.name || "";
|
|
|
+ if (id) {
|
|
|
+ passwordForm.equipmentId = id;
|
|
|
+ equipmentName.value = name;
|
|
|
+ }
|
|
|
+
|
|
|
+ });
|
|
|
+ // 修改的价格
|
|
|
+ const passwordForm = reactive({
|
|
|
+ equipmentId: '',
|
|
|
+ adminPwd: '',
|
|
|
+ guestPwd: ''
|
|
|
+ });
|
|
|
+
|
|
|
+ // 点击提交
|
|
|
+ const onSubmit = () => {
|
|
|
+ passwordForm.adminPwd = adminPwd.value;
|
|
|
+ passwordForm.guestPwd = guestPwd.value;
|
|
|
+ console.log(passwordForm);
|
|
|
+ if ((passwordForm.adminPwd != checkAmdinPwd.value) || (passwordForm.guestPwd != checkGuestPwd.value)) {
|
|
|
+ Notify({
|
|
|
+ type: 'danger',
|
|
|
+ message: t('device.devicePasswordPage.passwordMatch')
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if(pwdValue.value == 0) {
|
|
|
+ passwordForm.guestPwd = "";
|
|
|
+ }
|
|
|
+ if(pwdValue.value == 1) {
|
|
|
+ passwordForm.adminPwd = "";
|
|
|
+ }
|
|
|
+ Dialog.confirm({
|
|
|
+ // title: "提示",
|
|
|
+ message: t('device.editCheck'),
|
|
|
+ }).then(() => {
|
|
|
+ console.log(passwordForm);
|
|
|
+ updateDevicePassword({
|
|
|
+ "equipmentId": passwordForm.equipmentId,
|
|
|
+ "adminPwd": passwordForm.adminPwd,
|
|
|
+ "guestPwd": passwordForm.guestPwd
|
|
|
+ }).then((res) => {
|
|
|
+ if(res.data.code == "A0001") {
|
|
|
+ Toast.fail(t('device.unknownError'));
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ Dialog.alert({
|
|
|
+ message: t('device.modificationSucceeded'),
|
|
|
+ }).then(() => {
|
|
|
+ //返回上一页
|
|
|
+ router.go(-1);
|
|
|
+ });
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ return {
|
|
|
+ passwordForm,
|
|
|
+ equipmentName,
|
|
|
+ pwdType,
|
|
|
+ pwdValue,
|
|
|
+ adminPwd,
|
|
|
+ checkAmdinPwd,
|
|
|
+ guestPwd,
|
|
|
+ checkGuestPwd,
|
|
|
+ onSubmit,
|
|
|
+ validator,
|
|
|
+ themeVars
|
|
|
+ };
|
|
|
+ },
|
|
|
+ };
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+ .passwordIdx {
|
|
|
+ overflow: hidden;
|
|
|
+ overflow-y: auto;
|
|
|
+
|
|
|
+
|
|
|
+ .headerCon {
|
|
|
+ .line {
|
|
|
+ background-color: rgba(128, 150, 236, 1);
|
|
|
+ border-radius: 2px;
|
|
|
+ width: 4px;
|
|
|
+ height: 16px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+</style>
|
