From c0c034b3ef0fdf0fd9c802d5984dbd717db6817a Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@smartai.com>
Date: 星期三, 06 九月 2023 17:54:55 +0800
Subject: [PATCH] 定制桌面.
---
src/pages/index/App.vue | 571 ++++++++++++++++++++++++++-------------------------------
1 files changed, 260 insertions(+), 311 deletions(-)
diff --git a/src/pages/index/App.vue b/src/pages/index/App.vue
index 70cb09b..9a4d3bc 100644
--- a/src/pages/index/App.vue
+++ b/src/pages/index/App.vue
@@ -1,311 +1,260 @@
-<template>
- <div class="init" v-if="!isWhite">
- <img class="img-test" onerror="console.log('缃戠粶鏁呴殰')" />
- <div class="content">
- <div class="title">娆㈣繋娉ㄥ唽Smart AI 浜哄伐鏅鸿兘鎿嶄綔绯荤粺</div>
- <el-steps :active="active" finish-status="success" :align-center="true">
- <el-step title="鍒涘缓璐﹀彿"></el-step>
- <el-step title="閰嶇疆缃戠粶"></el-step>
- <el-step title="娉ㄥ唽淇℃伅"></el-step>
- </el-steps>
-
- <el-carousel
- ref="carousel"
- trigger="click"
- height="480px"
- :loop="false"
- :autoplay="false"
- :initial-index="active"
- >
- <el-carousel-item>
- <formAccount ref="form0"></formAccount>
- </el-carousel-item>
- <el-carousel-item>
- <formNet ref="form1"></formNet>
- </el-carousel-item>
- <el-carousel-item>
- <formInfo ref="form2"></formInfo>
- </el-carousel-item>
- </el-carousel>
-
- <div class="control">
- <div class="pre" @click="preForm">涓婁竴姝�</div>
- <div class="next" @click="nextForm" v-if="active == 0">涓嬩竴姝�</div>
- <div class="next" @click="nextFormNot" v-if="active == 1">璺宠繃</div>
- <div class="next" @click="nextForm" v-if="active == 1 && !isNet">
- 涓嬩竴姝�
- </div>
- <div class="next" @click="nextForm" v-if="active == 2">瀹屾垚</div>
- </div>
- </div>
- </div>
- <div class="white" v-else></div>
-</template>
-
-<script>
-import formAccount from "@/pages/index/components/formAccount";
-import formNet from "@/pages/index/components/formNet";
-import formInfo from "@/pages/index/components/formInfo";
-import {
- getInitInfo,
- savePassword,
- initNetwork,
- saveRegInfo,
- getRegInfo,
- isOnNet,
-} from "./api";
-
-export default {
- mounted() {
- this.getInitInfo();
- let message = "缃戠粶姝ｅ父";
-
- function onLine(callback) {
- var img = new Image();
- //涓存椂鍒ゆ柇缃戠粶鏄惁閫氱晠
- img.src = "http://apps.smartai.com/img/icon_logo.f78688b5.png";
- img.onload = function () {
- console.log("11111");
- if (callback) callback(true);
- };
- img.onerror = function () {
- console.log("22222");
- if (callback) callback(false);
- };
- }
-
- onLine((flag) => {
- let message = "";
- if (flag) {
- this.isNet = true;
- message = "宸叉湁缃戠粶";
- } else {
- //缃戠粶鏂綉鏁堟灉鍥惧嚭鏉ュ悗锛屽皢姝ゅ湴鏀逛负璺宠浆璺緞鍒版晥鏋滃浘涓�
- message = "鏈厤缃綉缁�";
- this.$notify({
- message: message,
- });
- }
- });
- },
- data() {
- return {
- active: 0,
- formData: {},
- isWhite: true,
- isNet: false,
- };
- },
- components: {
- formAccount,
- formNet,
- formInfo,
- },
- methods: {
- preForm() {
- if (this.active == 0) {
- return;
- }
- this.active--;
- this.$refs["carousel"].prev();
- },
- async nextForm() {
- if (this.active == 2) {
- const data = this.$refs[`form${this.active}`].getFormData();
- await saveRegInfo(data);
- location.assign("/view/login/");
- return;
- }
-
- if (this.active == 0) {
- const data = this.$refs[`form${this.active}`].getFormData();
- if (!data) {
- return false;
- }
- const res1 = await savePassword(data);
- console.log(data);
- this.active++;
- this.$refs["carousel"].next();
- }
-
- if (this.active == 1) {
- const data = this.$refs[`form${this.active}`].getFormData();
- initNetwork(data);
- this.active++;
- this.$refs["carousel"].next();
- }
- },
- nextFormNot() {
- this.active++;
- this.$refs["carousel"].next();
- },
- async getInitInfo() {
- const res = await getInitInfo();
-
- if (res.data.initPwd && !res.data.initRegInfo) {
- const res1 = await getRegInfo();
- this.active = 1;
- console.log(res1);
- setTimeout(() => {
- this.$refs["carousel"].setActiveItem(1);
- }, 0);
- }
-
- /* if (res.data.initPwd && res.data.initRegInfo) {
- location.assign("/login");
- return;
- } */
-
- this.isWhite = false;
- },
- },
-};
-</script>
-
-<style lang="scss" scoped>
-.init {
- height: 100%;
- background-image: url("/images/init/鑳屾櫙鍥�.png");
- color: #fff;
- user-select: none;
-
- .content {
- margin: 0 auto;
- width: 1000px;
- padding-top: 80px;
-
- .title {
- font-size: 28px;
- font-weight: 700;
- margin-bottom: 50px;
- letter-spacing: 5px;
- }
-
- .el-steps ::v-deep {
- margin-left: 22px;
- text-align: left;
-
- .el-step__icon {
- width: 48px;
- height: 48px;
- }
-
- .el-step__line {
- left: 210px;
- right: -110px;
- border: 0.5px solid #fff;
- border-bottom: none;
- border-top: none;
- opacity: 0.1;
- top: 22px;
- }
-
- .is-success .el-step__icon {
- background: none;
- border: 2px solid rgba(255, 255, 255, 0.3);
-
- .el-icon-check::before {
- color: #fff;
- font-size: 24px;
- font-weight: 700;
- }
- }
-
- .is-process .el-step__icon {
- background-color: rgba(255, 255, 255, 0.3);
- border: none;
-
- .el-step__icon-inner {
- color: #fff;
- font-size: 24px;
- font-weight: 700;
- }
- }
-
- .is-wait .el-step__icon {
- border: 2px solid rgba(255, 255, 255);
- opacity: 0.5;
- background: none;
-
- .el-step__icon-inner {
- color: #fff;
- font-size: 24px;
- font-weight: 700;
- }
- }
-
- .el-step__main {
- margin-top: 20px;
- .is-success,
- .is-process {
- font-size: 16px;
- color: #fff;
- font-weight: normal;
- }
-
- .is-wait {
- font-size: 16px;
- color: #fff;
- font-weight: normal;
- opacity: 0.5;
- }
- }
- }
-
- .formAccount {
- margin-top: 0.81rem;
- margin-left: 200px;
- width: 550px;
- }
-
- .formNet,
- .formInfo {
- margin-top: 0.47rem;
- margin-left: 200px;
- width: 550px;
- }
-
- .control {
- position: fixed;
- top: 80%;
- left: 0;
- right: 0;
- line-height: 40px;
- .pre {
- margin: 10px auto;
- cursor: pointer;
- width: 260px;
- height: 40px;
- border: 2px solid rgba(255, 255, 255, 0.3);
- border-radius: 20px;
- font-weight: bold;
- color: #ffffff;
- }
-
- .next {
- margin: 10px auto;
- cursor: pointer;
- width: 260px;
- height: 40px;
- background: rgba(255, 255, 255, 0.3);
- border-radius: 20px;
- font-weight: bold;
- color: #ffffff;
- }
- }
- }
-
- ::v-deep .el-carousel__indicators {
- display: none;
- }
-
- ::v-deep .el-carousel__container button {
- display: none;
- }
-}
-
-.white {
- height: 100%;
- background-color: #fff;
-}
-</style>
\ No newline at end of file
+<template>
+ <div class="init" v-if="!isWhite">
+ <img class="img-test" onerror="console.log('缃戠粶鏁呴殰')" />
+ <div class="content">
+ <div class="title">娆㈣繋娉ㄥ唽Smart AI 浜哄伐鏅鸿兘鎿嶄綔绯荤粺</div>
+ <el-steps :active="active" finish-status="success" :align-center="true">
+ <el-step title="鍒涘缓璐﹀彿"></el-step>
+ <el-step title="閰嶇疆缃戠粶"></el-step>
+ <el-step title="娉ㄥ唽淇℃伅"></el-step>
+ </el-steps>
+
+ <el-carousel ref="carousel" trigger="click" :loop="false" :autoplay="false" :initial-index="active">
+ <el-carousel-item>
+ <formAccount ref="form0" v-show="active == createUser"></formAccount>
+ </el-carousel-item>
+ <el-carousel-item>
+ <formNet ref="form1" v-show="active == configNet"></formNet>
+ </el-carousel-item>
+ <el-carousel-item>
+ <formInfo ref="form2" v-show="active == registerInfo"></formInfo>
+ </el-carousel-item>
+ </el-carousel>
+
+ <div class="control">
+ <div class="pre" @click="preForm" v-if="active != createUser">涓婁竴姝�</div>
+ <div class="next" @click="nextForm" v-if="active == createUser || (active == configNet && !isOnline)">
+ 涓嬩竴姝�
+ </div>
+ <div class="next" @click="nextFormNot" v-if="active == configNet">璺宠繃</div>
+
+ <div class="next" @click="nextForm" v-if="active == registerInfo">瀹屾垚</div>
+ </div>
+ </div>
+ </div>
+ <div class="white" v-else></div>
+</template>
+
+<script>
+import formAccount from "@/pages/index/components/formAccount"
+import formNet from "@/pages/index/components/formNet"
+import formInfo from "@/pages/index/components/formInfo"
+import { tologin, getLoginUserData, getServerName } from "./api.ts"
+import { getMenuListData } from "@/api/utils"
+
+export default {
+ name: "smartai init",
+ components: {
+ formAccount,
+ formNet,
+ formInfo
+ },
+ data() {
+ return {
+ active: 0,
+ formData: {},
+ isWhite: true,
+ isOnline: false,
+ createUser: 0,
+ configNet: 1,
+ registerInfo: 2
+ }
+ },
+ mounted() {
+ this.testLogin()
+ },
+
+ methods: {
+ async testLogin() {
+ // location.assign("/view/desktop/")
+ tologin({ username: "basic", password: "basic2019" })
+ .then((json) => {
+ const loginedInfo = {
+ access_token: json.token_type + " " + json.access_token,
+ refresh_token: json.refresh_token
+ }
+ sessionStorage.setItem("expires_in", json.expires_in)
+ sessionStorage.setItem("loginedInfo", JSON.stringify(loginedInfo))
+ sessionStorage.setItem("userInfo", JSON.stringify(json.userInfo))
+
+ location.assign("/view/desktop/")
+ })
+ .catch()
+ },
+ async getLoginUserData() {
+ let res = await getLoginUserData()
+ if (res.success) {
+ sessionStorage.setItem("userInfo", JSON.stringify(res.data))
+ // 鑾峰彇鏉冮檺
+ // await this.getMenuList()
+
+ return res.data
+ } else {
+ }
+ },
+ async getMenuList() {
+ let results = await getMenuListData({})
+ if (results && results.success) {
+ /* 瀛樺偍鏉冮檺 */
+ let buttonAuthoritys = results.data
+ sessionStorage.setItem("buttonAuthoritys", "," + buttonAuthoritys + ",")
+ sessionStorage.setItem("menuInfo", JSON.stringify(results))
+ }
+ }
+ }
+}
+</script>
+
+<style lang="scss" scoped>
+.init {
+ background-image: url("/images/init/鑳屾櫙鍥�.png");
+ background-size: cover;
+ background-attachment: fixed;
+ color: #fff;
+ user-select: none;
+ height: 100%;
+ min-width: 1000px;
+ overflow: hidden;
+ min-height: 760px;
+ .content {
+ margin: 0 auto;
+ width: 1000px;
+ padding-top: calc(6.4vh);
+
+ .title {
+ font-size: 28px;
+ font-weight: 700;
+ margin-bottom: 50px;
+ letter-spacing: 5px;
+ }
+
+ .el-steps ::v-deep {
+ margin-left: 22px;
+ text-align: left;
+
+ .el-step__icon {
+ width: 48px;
+ height: 48px;
+ }
+
+ .el-step__line {
+ left: 210px;
+ right: -110px;
+ border: 0.5px solid #fff;
+ border-bottom: none;
+ border-top: none;
+ opacity: 0.1;
+ top: 22px;
+ }
+
+ .is-success .el-step__icon {
+ background: none;
+ border: 2px solid rgba(255, 255, 255, 0.3);
+
+ .el-icon-check::before {
+ color: #fff;
+ font-size: 24px;
+ font-weight: 700;
+ }
+ }
+
+ .is-process .el-step__icon {
+ background-color: rgba(255, 255, 255, 0.3);
+ border: none;
+
+ .el-step__icon-inner {
+ color: #fff;
+ font-size: 24px;
+ font-weight: 700;
+ }
+ }
+
+ .is-wait .el-step__icon {
+ border: 2px solid rgba(255, 255, 255);
+ opacity: 0.5;
+ background: none;
+
+ .el-step__icon-inner {
+ color: #fff;
+ font-size: 24px;
+ font-weight: 700;
+ }
+ }
+
+ .el-step__main {
+ margin-top: 20px;
+ .is-success,
+ .is-process {
+ font-size: 16px;
+ color: #fff;
+ font-weight: normal;
+ }
+
+ .is-wait {
+ font-size: 16px;
+ color: #fff;
+ font-weight: normal;
+ opacity: 0.5;
+ }
+ }
+ }
+
+ .formAccount {
+ margin-left: 200px;
+ width: 550px;
+ }
+
+ .formNet,
+ .formInfo {
+ margin-left: 200px;
+ width: 550px;
+ }
+
+ .control {
+ margin: 0 auto;
+ line-height: 40px;
+ margin-top: calc(3.2vh);
+
+ .pre {
+ margin: 10px auto;
+ cursor: pointer;
+ width: 260px;
+ height: 40px;
+ border: 2px solid rgba(255, 255, 255, 0.3);
+ border-radius: 20px;
+ font-weight: bold;
+ color: #ffffff;
+ }
+
+ .next {
+ margin: 10px auto;
+ cursor: pointer;
+ width: 260px;
+ height: 40px;
+ background: rgba(255, 255, 255, 0.3);
+ border-radius: 20px;
+ font-weight: bold;
+ color: #ffffff;
+ }
+ }
+ }
+
+ ::v-deep .el-carousel__indicators {
+ display: none;
+ }
+
+ ::v-deep .el-carousel__container button {
+ display: none;
+ }
+
+ ::v-deep .el-carousel__container {
+ margin-top: calc(5.74vh);
+ height: 290px !important;
+ }
+}
+
+.white {
+ height: 100%;
+ background-color: #fff;
+}
+</style>
--
Gitblit v1.8.0