Sfoglia il codice sorgente

Merge remote-tracking branch 'origin/master'

master
yangfuda 1 settimana fa
parent
commit
ab07dafb58
21 ha cambiato i file con 846 aggiunte e 6 eliminazioni
  1. +1
    -0
      package.json
  2. +19
    -0
      src/api/app/index.js
  3. BIN
      src/assets/images/app/banner.png
  4. BIN
      src/assets/images/app/index_bg.png
  5. BIN
      src/assets/images/app/login_bg.png
  6. BIN
      src/assets/images/app/note_bg.png
  7. BIN
      src/assets/images/app/title_bg.png
  8. BIN
      src/assets/images/app/user_bg.png
  9. BIN
      src/assets/images/app/user_header.png
  10. BIN
      src/assets/images/app/user_icon_01.png
  11. BIN
      src/assets/images/app/user_icon_02.png
  12. BIN
      src/assets/images/app/user_icon_03.png
  13. +4
    -0
      src/main.js
  14. +7
    -2
      src/permission.js
  15. +37
    -1
      src/router/index.js
  16. +6
    -1
      src/utils/request.js
  17. +167
    -0
      src/views/app/index.vue
  18. +219
    -0
      src/views/app/list.vue
  19. +243
    -0
      src/views/app/login.vue
  20. +141
    -0
      src/views/app/user.vue
  21. +2
    -2
      vue.config.js

+ 1
- 0
package.json Vedi File

@@ -42,6 +42,7 @@
"screenfull": "5.0.2",
"sortablejs": "1.10.2",
"splitpanes": "2.4.1",
"vant": "^2.13.9",
"vue": "2.6.12",
"vue-count-to": "1.0.13",
"vue-cropper": "0.5.5",


+ 19
- 0
src/api/app/index.js Vedi File

@@ -0,0 +1,19 @@
import request from '@/utils/request'

// 查询首页菜单
export function getMenuApp(query) {
return request({
url: '/system/menuapp/menus',
method: 'get',
params: query
})
}

// 新增公告
export function addNotice(data) {
return request({
url: '/system/notice',
method: 'post',
data: data
})
}

BIN
src/assets/images/app/banner.png Vedi File

Prima Dopo
Larghezza: 690  |  Altezza: 300  |  Dimensione: 347 KiB

BIN
src/assets/images/app/index_bg.png Vedi File

Prima Dopo
Larghezza: 750  |  Altezza: 700  |  Dimensione: 327 KiB

BIN
src/assets/images/app/login_bg.png Vedi File

Prima Dopo
Larghezza: 375  |  Altezza: 350  |  Dimensione: 59 KiB

BIN
src/assets/images/app/note_bg.png Vedi File

Prima Dopo
Larghezza: 690  |  Altezza: 72  |  Dimensione: 10 KiB

BIN
src/assets/images/app/title_bg.png Vedi File

Prima Dopo
Larghezza: 98  |  Altezza: 42  |  Dimensione: 3.2 KiB

BIN
src/assets/images/app/user_bg.png Vedi File

Prima Dopo
Larghezza: 750  |  Altezza: 1333  |  Dimensione: 724 KiB

BIN
src/assets/images/app/user_header.png Vedi File

Prima Dopo
Larghezza: 120  |  Altezza: 120  |  Dimensione: 7.7 KiB

BIN
src/assets/images/app/user_icon_01.png Vedi File

Prima Dopo
Larghezza: 44  |  Altezza: 44  |  Dimensione: 1.4 KiB

BIN
src/assets/images/app/user_icon_02.png Vedi File

Prima Dopo
Larghezza: 44  |  Altezza: 44  |  Dimensione: 815 B

BIN
src/assets/images/app/user_icon_03.png Vedi File

Prima Dopo
Larghezza: 44  |  Altezza: 44  |  Dimensione: 1.3 KiB

+ 4
- 0
src/main.js Vedi File

@@ -35,6 +35,9 @@ import ImagePreview from "@/components/ImagePreview"
import DictTag from '@/components/DictTag'
// 字典数据组件
import DictData from '@/components/DictData'
// Vant 引用
import Vant from 'vant';
import 'vant/lib/index.css';

// 全局方法挂载
Vue.prototype.getDicts = getDicts
@@ -57,6 +60,7 @@ Vue.component('FileUpload', FileUpload)
Vue.component('ImageUpload', ImageUpload)
Vue.component('ImagePreview', ImagePreview)

Vue.use(Vant)
Vue.use(directive)
Vue.use(plugins)
DictData.install()


+ 7
- 2
src/permission.js Vedi File

@@ -9,7 +9,7 @@ import { isRelogin } from '@/utils/request'

NProgress.configure({ showSpinner: false })

const whiteList = ['/login', '/register']
const whiteList = ['/login', '/register', '/app/login', '/app/list']

const isWhiteList = (path) => {
return whiteList.some(pattern => isPathMatch(pattern, path))
@@ -55,11 +55,16 @@ router.beforeEach((to, from, next) => {
}
} else {
// 没有token
console.log(to.fullPath)
if (isWhiteList(to.path)) {
// 在免登录白名单,直接进入
next()
} else {
next(`/login?redirect=${encodeURIComponent(to.fullPath)}`) // 否则全部重定向到登录页
if (to.path.indexOf('/app/') > -1){
next(`/app/login?redirect=${encodeURIComponent(to.fullPath)}`) // 否则全部重定向到登录页
}else{
next(`/login?redirect=${encodeURIComponent(to.fullPath)}`) // 否则全部重定向到登录页
}
NProgress.done()
}
}


+ 37
- 1
src/router/index.js Vedi File

@@ -87,7 +87,43 @@ export const constantRoutes = [
meta: { title: '个人中心', icon: 'user' }
}
]
}
},
{ //登录页
path: '/app/login',
name: 'appLogin',
meta: {
title: '登录',
hidden: true,
},
component: (resolve) => require(['@/views/app/login'], resolve)
},
{ //首页
path: '/app/index',
name: 'appIndex',
meta: {
title: '首页',
hidden: true,
},
component: (resolve) => require(['@/views/app/index'], resolve)
},
{ //用户页
path: '/app/user',
name: 'appUser',
meta: {
title: '首页',
hidden: true,
},
component: (resolve) => require(['@/views/app/user'], resolve)
},
{ //用户页
path: '/app/list',
name: 'appList',
meta: {
title: '列表',
hidden: true,
},
component: (resolve) => require(['@/views/app/list'], resolve)
},
]

// 动态路由,基于用户权限动态去加载


+ 6
- 1
src/utils/request.js Vedi File

@@ -81,13 +81,18 @@ service.interceptors.response.use(res => {
if (res.request.responseType === 'blob' || res.request.responseType === 'arraybuffer') {
return res.data
}
console.log(location)
if (code === 401) {
if (!isRelogin.show) {
isRelogin.show = true
MessageBox.confirm('登录状态已过期,您可以继续留在该页面,或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => {
isRelogin.show = false
store.dispatch('LogOut').then(() => {
location.href = '/index'
if (location.pathname.indexOf('/app/') > -1){
location.href = '/app/index'
}else{
location.href = '/index'
}
})
}).catch(() => {
isRelogin.show = false


+ 167
- 0
src/views/app/index.vue Vedi File

@@ -0,0 +1,167 @@
<template>
<div class="home_wrapper">

<div class="header">
<div class="left">
<div class="avatar"><img src="../../assets/images/app/user_header.png" alt=""></div>
<div class="info">
<p>张晋升</p>
<p>常家围子村委会</p>
</div>
</div>
<van-icon name="setting" size="25" @click="$router.push({ path: '/app/user' })" />
</div>

<img src="../../assets/images/app/banner.png" width="100%" style="margin: 2vh 0;" alt="">

<van-notice-bar scrollable text="技术是开发它的人的共同灵魂。" color="#000000" >
<p slot="left-icon" class="notice_tt">通知</p>
</van-notice-bar>

<div class="content">
<p class="title">服务功能</p>
<div class="flex-main">
<div>
<img src="../../assets/images/app/user_header.png" alt="">
<p>地图管理</p>
</div>
<div>
<img src="../../assets/images/app/user_header.png" alt="">
<p>地图管理</p>
</div>
<div>
<img src="../../assets/images/app/user_header.png" alt="">
<p>地图管理</p>
</div>
<div>
<img src="../../assets/images/app/user_header.png" alt="">
<p>地图管理</p>
</div>
<div>
<img src="../../assets/images/app/user_header.png" alt="">
<p>地图管理</p>
</div>
</div>
</div>

</div>
</template>

<script>
import { getMenuApp } from "@/api/app/index";
import Cookies from "js-cookie";
export default {
name: "appIndex",
data() {
return {

};
},
created() {
this.getMenuApp();
},
methods: {
getMenuApp(){
getMenuApp().then((res) => {

});
}
},
};
</script>

<style scoped lang="scss">
p{margin: 0;}
.home_wrapper{
width: 100vw;
min-height: 100vh;
background: #F6F9FB url('../../assets/images/app/index_bg.png') no-repeat center top;
background-size: 100% auto;
padding: 5vh 4vw 0;
}
.header{
display: flex;
align-items: self-start;
justify-content: space-between;
.left{
display: flex;
}
.avatar{
width: 18vw;
height: 18vw;
overflow: hidden;
img{
width: 100%;
height: 100%;
}
}
.info{
display: flex;
flex-direction: column;
justify-content: space-evenly;
margin-left: 15px;
p{
&:nth-child(1){
font-weight: bold;
font-size: 2vh;
}
&:nth-child(2){
font-size: 1.65vh;
color: #666666;
}
}
}
i{
margin-top: 1vh;
}
}

.van-notice-bar{
background: #ffffff url("../../assets/images/app/note_bg.png") no-repeat center;
border-radius: 5px;
}
.notice_tt{
font-size: 2vh;
font-weight: bold;
background: -webkit-linear-gradient(#53E4A5, #24DBDB);
-webkit-background-clip: text;
color: transparent;
}

.content{
background: linear-gradient( 186deg, #DFFFF1 0%, #FFFFFF 100%);
border-radius: 12px 12px 12px 12px;
padding: 4vw;
margin-top: 2vh;
border: 2px solid #FFFFFF;
.title{
background: url("../../assets/images/app/title_bg.png") no-repeat left 10px;
font-size: 2.2vh;
font-weight: bold;
padding-bottom: 10px;
color: #0D131A;
font-family: Source Han Sans CN, Source Han Sans CN;
}
.flex-main{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
div{
width: 22%;
display: flex;
flex-direction: column;
align-items: center;
margin-top: 15px;
img{
width: 80%;
}
p{
color: #111311;
margin-top: 5px;
font-size: 1.6vh;
}
}
}
}

</style>

+ 219
- 0
src/views/app/list.vue Vedi File

@@ -0,0 +1,219 @@
<template>
<div class="home_wrapper">
<van-nav-bar
title="土地列表管理"
left-arrow
placeholder
safe-area-inset-top
@click-left="onClickLeft"
/>

<div class="search_box">
<div class="left">
<p>已清查<van-icon name="play" /></p>
<van-field v-model="value" left-icon="smile-o" placeholder="请输入用户名" />
</div>
<van-button type="primary" round >搜索</van-button>
</div>

<div class="list_main">
<van-list
v-model="loading"
:finished="finished"
finished-text="没有更多了"
@load="getList"
>
<!--1-->
<van-swipe-cell right-width="200" class="item" v-for="(item,index) in 10" :key="index">
<div class="item_box" @click="$router.push({name:'',query:{id:item.id}})">
<div class="head_block">
<div class="title">334656556565</div>
<div class="describe">已清查</div>
</div>
<div class="order_block">
<div class="order">名称名称名称名称名称名</div>
<div class="describe">67.08</div>
</div>
</div>
<template #right>
<div style="background-color: #29D2AF;height: 100%">属性<br/>修改</div>
<div style="background-color: #0E82EB;height: 100%">经营<br/>修改</div>
<div style="background-color: #ee0a24;height: 100%">删除</div>
</template>
</van-swipe-cell>

</van-list>
</div>

</div>
</template>

<script>
// import { getMenuApp } from "@/api/app/index";
import Cookies from "js-cookie";
export default {
name: "appList",
data() {
return {
loading: false,
finished: false,
};
},
created() {

},
methods: {
getList(){

}
},
};
</script>

<style scoped lang="scss">
p{margin: 0;}
.home_wrapper{
width: 100vw;
min-height: 100vh;
background: #F6F9FB;
}
.van-nav-bar{
background: linear-gradient( 173deg, #91E2D3 0%, #CDFCF0 100%);
::v-deep.van-icon{
color: #000000;
}
}
.list_main{
padding:0 3vw;
.item{
border-radius: 10px;
background: #fff;
box-shadow: 4px 6px 5px rgba(63, 68, 75, 0.1);
margin-bottom: 20px;
.item_box{
padding:15px;
}
.head_block{
display: flex;
align-items: center;
width: 100%;
.title{
flex:1;
font-size: 16px;
color: #252525;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding-right: 20px;
}
.describe{
font-size: 14px;
color: #29D2AF;
}
}
.order_block{
display: flex;
align-items: center;
width: 100%;
margin-top: 10px;
.order{
flex: 1;
font-size: 16px;
color: #666666;
}
.describe{
font-size: 22px;
color: #29D2AF;
}
}
.function_block{
height: 46px;
display: flex;
align-items: center;
.time{
display: flex;
flex: 1;
align-items: center;
font-size: 24px;
color: #858585;
.icon{
width: 25px;
height: 25px;
display: block;
margin-right: 8px;
}
}
.state{
/*flex: 1;*/
display: flex;
justify-content: center;
align-items: center;
&.sell{
color: #f69600;
}
&.scrap{
color: #858585;
}
&.normal{
color: #68c000;
}
}
.value{
flex:1;
display: flex;
align-items: center;
justify-content:flex-end;
font-size: 24px;
color: #858585;
.amount{
color: #eb1616;
}
}
}

}
}
::v-deep .van-swipe-cell__right{
display: flex;
align-items: center;
width: 200PX;
margin-left: 5PX;
a,div{
margin: 0;
display: flex;
align-items: center;
justify-content: center;
color: #ffffff;
font-size: 14PX;
height: 100%;
flex: 1;
}
}

.search_box{
display: flex;
align-items: center;
justify-content: space-between;
width: 94%;
margin: 2vh auto;
.left{
display: flex;
align-items: center;
flex: 1;
background-color: #ffffff;
border-radius: 50vh;
padding-left: 6%;
overflow: hidden;
margin-right: 3vw;
}
p{
flex-shrink: 0;
}
button{
flex-shrink: 0;
background: linear-gradient( 271deg, #53E4A5 0%, #24DBDB 100%);
border: none;
}
}

</style>

+ 243
- 0
src/views/app/login.vue Vedi File

@@ -0,0 +1,243 @@
<template>
<div class="home_wrapper">
<div class="focus_head">
<div class="title">
<p>Hello</p>
<p>欢迎登录资源清查</p>
</div>
</div>

<div style="position:relative;">
<van-form @submit="handleLogin">
<div class="login_from">
<van-field
v-model="formData.username"
placeholder="请输入手机号/账号"
left-icon="contact-o"
:rules="[{ required: true, message:'' }]"
/>
<van-field
v-model="formData.password"
type="password"
left-icon="edit"
style="margin-top: 20px"
placeholder="请输入密码"
:rules="[{ required: true, message:'' }]"
/>
<div style="display: flex;width: 90%;margin: 20px auto 0;">
<van-field
v-model="formData.code"
left-icon="shield-o"
center
clearable
placeholder="图形验证码"
/>
<div style="border-radius: 100vh;width: 120px;margin-left: 20px;overflow: hidden;flex-shrink: 0;">
<img style="width: 120px;display: block;transform: scale(1.1);" :src="codeUrl" @click="getCode" />
</div>
</div>
<div style="display: flex;width: 90%;margin: 20px auto 0;">
<van-checkbox v-model="formData.rememberMe" shape="square">记住密码</van-checkbox>
</div>
</div>
<div style="margin: 0px 16px 16px;border-radius: 100vh;overflow: hidden;">
<van-button
class="btn"
color="linear-gradient(to right, #53E4A5, #24DBDB)"
round
block
type="info"
native-type="submit"
:loading="loading"
>登录</van-button>
</div>

</van-form>
</div>

<p class="copy">中农融信北京科技股份有限公司</p>
</div>
</template>

<script>
import { getCodeImg, getSmsCode } from "@/api/login";
import Cookies from "js-cookie";
import { encrypt, decrypt } from "../../utils/jsencrypt";
//引用wx sdk
// import wx from "weixin-js-sdk";
export default {
name: "appLogin",
data() {
return {
formData: {
username: "", //账号
password: "", //密码
// username:'',
// password:'',
code: null, //图片验证码
uuid: null, //识别uuid
mobile: null, //手机号
smsCode: null, //短信验证码
rememberMe:false
},
loading: false,
codeUrl: "", //验证码
isSmsLogin: false, //是否手机验证码
computeTime: 0,
height:0,
show:true
};
},
created() {
this.getCode();
this.height = document.body.clientHeight
this.getCookie();
//调用微信公众号方法
// wx.config({
// debug: true, // 开启调试模式,
// appId: res.appId, // 必填,企业号的唯一标识,此处填写企业号corpid
// timestamp: res.timestamp, // 必填,生成签名的时间戳
// nonceStr: res.nonceStr, // 必填,生成签名的随机串
// signature: res.signature,// 必填,签名,见附录1
// jsApiList: ['scanQRCode'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
// });
//分享要用encodeURIComponent()方法
},
methods: {
showPassword(){
this.show = !this.show;
},
getCode() {
getCodeImg().then((res) => {
this.formData.uuid = res.uuid;
this.codeUrl = "data:image/gif;base64," + res.img;
});
},
getCookie() {
const username = Cookies.get("username");
const password = Cookies.get("password");
const rememberMe = Cookies.get("rememberMe");
this.formData = {
username: username === undefined ? this.formData.username : username,
password:
password === undefined ? this.formData.password : decrypt(password),
rememberMe: rememberMe === undefined ? false : Boolean(rememberMe),
};
},
getSmsCode() {
if (!this.computeTime) {
let myreg = /^[1][3,4,5,7,8,9][0-9]{9}$/;
if (!myreg.test(this.formData.mobile)) {
this.$dialog.alert({
message: '手机号格式不正确',
});
return false;
}
getSmsCode(this.formData.mobile).then((res) => {
if (res.code === 200) {
this.$dialog.alert({
message: '验证码已发送',
});
this.loginForm.uuid = res.uuid;
this.computeTime = 60;
this.timer = setInterval(() => {
this.computeTime--;
if (this.computeTime <= 0) {
clearInterval(this.timer);
}
}, 1000);
}
});
}
},
handleLogin(values) {
if (this.formData.rememberMe) {
Cookies.set("username", this.formData.username, { expires: 30 });
Cookies.set("password", encrypt(this.formData.password), { expires: 30 });
Cookies.set("rememberMe", this.formData.rememberMe, { expires: 30 });
} else {
Cookies.remove("username");
Cookies.remove("password");
Cookies.remove("rememberMe");
}
//账号密码登录
if (this.formData.username == "") {
this.$dialog.alert({
message: '账号不能为空',
});
return false;
} else if (this.formData.password == "") {
this.$dialog.alert({
message: '密码不能为空',
});
return false;
} else if (!this.formData.code) {
this.$dialog.alert({
message: '图片验证码不能为空',
});
return false;
}
this.$store
.dispatch("Login", this.formData)
.then(() => {
this.$router.push({ name: 'appIndex' || "/" }).catch(() => {});
})
.catch(() => {
this.loading = false;
this.getCode();
});
},
},
};
</script>

<style scoped lang="scss">
::v-deep .van-checkbox__label{
color: #24DBDB;
}
.home_wrapper{
width: 100vw;
min-height: 100vh;
background: #ffffff url('../../assets/images/app/login_bg.png') no-repeat center top;
background-size: 100% auto;
.focus_head{
display: flex;
align-items: center;
justify-content: space-between;
padding: 8vh 0 0 3vw;
.title{
color: #06101C;
font-size: 4.5vh;
p{
margin-bottom: 1vh;
}
p:nth-child(1){
font-weight: bold;
}
p:nth-child(2){
font-size: 3vh;
}
}
}
.login_from{
width: 94%;
background: #ffffff;
background-size: 100% 100%;
margin: 30PX auto 0;
padding:20px 0px 50px;
border-radius: 20PX 20PX 0 0;
::v-deep.van-cell{
background: #eaeef6;
border-radius: 100vh;
width: 90%;
margin: 0 auto;
}
}
.copy{
text-align: center;
color: #999999;
margin-top: 20vh;
}
}

</style>

+ 141
- 0
src/views/app/user.vue Vedi File

@@ -0,0 +1,141 @@
<template>
<div class="home_wrapper">

<van-icon name="arrow-left" size="30" @click="goBack" />

<div class="header">
<div class="left">
<div class="avatar"><img src="../../assets/images/app/user_header.png" alt=""></div>
<div class="info">
<p>张晋升</p>
<p>常家围子村委会</p>
</div>
</div>
</div>

<div class="content">
<van-cell title="用户信息" is-link center :border="false">
<template slot="icon">
<img src="../../assets/images/app/user_icon_01.png" width="25" alt="">
</template>
</van-cell>
<van-cell title="修改密码" is-link center :border="false">
<template slot="icon">
<img src="../../assets/images/app/user_icon_02.png" width="25" alt="">
</template>
</van-cell>
<van-cell title="退出登录" is-link center :border="false">
<template slot="icon">
<img src="../../assets/images/app/user_icon_03.png" width="25" alt="">
</template>
</van-cell>
</div>

</div>
</template>

<script>
import Cookies from "js-cookie";
export default {
name: "appUser",
data() {
return {

};
},
created() {

},
methods: {
goBack(){
history.go(-1)
}
},
};
</script>

<style scoped lang="scss">
p{margin: 0;}
.home_wrapper{
width: 100vw;
min-height: 100vh;
background: #F6F9FB url('../../assets/images/app/user_bg.png') no-repeat center top;
background-size: 100% auto;
padding: 5vh 4vw 0;
}
.header{
display: flex;
align-items: self-start;
justify-content: space-between;
margin-top: 3vh;
.left{
display: flex;
}
.avatar{
width: 18vw;
height: 18vw;
overflow: hidden;
img{
width: 100%;
height: 100%;
}
}
.info{
display: flex;
flex-direction: column;
justify-content: space-evenly;
margin-left: 15px;
p{
&:nth-child(1){
font-weight: bold;
font-size: 2vh;
}
&:nth-child(2){
font-size: 1.65vh;
color: #666666;
}
}
}
i{
margin-top: 1vh;
}
}

.content{
background: #ffffff;
border-radius: 12px 12px 12px 12px;
padding: 4vw 0;
margin-top: 4vh;
border: 2px solid #FFFFFF;
overflow: hidden;
.title{
background: url("../../assets/images/app/title_bg.png") no-repeat left 10px;
font-size: 2.2vh;
font-weight: bold;
padding-bottom: 10px;
color: #0D131A;
font-family: Source Han Sans CN, Source Han Sans CN;
}
.flex-main{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
div{
width: 22%;
display: flex;
flex-direction: column;
align-items: center;
margin-top: 15px;
img{
width: 80%;
}
p{
color: #111311;
margin-top: 5px;
font-size: 1.6vh;
}
}
}
}

</style>

+ 2
- 2
vue.config.js Vedi File

@@ -9,8 +9,8 @@ const CompressionPlugin = require('compression-webpack-plugin')

const name = process.env.VUE_APP_TITLE

const baseUrl = 'http://localhost:8080' // 后端接口
//const baseUrl = 'http://192.168.0.108:8080' // 后端接口 zzl
//const baseUrl = 'http://localhost:8080' // 后端接口
const baseUrl = 'http://192.168.0.108:8080' // 后端接口 zzl

const port = process.env.port || process.env.npm_config_port || 80 // 端口



Caricamento…
Annulla
Salva