Skip to content

C
computedRoomPad
提交 b4201cb5 authored 作者: caodi\cd's avatar caodi\cd
浏览文件
操作

fix:主页基础框架

上级 19d9eb70
隐藏空白字符变更
内嵌 并排
正在显示 包含 916 行增加 和 643 行删除
manifest.json
浏览文件 @ b4201cb5
......@@ -52,7 +52,7 @@
"ad" : {}
},
"splashscreen" : {
"androidStyle" : "common"
"androidStyle" : "default"
},
"icons" : {
"android" : {
......
pages/home/home.vue
浏览文件 @ b4201cb5
<template>
<view class="home-page">
<view class="left-tab">
<view class="user-info">
<image class="user-img" src="@/static/img/add-img/home1.png"></image>
<text class="text">{{ userName }}</text>
</view>
<view class="tab-list">
<view
v-for="(item, index) in tabList"
:key="item.text"
class="tab-item"
@click="tabClick(item, index)"
:class="activeTabIndex == index ? 'active-tab' : ''"
>
<view class="icon-item"
><text class="iconfont" :class="item.defaultIcon"></text>
</view>
<text class="text">{{ item.text }}</text>
</view>
</view>
<view class="button-group">
<view v-if="isAdmin" class="log-button" @click="lookLog">操作日志</view>
<view class="reset-password-button" @click="updatePassword"
>修改密码？</view
>
<view class="reset-password-button" @click="logOut">退出账号？</view>
</view>
</view>
<!-- 内容区 -->
<view class="right-container">
<!-- 首页 -->
<Content v-if="activeTabIndex == 0" @changeTab="tabClick" />
<!-- 杭州内网机房巡检 -->
<InspectionManagement v-if="activeTabIndex == 1" />
<!-- 同步管理 -->
<SynchronousManagement v-if="activeTabIndex == 2" />
<RouterView />
</view>
<!-- 退出账号弹出 -->
<uni-popup ref="inputDialog2" type="dialog">
<uni-popup-dialog
ref="inputClose2"
mode="base"
title="确定退出该账号?"
@confirm="dialogInputConfirm2"
>
</uni-popup-dialog>
</uni-popup>
</view>
<view class="container">
<!-- 第一个模块 -->
<view class="header">
<view class="title">运维在线</view>
<view class="header-buttons">
<button class="log-button">操作日志</button>
<button class="exit-button">
<image src="/static/exit-icon.png" mode="aspectFit"></image>
</button>
</view>
</view>
<!-- 第二个模块 -->
<view class="profile-section">
<view class="profile-box">
<view class="profile-left">
<view class="avatar">
<image src="@/static/img/add-img/home1.png" mode="aspectFit"></image>
<view class="change-password" @click="changePassword">修改密码</view>
</view>
<view class="username">用户名</view>
</view>
<view class="profile-right">
<button class="inspection-button">巡检管理</button>
<button class="record-button">上架记录</button>
</view>
</view>
</view>
<!-- 第三个模块 -->
<view class="card-section">
<view class="card-container">
<view class="card" v-for="(card, index) in cards" :key="index">
<image :src="card.image" class="card-image"></image>
<view class="card-text">{{ card.text }}</view>
</view>
</view>
</view>
</view>
</template>
<script>
import InspectionManagement from "@/pages/inspectionManagement/index.vue";
import SynchronousManagement from "@/pages/synchronousManagement/index.vue";
import OperLog from "@/pages/index/operLog.vue";
import Content from "./content.vue";
export default {
components: {
Content,
InspectionManagement,
SynchronousManagement,
OperLog,
},
data() {
return {
activeTabIndex: 0,
tabList: [
{
defaultIcon: "iconfont icon-yingyongyewuguanli1",
isActive: true,
text: "主页",
},
{
defaultIcon: "iconfont icon-Inspection",
isActive: false,
text: "巡检管理",
},
{
defaultIcon: "iconfont icon-a-ActivityConfiguration",
isActive: false,
text: "同步管理",
},
],
userName: this.$store.state.now_user.user,
};
},
computed: {
isAdmin() {
return this.$store.state.now_user.isAdmin;
},
},
onLoad(options = {}) {
// options就是路由参数，它是一个对象
// this.tabIndex = ;
this.tabClick({}, options.tabIndex || 0);
},
watch: {
},
methods: {
// 修改密码
updatePassword() {
uni.navigateTo({
url: "/pages/index/editPd",
});
},
// 查看操作日志
lookLog() {
uni.navigateTo({
url: "/pages/index/operLog",
});
// this.activeTabIndex = 4
},
//退出--弹出对话框
dialogInputConfirm2() {
uni.redirectTo({
url: "/pages/login/login",
success: () => {
// uni.clearStorage(); //测试将所有缓存清除
uni.setStorageSync("now_user", this.$store.state.now_user);
uni.setStorageSync(
"last_time",
this.$store.state.now_user.LastSynchronizationTime || ""
);
},
});
},
//退出
logOut() {
this.$refs.inputDialog2.open();
},
// 切换tab
tabClick(item, index) {
this.activeTabIndex = index;
},
toIndex() {
uni.navigateTo({
url: "/pages/index/index",
});
},
},
};
export default {
data() {
return {
cards: [{
image: '../../static/img/jf.png',
text: '机房巡检'
},
{
image: '../../static/img/jd.png',
text: '井道巡检'
},
{
image: '../../static/img/sj.png',
text: '设备上架'
}
]
};
},
methods: {
changePassword() {
uni.showToast({
title: '修改密码',
icon: 'none'
});
}
}
};
</script>
<style scoped lang="less">
.home-page {
display: flex;
position: relative;
height: 100vh;
background-image: linear-gradient(115deg, #e9f8ff 0%, #ecf1f4 100%);
z-index: 1;
.left-tab {
z-index: 10;
width: 120px;
display: flex;
flex-direction: column;
justify-content: space-between;
height: 100%;
padding: 24px 16px;
.user-info {
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-end;
height: 72px;
// border: 1px solid;
.user-img {
height: 48px;
width: 48px;
border-radius: 50%;
overflow: hidden;
box-shadow: 5px 5px 10px #e7e7e7;
}
.text {
font-size: 16px;
color: #4a4a4a;
text-align: center;
font-weight: 400;
}
}
.tab-list {
height: 58vh;
display: flex;
flex-direction: column;
justify-content: space-around;
.tab-item {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
.icon-item {
display: flex;
justify-content: center;
align-items: center;
width: 56px;
height: 56px;
border-radius: 16px;
background: #fff;
margin-bottom: 12px;
.iconfont {
font-size: 28px;
color: #4a4a4a;
}
}
}
.active-tab {
.icon-item {
background-image: linear-gradient(180deg, #3773f6 0%, #2c57f6 99%);
}
.iconfont {
color: #fff !important;
}
.text {
color: #3774f6;
}
}
}
.button-group {
font-size: 14px;
color: #ffffff;
font-weight: 400;
.log-button {
background-image: linear-gradient(180deg, #3773f6 0%, #2c57f6 99%);
border-radius: 4px;
height: 32px;
margin-bottom: 16px;
text-align: center;
line-height: 32px;
}
.reset-password-button {
font-size: 14px;
color: #3774f6;
font-weight: 400;
text-align: center;
}
}
}
.right-container {
flex: 1;
margin-left: 16px;
z-index: 10;
padding-top: 32px;
padding-right: 16px;
// .card-list {
// display: flex;
// .card-item {
// border-radius: 12px;
// flex: 1;
// margin-right: 16px;
// height: 166px;
// box-sizing: border-box;
// padding: 24px 0 24px 24px;
// position: relative;
// overflow: hidden;
// .bg-img {
// position: absolute;
// top: 0;
// left: 0;
// width: 100%;
// height: 100%;
// z-index: -1;
// }
// .title {
// font-size: 18px;
// color: #000000;
// font-weight: bold;
// margin-bottom: 24px;
// }
// .unit {
// margin-bottom: 16px;
// }
// .unit,
// .time {
// font-size: 12px;
// color: #7c7c7c;
// font-weight: 400;
// }
// .title2x {
// font-size: 14px;
// color: #4a4a4a;
// font-weight: 400;
// margin-bottom: 8px;
// }
// .count {
// font-size: 14px;
// color: #7c7c7c;
// font-weight: 400;
// .num {
// margin-right: 2px;
// font-size: 32px;
// color: #000000;
// line-height: 40px;
// font-weight: bold;
// }
// }
// .button-text {
// display: flex;
// align-items: center;
// font-size: 14px;
// color: #3774f6;
// font-weight: 400;
// }
// }
// .card-item3x {
// padding-top: 40px;
// }
// }
// .seconed-title {
// margin-top: 16px;
// font-size: 18px;
// color: #000000;
// font-weight: bold;
// }
// .month-list {
// height: calc(100vh - 166px - 25px - 16px);
// overflow: auto;
// .month-record-item {
// margin-bottom: 24px;
// &:last-of-type {
// margin: 0;
// }
// .inspect-list {
// display: flex;
// flex-wrap: wrap;
// }
// }
// }
}
}
</style>
.container {
display: flex;
flex-direction: column;
align-items: center;
padding: 20px;
height: 100vh;
background-image: linear-gradient(115deg, #E8F0FB 0%, #E1EBFA 100%);
z-index: 1;
}
.header {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px;
position: relative;
margin-bottom: 147px;
.title {
position: absolute;
left: 50%;
transform: translateX(-50%);
ont-family: PingFangSC-Medium;
font-size: 32px;
color: #000000;
text-align: center;
line-height: 40px;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.16);
font-weight: 500;
}
.header-buttons {
display: flex;
align-items: center;
margin-left: auto; // 将按钮组推到最右侧
.log-button {
width: 112px;
height: 36px;
background: #FFFFFF;
border-radius: 18px;
margin-right: 10px;
font-family: PingFangSC-Regular;
font-size: 16px;
color: #000000;
line-height: 24px;
font-weight: 400;
}
.exit-button {
width: 36px;
height: 36px;
background-color: transparent;
border: none;
border-radius: 18px;
display: flex;
justify-content: center;
align-items: center;
image {
width: 24px;
height: 24px;
}
}
}
}
.profile-section {
width: 720px;
margin-top: 20px;
.profile-box {
background-color: #f0f0f0;
border-radius: 10px;
padding: 16px 32px;
display: flex;
justify-content: space-between;
align-items: center;
.profile-left {
display: flex;
align-items: center;
.avatar {
position: relative;
width: 86px;
height: 86px;
border-radius: 50%;
overflow: hidden;
image {
width: 100%;
height: 100%;
}
.change-password {
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 22px;
background-color: rgba(0, 0, 0, 0.5);
color: white;
text-align: center;
font-size: 12px;
line-height: 22px;
}
}
.username {
margin-left: 10px;
font-size: 18px;
}
}
.profile-right {
display: flex;
.inspection-button {
width: 112px;
height: 36px;
background-color: blue;
color: white;
border-radius: 18px;
font-size: 14px;
margin-right: 10px;
}
.record-button {
width: 112px;
height: 36px;
background-color: purple;
color: white;
border-radius: 18px;
font-size: 14px;
}
}
}
}
.card-section {
width: 720px;
margin-top: 20px;
.card-container {
display: flex;
justify-content: space-between;
.card {
width: 224px;
height: 194px;
background-color: #f0f0f0;
border-radius: 10px;
display: flex;
flex-direction: column;
align-items: center;
padding-top: 35px;
.card-image {
width: 75px;
height: 75px;
margin-bottom: 20px;
}
.card-text {
font-size: 18px;
text-align: center;
}
}
}
}
</style>
\ No newline at end of file
pages/home/homeCopy.vue 0 → 100644
浏览文件 @ b4201cb5
<template>
<view class="home-page">
<view class="left-tab">
<view class="user-info">
<image class="user-img" src="@/static/img/add-img/home1.png"></image>
<text class="text">{{ userName }}</text>
</view>
<view class="tab-list">
<view
v-for="(item, index) in tabList"
:key="item.text"
class="tab-item"
@click="tabClick(item, index)"
:class="activeTabIndex == index ? 'active-tab' : ''"
>
<view class="icon-item"
><text class="iconfont" :class="item.defaultIcon"></text>
</view>
<text class="text">{{ item.text }}</text>
</view>
</view>
<view class="button-group">
<view v-if="isAdmin" class="log-button" @click="lookLog">操作日志</view>
<view class="reset-password-button" @click="updatePassword"
>修改密码？</view
>
<view class="reset-password-button" @click="logOut">退出账号？</view>
</view>
</view>
<!-- 内容区 -->
<view class="right-container">
<!-- 首页 -->
<Content v-if="activeTabIndex == 0" @changeTab="tabClick" />
<!-- 杭州内网机房巡检 -->
<InspectionManagement v-if="activeTabIndex == 1" />
<!-- 同步管理 -->
<SynchronousManagement v-if="activeTabIndex == 2" />
<RouterView />
</view>
<!-- 退出账号弹出 -->
<uni-popup ref="inputDialog2" type="dialog">
<uni-popup-dialog
ref="inputClose2"
mode="base"
title="确定退出该账号?"
@confirm="dialogInputConfirm2"
>
</uni-popup-dialog>
</uni-popup>
</view>
</template>
<script>
import InspectionManagement from "@/pages/inspectionManagement/index.vue";
import SynchronousManagement from "@/pages/synchronousManagement/index.vue";
import OperLog from "@/pages/index/operLog.vue";
import Content from "./content.vue";
export default {
components: {
Content,
InspectionManagement,
SynchronousManagement,
OperLog,
},
data() {
return {
activeTabIndex: 0,
tabList: [
{
defaultIcon: "iconfont icon-yingyongyewuguanli1",
isActive: true,
text: "主页",
},
{
defaultIcon: "iconfont icon-Inspection",
isActive: false,
text: "巡检管理",
},
{
defaultIcon: "iconfont icon-a-ActivityConfiguration",
isActive: false,
text: "同步管理",
},
],
userName: this.$store.state.now_user.user,
};
},
computed: {
isAdmin() {
return this.$store.state.now_user.isAdmin;
},
},
onLoad(options = {}) {
// options就是路由参数，它是一个对象
// this.tabIndex = ;
this.tabClick({}, options.tabIndex || 0);
},
watch: {
},
methods: {
// 修改密码
updatePassword() {
uni.navigateTo({
url: "/pages/index/editPd",
});
},
// 查看操作日志
lookLog() {
uni.navigateTo({
url: "/pages/index/operLog",
});
// this.activeTabIndex = 4
},
//退出--弹出对话框
dialogInputConfirm2() {
uni.redirectTo({
url: "/pages/login/login",
success: () => {
// uni.clearStorage(); //测试将所有缓存清除
uni.setStorageSync("now_user", this.$store.state.now_user);
uni.setStorageSync(
"last_time",
this.$store.state.now_user.LastSynchronizationTime || ""
);
},
});
},
//退出
logOut() {
this.$refs.inputDialog2.open();
},
// 切换tab
tabClick(item, index) {
this.activeTabIndex = index;
},
toIndex() {
uni.navigateTo({
url: "/pages/index/index",
});
},
},
};
</script>
<style scoped lang="less">
.home-page {
display: flex;
position: relative;
height: 100vh;
background-image: linear-gradient(115deg, #e9f8ff 0%, #ecf1f4 100%);
z-index: 1;
.left-tab {
z-index: 10;
width: 120px;
display: flex;
flex-direction: column;
justify-content: space-between;
height: 100%;
padding: 24px 16px;
.user-info {
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-end;
height: 72px;
// border: 1px solid;
.user-img {
height: 48px;
width: 48px;
border-radius: 50%;
overflow: hidden;
box-shadow: 5px 5px 10px #e7e7e7;
}
.text {
font-size: 16px;
color: #4a4a4a;
text-align: center;
font-weight: 400;
}
}
.tab-list {
height: 58vh;
display: flex;
flex-direction: column;
justify-content: space-around;
.tab-item {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
.icon-item {
display: flex;
justify-content: center;
align-items: center;
width: 56px;
height: 56px;
border-radius: 16px;
background: #fff;
margin-bottom: 12px;
.iconfont {
font-size: 28px;
color: #4a4a4a;
}
}
}
.active-tab {
.icon-item {
background-image: linear-gradient(180deg, #3773f6 0%, #2c57f6 99%);
}
.iconfont {
color: #fff !important;
}
.text {
color: #3774f6;
}
}
}
.button-group {
font-size: 14px;
color: #ffffff;
font-weight: 400;
.log-button {
background-image: linear-gradient(180deg, #3773f6 0%, #2c57f6 99%);
border-radius: 4px;
height: 32px;
margin-bottom: 16px;
text-align: center;
line-height: 32px;
}
.reset-password-button {
font-size: 14px;
color: #3774f6;
font-weight: 400;
text-align: center;
}
}
}
.right-container {
flex: 1;
margin-left: 16px;
z-index: 10;
padding-top: 32px;
padding-right: 16px;
// .card-list {
// display: flex;
// .card-item {
// border-radius: 12px;
// flex: 1;
// margin-right: 16px;
// height: 166px;
// box-sizing: border-box;
// padding: 24px 0 24px 24px;
// position: relative;
// overflow: hidden;
// .bg-img {
// position: absolute;
// top: 0;
// left: 0;
// width: 100%;
// height: 100%;
// z-index: -1;
// }
// .title {
// font-size: 18px;
// color: #000000;
// font-weight: bold;
// margin-bottom: 24px;
// }
// .unit {
// margin-bottom: 16px;
// }
// .unit,
// .time {
// font-size: 12px;
// color: #7c7c7c;
// font-weight: 400;
// }
// .title2x {
// font-size: 14px;
// color: #4a4a4a;
// font-weight: 400;
// margin-bottom: 8px;
// }
// .count {
// font-size: 14px;
// color: #7c7c7c;
// font-weight: 400;
// .num {
// margin-right: 2px;
// font-size: 32px;
// color: #000000;
// line-height: 40px;
// font-weight: bold;
// }
// }
// .button-text {
// display: flex;
// align-items: center;
// font-size: 14px;
// color: #3774f6;
// font-weight: 400;
// }
// }
// .card-item3x {
// padding-top: 40px;
// }
// }
// .seconed-title {
// margin-top: 16px;
// font-size: 18px;
// color: #000000;
// font-weight: bold;
// }
// .month-list {
// height: calc(100vh - 166px - 25px - 16px);
// overflow: auto;
// .month-record-item {
// margin-bottom: 24px;
// &:last-of-type {
// margin: 0;
// }
// .inspect-list {
// display: flex;
// flex-wrap: wrap;
// }
// }
// }
}
}
</style>
pages/login/login.vue
浏览文件 @ b4201cb5
<template>
<view class="content">
<view class="login_wrap">
<view class="top-module">
<image src="@/static/logo.png" alt="" />
<view class="title">杭州内网监管在线-运维在线</view>
</view>
<view class="form_wrap">
<view class="input_wrap">
<uni-easyinput
class="log-input"
v-model="person.user"
placeholder="请输入账号"
></uni-easyinput>
<uni-easyinput
class="log-input"
type="password"
v-model="person.pd"
placeholder="请输入密码"
></uni-easyinput>
</view>
<view class="login_btn" @click="login">
<view class="login_btn_text"> 登录 </view>
</view>
</view>
</view>
</view>
<view class="content">
<view class="login_wrap">
<view class="top-module">
<image src="@/static/logo.png" alt="" />
<view class="title">杭州内网监管在线-运维在线</view>
</view>
<view class="form_wrap">
<view class="input_wrap">
<uni-easyinput class="log-input" clearSize="0" v-model="person.user" prefixIcon="person"
placeholder="用户名"></uni-easyinput>
<uni-easyinput v-if="passwordVisible" class="log-input" prefixIcon="locked" clearSize="0" v-model="person.pd"
@iconClick="togglePasswordVisible" :placeholder="passwordPlaceholder" :passwordIcon="false"
:type="passwordVisible ? 'text' : 'password'"></uni-easyinput>
<uni-easyinput v-else class="log-input" prefixIcon="locked-filled" clearSize="0" v-model="person.pd"
@iconClick="togglePasswordVisible" :placeholder="passwordPlaceholder" :passwordIcon="false"
:type="passwordVisible ? 'text' : 'password'"></uni-easyinput>
</view>
<view class="login_btn" @click="login">
<view class="login_btn_text"> 登录 </view>
</view>
</view>
</view>
</view>
</template>
<script>
import getDateTime from "@/common/getdateTime.js";
import {
SYNCHRONIZE_DATA_PAD,
checkAndCreateDirectory,
createFileWithPlusIO,
TEST,
TEST_2X,
USER_FILE_NAME,
getUserList,
} from "@/utils/systemCofig";
import {
LOG_TYPE_ENUM,
getLogContent,
addLog,
readDirectoryData,
readLogData,
} from "@/utils/IoReadingAndWriting.js";
import moment from "moment";
import { Base64 } from "js-base64";
export default {
components: {
},
data() {
return {
person: {
// user: "bjqxj",
// pd: "JF85250920",
user: "admin", // 超管账号
pd: "JF123456",
},
backButtonPress: 0,
personList: [],
};
},
created() {},
onShow() {},
mounted() {
this.$store.commit("SET_DARF_DATA", {});
this.$store.commit("SET_LOG_LIST", []);
this.$store.commit("SET_ALL_DATA", []);
},
// 定义返回退出
onBackPress(options) {
this.backButtonPress++;
if (this.backButtonPress > 1) {
uni.setStorageSync("oper_record", this.$store.state.oper_record);
uni.setStorageSync("all_data", this.$store.state.all_data);
uni.setStorageSync("now_user", this.$store.state.now_user);
uni.setStorageSync(
"last_time",
this.$store.state.now_user.LastSynchronizationTime
);
plus.runtime.quit();
} else {
plus.nativeUI.toast("再划一次退出应用");
}
setTimeout(function () {
this.backButtonPress = 0;
}, 1000);
return true;
},
methods: {
// 点击登录
login() {
getUserList().then((personList) => {
this.personList = personList;
// 是否输入账号密码
if (this.person.user && this.person.pd) {
let key = null;
const obj = this.personList.some((item, index) => {
if (item.user == this.person.user) {
key = index;
return true;
}
});
uni.showLoading({
title: "加载中",
});
// 存在该账号
if (obj) {
// 判断账号密码是否正确
if (
this.person.user == this.personList[key].user &&
this.person.pd == this.personList[key].passWord
) {
const userInfo = this.personList[key];
this.$store.commit("SET_USER", userInfo);
uni.setStorageSync("now_user", userInfo);
uni.setStorageSync("last_time", userInfo.LastSynchronizationTime || "");
uni.navigateTo({
url: "/pages/home/home",
});
uni.showToast({
title: "登录成功",
icon: "none",
duration: 2000,
});
readLogData()
.then((res) => {
const log_list = res;
// 更新日志信息
const logContent = getLogContent(LOG_TYPE_ENUM.login);
log_list.push(logContent);
this.$store.commit("SET_LOG_LIST", log_list);
addLog(log_list);
uni.hideLoading();
})
.catch((error) => {
if (error.code == 0) {
uni.showToast({
title: error.msg,
icon: "none",
duration: 2000,
});
return;
}
const log_list = [];
// 更新日志信息
const logContent = getLogContent(LOG_TYPE_ENUM.login);
log_list.push(logContent);
this.$store.commit("SET_LOG_LIST", log_list);
addLog(log_list);
});
// 密码不正确
} else {
uni.showToast({
title: "密码错误，请重试",
icon: "none",
duration: 2000,
});
uni.hideLoading();
}
// 不存在该账号
} else {
uni.showToast({
title: "您无权登录，请联系管理员处理",
icon: "none",
duration: 2000,
});
uni.hideLoading();
}
// 未输入账号或者密码
} else {
uni.showToast({
title: "账号密码不能为空",
icon: "none",
duration: 2000,
});
}
});
},
},
};
import getDateTime from "@/common/getdateTime.js";
import {
SYNCHRONIZE_DATA_PAD,
checkAndCreateDirectory,
createFileWithPlusIO,
TEST,
TEST_2X,
USER_FILE_NAME,
getUserList,
} from "@/utils/systemCofig";
import {
LOG_TYPE_ENUM,
getLogContent,
addLog,
readDirectoryData,
readLogData,
} from "@/utils/IoReadingAndWriting.js";
import moment from "moment";
import {
Base64
} from "js-base64";
export default {
components: {},
data() {
return {
person: {
// user: "bjqxj",
// pd: "JF85250920",
user: "admin", // 超管账号
pd: "JF123456",
},
backButtonPress: 0,
personList: [],
passwordVisible: false, // 是否显示密码
};
},
computed: {
// 动态密码输入框 placeholder
passwordPlaceholder() {
return this.passwordVisible ? "密码" : "********";
},
},
created() {},
onShow() {},
mounted() {
this.$store.commit("SET_DARF_DATA", {});
this.$store.commit("SET_LOG_LIST", []);
this.$store.commit("SET_ALL_DATA", []);
},
// 定义返回退出
onBackPress(options) {
this.backButtonPress++;
if (this.backButtonPress > 1) {
uni.setStorageSync("oper_record", this.$store.state.oper_record);
uni.setStorageSync("all_data", this.$store.state.all_data);
uni.setStorageSync("now_user", this.$store.state.now_user);
uni.setStorageSync(
"last_time",
this.$store.state.now_user.LastSynchronizationTime
);
plus.runtime.quit();
} else {
plus.nativeUI.toast("再划一次退出应用");
}
setTimeout(function() {
this.backButtonPress = 0;
}, 1000);
return true;
},
methods: {
// 切换密码显示/隐藏
togglePasswordVisible() {
this.passwordVisible = !this.passwordVisible;
},
// 点击登录
login() {
getUserList().then((personList) => {
this.personList = personList;
// 是否输入账号密码
if (this.person.user && this.person.pd) {
let key = null;
const obj = this.personList.some((item, index) => {
if (item.user == this.person.user) {
key = index;
return true;
}
});
uni.showLoading({
title: "加载中",
});
// 存在该账号
if (obj) {
// 判断账号密码是否正确
if (
this.person.user == this.personList[key].user &&
this.person.pd == this.personList[key].passWord
) {
const userInfo = this.personList[key];
this.$store.commit("SET_USER", userInfo);
uni.setStorageSync("now_user", userInfo);
uni.setStorageSync("last_time", userInfo.LastSynchronizationTime || "");
uni.navigateTo({
url: "/pages/home/home",
});
uni.showToast({
title: "登录成功",
icon: "none",
duration: 2000,
});
readLogData()
.then((res) => {
const log_list = res;
// 更新日志信息
const logContent = getLogContent(LOG_TYPE_ENUM.login);
log_list.push(logContent);
this.$store.commit("SET_LOG_LIST", log_list);
addLog(log_list);
uni.hideLoading();
})
.catch((error) => {
if (error.code == 0) {
uni.showToast({
title: error.msg,
icon: "none",
duration: 2000,
});
return;
}
const log_list = [];
// 更新日志信息
const logContent = getLogContent(LOG_TYPE_ENUM.login);
log_list.push(logContent);
this.$store.commit("SET_LOG_LIST", log_list);
addLog(log_list);
});
// 密码不正确
} else {
uni.showToast({
title: "密码错误，请重试",
icon: "none",
duration: 2000,
});
uni.hideLoading();
}
// 不存在该账号
} else {
uni.showToast({
title: "您无权登录，请联系管理员处理",
icon: "none",
duration: 2000,
});
uni.hideLoading();
}
// 未输入账号或者密码
} else {
uni.showToast({
title: "账号密码不能为空",
icon: "none",
duration: 2000,
});
}
});
},
},
};
</script>
<style scoped lang="less">
.content {
width: 100vw;
height: 100vh;
// background-color: red;
background-image: url("../../static/img/logbg.png");
background-size: 100% 100%;
background-repeat: no-repeat;
display: flex;
justify-content: center;
align-items: center;
.top-module {
width: 350px;
margin-bottom: 48px;
text-align: center;
image{
width: 88px;
height: 88px;
}
.title {
font-size: 26px;
color: #000000;
line-height: 34px;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.16);
}
}
.login_wrap {
}
.log-input {
width: 350px;
margin-bottom: 24px;
background: #fff;
color: #4a4a4a;
}
/deep/.is-input-border {
border-radius: 2px !important;
height: 40px !important;
}
/deep/.uni-easyinput__content {
background-color: rgba(0, 0, 0, 0) !important;
}
/deep/.uni-easyinput__placeholder-class {
color: #4a4a4a;
}
/deep/.is-focused {
border: 1px solid #4a4a4a !important;
.uniui-eye-filled {
color: #4a4a4a !important;
}
.uniui-eye-slash-filled {
color: #4a4a4a !important;
}
}
/deep/.uni-input-input {
color: #4a4a4a !important;
}
/deep/.uniui-clear {
color: #4a4a4a !important;
}
.login_btn {
background: #3774f6;
box-shadow: 0px 2px 14px 0px rgba(51, 104, 246, 0.24);
border-radius: 3px;
.login_btn_text {
width: 350px;
height: 40px;
background-color: #3774f6;
box-shadow: 0px 1px 4px 0px rgba(84, 116, 232, 0.16);
border-radius: 2px;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
}
}
}
</style>
.content {
width: 100vw;
height: 100vh;
// background-color: red;
background-image: url("../../static/img/logbg.png");
background-size: 100% 100%;
background-repeat: no-repeat;
display: flex;
justify-content: center;
align-items: center;
.top-module {
width: 350px;
margin-bottom: 48px;
text-align: center;
image {
width: 88px;
height: 88px;
}
.title {
font-size: 26px;
color: #000000;
line-height: 34px;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.16);
}
}
.login_wrap {}
.log-input {
width: 350px;
margin-bottom: 24px;
background: #fff;
color: #4a4a4a;
}
/deep/.is-input-border {
border-radius: 2px !important;
height: 40px !important;
}
/deep/.uni-easyinput__content {
background-color: rgba(0, 0, 0, 0) !important;
}
/deep/.uni-easyinput__placeholder-class {
color: #4a4a4a;
}
/deep/.is-focused {
border: 1px solid #4a4a4a !important;
.uniui-eye-filled {
color: #4a4a4a !important;
}
.uniui-eye-slash-filled {
color: #4a4a4a !important;
}
}
/deep/.uni-input-input {
color: #4a4a4a !important;
}
/deep/.uniui-clear {
color: #4a4a4a !important;
}
.login_btn {
background: #3774f6;
box-shadow: 0px 2px 14px 0px rgba(51, 104, 246, 0.24);
border-radius: 3px;
.login_btn_text {
width: 350px;
height: 40px;
background-color: #3774f6;
box-shadow: 0px 1px 4px 0px rgba(84, 116, 232, 0.16);
border-radius: 2px;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
}
}
}
</style>
\ No newline at end of file
static/img/logout.svg 0 → 100644
浏览文件 @ b4201cb5
<?xml version="1.0" encoding="UTF-8"?>
<svg width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>退出</title>
<g id="退出" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<rect id="矩形" transform="translate(9.000000, 9.000000) rotate(-90.000000) translate(-9.000000, -9.000000) " x="0" y="0" width="18" height="18"></rect>
<g id="编组" transform="translate(9.000000, 9.000000) rotate(-360.000000) translate(-9.000000, -9.000000) translate(0.886547, 0.500000)" fill="#000000" fill-rule="nonzero">
<path d="M11.4927047,3.25291471 C11.2561536,3.11067346 11.1134561,2.8530386 11.1183651,2.57705868 C11.123274,2.30107876 11.2750437,2.0486817 11.5165038,1.91494303 C11.7579639,1.78120437 12.0524309,1.78644218 12.2889821,1.92868344 C14.733303,3.39463547 16.2284175,6.03633435 16.2269051,8.88654803 C16.2269051,13.3674916 12.5943956,17 8.11345197,17 C3.63250835,17 0,13.3674916 0,8.88654803 C0,6.00221586 1.51837458,3.37983228 3.94603532,1.92346765 C4.31219178,1.70406183 4.78688381,1.82302673 5.00628963,2.1891832 C5.22569545,2.55533967 5.10673055,3.03003169 4.74057408,3.24943751 C2.75744384,4.43524764 1.54395849,6.5765111 1.5456126,8.88712757 C1.5456126,12.5138406 4.48557987,15.4543874 8.11345197,15.4543874 C11.7413241,15.4543874 14.6812913,12.5138406 14.6812913,8.88654803 C14.6812913,6.55335106 13.4561601,4.43342197 11.4927047,3.25349424 L11.4927047,3.25291471 Z M8.11345197,0 C8.53998773,0 8.8859685,0.345980773 8.8859685,0.773096066 L8.8859685,6.9543874 C8.8859685,7.3810365 8.54010107,7.72690393 8.11345197,7.72690393 C7.68680287,7.72690393 7.34093543,7.3810365 7.34093543,6.9543874 L7.34093543,0.773096066 C7.34093543,0.345980773 7.68691621,0 8.11345197,0 L8.11345197,0 Z" id="形状"></path>
</g>
</g>
</svg>
\ No newline at end of file
static/logo.png
查看替换文件 @ 19d9eb70 浏览文件 @ b4201cb5
static/logo.png

18.8 KB | W: | H:

static/logo.png

416.9 KB | W: | H:

static/logo.png
static/logo.png
static/logo.png
static/logo.png
  • 2-up
  • Swipe
  • Onion skin
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论