15 changed files with 534 additions and 378 deletions
@ -0,0 +1,12 @@
|
||||
import request from '@/utils/request' |
||||
|
||||
/** |
||||
* 获取字典 |
||||
*/ |
||||
export function getDictBatchByType(params) { |
||||
return request({ |
||||
url: `/system/dict-data/lists_dict_type`, |
||||
method: 'GET', |
||||
params |
||||
}) |
||||
} |
||||
@ -1,60 +1,82 @@
|
||||
<template> |
||||
<view class="container"> |
||||
<u--image src="/static/favicon.png" width="180px" height="80px" mode="aspectFit" :fade="true" duration="450"></u--image> |
||||
<text class="title">智慧生态</text> |
||||
</view> |
||||
<view class="container"> |
||||
<u--image |
||||
src="/static/favicon.png" |
||||
width="180px" |
||||
height="80px" |
||||
mode="aspectFit" |
||||
:fade="true" |
||||
duration="450" |
||||
></u--image> |
||||
<text class="title">智慧生态</text> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
name: 'Login', |
||||
data() { |
||||
return {} |
||||
}, |
||||
onLoad() { |
||||
this.init() |
||||
}, |
||||
methods: { |
||||
init() { |
||||
uni.login({ |
||||
success: (res) => { |
||||
// 系统登录 |
||||
this.$store |
||||
.dispatch('Login', { |
||||
type: 34, |
||||
code: res.code, |
||||
state: 'default' |
||||
}) |
||||
.then((res) => { |
||||
console.log('store.login', res) |
||||
}) |
||||
} |
||||
}) |
||||
} |
||||
} |
||||
name: 'Login', |
||||
data() { |
||||
return {} |
||||
}, |
||||
onLoad() { |
||||
this.init() |
||||
}, |
||||
methods: { |
||||
init() { |
||||
uni.login({ |
||||
success: res => { |
||||
// 系统登录 |
||||
this.$store |
||||
.dispatch('Login', { |
||||
type: 34, |
||||
code: res.code, |
||||
state: 'default' |
||||
}) |
||||
.then(() => { |
||||
this.loginSuccess() |
||||
}) |
||||
} |
||||
}) |
||||
}, |
||||
loginSuccess() { |
||||
this.$store.dispatch('GetInfo').then(res => { |
||||
const { data } = res |
||||
const { user } = data |
||||
if (user.mobile) { |
||||
uni.switchTab({ |
||||
url: '/pages/index' |
||||
}) |
||||
} else { |
||||
uni.navigateTo({ |
||||
url: '/sub/owner/edit' |
||||
}) |
||||
} |
||||
}) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.container { |
||||
height: 100vh; |
||||
width: 100vw; |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
flex-flow: column nowrap; |
||||
gap: 20px; |
||||
background: linear-gradient(180deg, #02815b 0%, #114636 100%); |
||||
.icon { |
||||
width: 40vw; |
||||
filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.12)); |
||||
} |
||||
.title { |
||||
color: #fff; |
||||
text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.12); |
||||
font-size: 30px; |
||||
font-weight: 400; |
||||
letter-spacing: 2px; |
||||
} |
||||
height: 100vh; |
||||
width: 100vw; |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
flex-flow: column nowrap; |
||||
gap: 20px; |
||||
background: linear-gradient(180deg, #02815b 0%, #114636 100%); |
||||
.icon { |
||||
width: 40vw; |
||||
filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.12)); |
||||
} |
||||
.title { |
||||
color: #fff; |
||||
text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.12); |
||||
font-size: 30px; |
||||
font-weight: 400; |
||||
letter-spacing: 2px; |
||||
} |
||||
} |
||||
</style> |
||||
|
||||
@ -1,87 +1,205 @@
|
||||
<template> |
||||
<cs-page title="编辑个人信息"> |
||||
<view class="container"> |
||||
<!-- 我的头像 --> |
||||
<view class="section wd-flex wd-flex-row wd-justify-between wd-items-center"> |
||||
<text class="wd-font-800">我的头像</text> |
||||
<view class="wd-flex wd-flex-row wd-items-center" style="gap: 8px"> |
||||
<u-avatar src="/static/images/avatar.jpg"></u-avatar> |
||||
<u-icon name="arrow-right"></u-icon> |
||||
</view> |
||||
</view> |
||||
<!-- 真实姓名 --> |
||||
<view class="section wd-flex wd-flex-row wd-justify-between wd-items-center"> |
||||
<text class="wd-font-800">真实姓名</text> |
||||
<view class="wd-flex wd-flex-row wd-items-center" style="gap: 8px"> |
||||
<input class="wd-text-right" type="text" placeholder-class="txt" placeholder="请输入" v-model="form.realName" /> |
||||
<u-icon name="arrow-right" color="#99A1B7" size="16"></u-icon> |
||||
</view> |
||||
</view> |
||||
<!-- 用户性别 --> |
||||
<view class="section wd-flex wd-flex-row wd-justify-between wd-items-center"> |
||||
<text class="wd-font-800">用户性别</text> |
||||
<view class="wd-flex wd-flex-row wd-items-center" style="gap: 8px"> |
||||
<u-icon name="arrow-right" color="#99A1B7" size="16"></u-icon> |
||||
</view> |
||||
</view> |
||||
<!-- 手机号码 --> |
||||
<view class="section wd-flex wd-flex-row wd-justify-between wd-items-center"> |
||||
<text class="wd-font-800">手机号码</text> |
||||
<view class="wd-flex wd-flex-row wd-items-center" style="gap: 8px"> |
||||
<input class="wd-text-right" type="number" placeholder-class="txt" placeholder="请输入" v-model="form.mobile" /> |
||||
<u-icon name="arrow-right" color="#99A1B7" size="16"></u-icon> |
||||
</view> |
||||
</view> |
||||
<!-- 所属部门 --> |
||||
<view class="section wd-flex wd-flex-row wd-justify-between wd-items-center"> |
||||
<text class="wd-font-800">所属部门</text> |
||||
<view class="wd-flex wd-flex-row wd-items-center" style="gap: 8px"> |
||||
<u-icon name="arrow-right" color="#99A1B7" size="16"></u-icon> |
||||
</view> |
||||
</view> |
||||
<button class="button">提交</button> |
||||
</view> |
||||
</cs-page> |
||||
<cs-page isCustom> |
||||
<template #header> |
||||
<view class="wd-flex wd-flex-row wd-items-center" style="gap: 8px"> |
||||
<u-icon name="arrow-left" v-if="form.mobile"></u-icon> |
||||
<text class="wd-font-800 wd-text-16">编辑个人信息</text> |
||||
</view> |
||||
</template> |
||||
<view class="container"> |
||||
<!-- 我的头像 --> |
||||
<view class="section wd-flex wd-flex-row wd-justify-between wd-items-center"> |
||||
<text class="wd-font-800">我的头像</text> |
||||
<button |
||||
class="wd-flex wd-flex-row wd-items-center avatarBtn" |
||||
style="gap: 8px" |
||||
type="balanced" |
||||
open-type="chooseAvatar" |
||||
@chooseavatar="chooseAvatar" |
||||
> |
||||
<u-avatar :src="form.avatar"></u-avatar> |
||||
<u-icon name="arrow-right"></u-icon> |
||||
</button> |
||||
</view> |
||||
<!-- 真实姓名 --> |
||||
<view class="section wd-flex wd-flex-row wd-justify-between wd-items-center"> |
||||
<text class="wd-font-800">姓名</text> |
||||
<view class="wd-flex wd-flex-row wd-items-center" style="gap: 8px"> |
||||
<input |
||||
class="wd-text-right" |
||||
type="text" |
||||
placeholder-class="txt" |
||||
placeholder="请输入姓名" |
||||
v-model="form.realName" |
||||
/> |
||||
<u-icon name="arrow-right" color="#99A1B7" size="16"></u-icon> |
||||
</view> |
||||
</view> |
||||
<!-- 用户性别 --> |
||||
<view class="section wd-flex wd-flex-row wd-justify-between wd-items-center"> |
||||
<text class="wd-font-800">性别</text> |
||||
<view class="wd-flex wd-flex-row wd-items-center" style="gap: 8px"> |
||||
<input |
||||
class="wd-text-right" |
||||
type="number" |
||||
placeholder-class="txt" |
||||
placeholder="请选择性别" |
||||
v-model="form.sex" |
||||
disabled |
||||
@click="showPicker()" |
||||
/> |
||||
<u-icon name="arrow-right" color="#99A1B7" size="16"></u-icon> |
||||
</view> |
||||
</view> |
||||
<!-- 手机号码 --> |
||||
<view class="section wd-flex wd-flex-row wd-justify-between wd-items-center"> |
||||
<text class="wd-font-800">手机号码</text> |
||||
<view class="wd-flex wd-flex-row wd-items-center" style="gap: 8px"> |
||||
<input |
||||
class="wd-text-right" |
||||
type="number" |
||||
placeholder-class="txt" |
||||
placeholder="请输入手机号码" |
||||
v-model="form.mobile" |
||||
/> |
||||
<u-icon name="arrow-right" color="#99A1B7" size="16"></u-icon> |
||||
</view> |
||||
</view> |
||||
<!-- 所属部门 --> |
||||
<view class="section wd-flex wd-flex-row wd-justify-between wd-items-center"> |
||||
<text class="wd-font-800">部门</text> |
||||
<view class="wd-flex wd-flex-row wd-items-center" style="gap: 8px"> |
||||
<input |
||||
class="wd-text-right" |
||||
type="number" |
||||
placeholder-class="txt" |
||||
placeholder="请选择部门" |
||||
v-model="form.dept" |
||||
disabled |
||||
@click="showPicker()" |
||||
/> |
||||
<u-icon name="arrow-right" color="#99A1B7" size="16"></u-icon> |
||||
</view> |
||||
</view> |
||||
<!-- 身份 --> |
||||
<view class="section wd-flex wd-flex-row wd-justify-between wd-items-center" @click="showPicker()"> |
||||
<text class="wd-font-800">角色</text> |
||||
<view class="wd-flex wd-flex-row wd-items-center" style="gap: 8px"> |
||||
<text v-if="form.userType">{{ $dict.echoDicValue(dictMap.wx_user_type, form.userType) }}</text> |
||||
<text class="placeholder" v-else>请选择角色</text> |
||||
<u-icon name="arrow-right" color="#99A1B7" size="16"></u-icon> |
||||
</view> |
||||
</view> |
||||
<button class="button">提交</button> |
||||
</view> |
||||
<u-picker |
||||
:show="picker.show" |
||||
:columns="picker.columns" |
||||
@cancel="closePicker" |
||||
closeOnClickOverlay |
||||
@close="closePicker" |
||||
></u-picker> |
||||
</cs-page> |
||||
</template> |
||||
|
||||
<script> |
||||
import { getUserProfile, uploadAvatar } from '@/api/system/user.js' |
||||
import { getDictBatchByType } from '@/api/system/dict.js' |
||||
export default { |
||||
data() { |
||||
return { |
||||
form: { |
||||
avatar: undefined, |
||||
realName: undefined, |
||||
mobile: undefined, |
||||
department: undefined |
||||
} |
||||
} |
||||
} |
||||
data() { |
||||
return { |
||||
dictMap: {}, |
||||
form: { |
||||
avatar: undefined, |
||||
realName: undefined, |
||||
mobile: undefined, |
||||
department: undefined, |
||||
sex: undefined |
||||
}, |
||||
picker: { |
||||
show: false, |
||||
colums: [] |
||||
} |
||||
} |
||||
}, |
||||
onLoad() { |
||||
this.getDict() |
||||
}, |
||||
onShow() { |
||||
// this.init() |
||||
}, |
||||
methods: { |
||||
showPicker() { |
||||
this.picker.show = true |
||||
}, |
||||
closePicker() { |
||||
this.picker = { |
||||
show: false, |
||||
colums: [] |
||||
} |
||||
}, |
||||
init() { |
||||
getUserProfile().then(res => { |
||||
this.form = res.data |
||||
}) |
||||
}, |
||||
getDict() { |
||||
getDictBatchByType({ type: ['system_user_sex', 'wx_user_type'].join(',') }).then(res => { |
||||
this.dictMap = res.data |
||||
}) |
||||
}, |
||||
chooseAvatar(e) { |
||||
const data = { |
||||
name: 'avatarFile', |
||||
filePath: e.detail.avatarUrl |
||||
} |
||||
uploadAvatar(data).then(res => { |
||||
this.init() |
||||
}) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.container { |
||||
height: 100%; |
||||
padding: 10px; |
||||
position: relative; |
||||
.section { |
||||
border-radius: $cs-border-radius; |
||||
background: #fff; |
||||
box-shadow: 0 0 4px 2px $cs-shadow-color; |
||||
margin-bottom: $cs-gap; |
||||
padding: 24px; |
||||
} |
||||
.button { |
||||
background-color: $uni-color-primary; |
||||
color: #fff; |
||||
border-radius: 30px; |
||||
position: fixed; |
||||
bottom: 30px; |
||||
right: 10px; |
||||
left: 10px; |
||||
height: 40px; |
||||
line-height: 40px; |
||||
box-sizing: border-box; |
||||
} |
||||
height: 100%; |
||||
padding: 10px; |
||||
position: relative; |
||||
.section { |
||||
border-radius: $cs-border-radius; |
||||
background: #fff; |
||||
box-shadow: 0 0 4px 2px $cs-shadow-color; |
||||
margin-bottom: $cs-gap; |
||||
padding: 24px; |
||||
} |
||||
.button { |
||||
background-color: $uni-color-primary; |
||||
color: #fff; |
||||
border-radius: 30px; |
||||
position: fixed; |
||||
bottom: 30px; |
||||
right: 10px; |
||||
left: 10px; |
||||
height: 40px; |
||||
line-height: 40px; |
||||
box-sizing: border-box; |
||||
} |
||||
.placeholder { |
||||
color: $uni-text-color-grey; |
||||
} |
||||
button { |
||||
padding-left: 0; |
||||
padding-right: 0; |
||||
} |
||||
.avatarBtn { |
||||
background-color: #fff; |
||||
flex: 1; |
||||
justify-content: flex-end; |
||||
&::after { |
||||
content: ''; |
||||
display: none; |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
|
||||
@ -1,67 +1,68 @@
|
||||
<template> |
||||
<view class="container"> |
||||
<view class="fit-content"></view> |
||||
<view class="operation" v-if="isCustom"> |
||||
<slot></slot> |
||||
</view> |
||||
<view class="" v-else> |
||||
<view class="operation" v-if="isTab"> |
||||
<text class="title">{{ title }}</text> |
||||
</view> |
||||
<view class="operation wd-flex wd-flex-row wd-items-center" style="gap: 10px" v-else @tap="goback()"> |
||||
<view class="icon-box"> |
||||
<u-icon name="arrow-left" size="12"></u-icon> |
||||
</view> |
||||
<text class="title wd-text-16">{{ title }}</text> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="container"> |
||||
<view class="fit-content"></view> |
||||
<view class="operation" v-if="isCustom"> |
||||
<slot></slot> |
||||
</view> |
||||
<view v-else> |
||||
<view class="operation" v-if="isTab"> |
||||
<text class="title">{{ title }}</text> |
||||
</view> |
||||
<view class="operation wd-flex wd-flex-row wd-items-center" style="gap: 10px" v-else @tap="goback()"> |
||||
<view class="icon-box"> |
||||
<u-icon name="arrow-left" size="12"></u-icon> |
||||
</view> |
||||
<text class="title wd-text-16">{{ title }}</text> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
name: 's-header', |
||||
data() { |
||||
return {} |
||||
}, |
||||
props: { |
||||
title: String, |
||||
isTab: { |
||||
type: Boolean, |
||||
default: false |
||||
}, |
||||
isCustom: { |
||||
type: Boolean, |
||||
default: false |
||||
} |
||||
}, |
||||
methods: { |
||||
goback() { |
||||
uni.switchTab({ |
||||
url: '/pages/owner' |
||||
}) |
||||
} |
||||
} |
||||
name: 's-header', |
||||
data() { |
||||
return {} |
||||
}, |
||||
props: { |
||||
title: String, |
||||
isTab: { |
||||
type: Boolean, |
||||
default: false |
||||
}, |
||||
isCustom: { |
||||
type: Boolean, |
||||
default: false |
||||
} |
||||
}, |
||||
methods: { |
||||
goback() { |
||||
uni.switchTab({ |
||||
url: '/pages/owner' |
||||
}) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.container { |
||||
background-color: #fff; |
||||
box-shadow: 0 1px 2px 1px $cs-shadow-color; |
||||
.fit-content { |
||||
height: 8vh; |
||||
} |
||||
.operation { |
||||
padding: 5px 10px; |
||||
.title { |
||||
color: #000; |
||||
} |
||||
.icon-box { |
||||
padding: 5px; |
||||
border-radius: 50%; |
||||
box-shadow: 0 0 4px 2px $cs-shadow-color; |
||||
} |
||||
} |
||||
background-color: #fff; |
||||
box-shadow: 0 1px 2px 1px $cs-shadow-color; |
||||
.fit-content { |
||||
height: 6vh; |
||||
} |
||||
.operation { |
||||
padding: 5px 10px; |
||||
padding-bottom: 15px; |
||||
.title { |
||||
color: #000; |
||||
} |
||||
.icon-box { |
||||
padding: 5px; |
||||
border-radius: 50%; |
||||
box-shadow: 0 0 4px 2px $cs-shadow-color; |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
|
||||
@ -0,0 +1,8 @@
|
||||
/** |
||||
* 回显字典值 |
||||
* @param {Object} dict |
||||
* @param {Object} value |
||||
*/ |
||||
export function echoDicValue(dict, value) { |
||||
return dict.find(d => d.value == value.toString()).label || '' |
||||
} |
||||
@ -1,73 +1,83 @@
|
||||
import store from '@/store' |
||||
import config from '@/config' |
||||
import { getAccessToken } from '@/utils/auth' |
||||
import { |
||||
getAccessToken |
||||
} from '@/utils/auth' |
||||
import errorCode from '@/utils/errorCode' |
||||
import { toast, showConfirm, tansParams } from '@/utils/common' |
||||
import { |
||||
toast, |
||||
showConfirm, |
||||
tansParams |
||||
} from '@/utils/common' |
||||
|
||||
let timeout = 10000 |
||||
const baseUrl = config.baseUrl |
||||
|
||||
const upload = config => { |
||||
// 是否需要设置 token
|
||||
const isToken = (config.headers || {}).isToken === false |
||||
config.header = config.header || {} |
||||
if (getAccessToken() && !isToken) { |
||||
config.header['Authorization'] = 'Bearer ' + getAccessToken() |
||||
} |
||||
// get请求映射params参数
|
||||
if (config.params) { |
||||
let url = config.url + '?' + tansParams(config.params) |
||||
url = url.slice(0, -1) |
||||
config.url = url |
||||
} |
||||
// 设置租户 TODO 芋艿：强制 1 先
|
||||
config.header['tenant-id'] = '1'; |
||||
return new Promise((resolve, reject) => { |
||||
uni.uploadFile({ |
||||
timeout: config.timeout || timeout, |
||||
url: baseUrl + config.url, |
||||
filePath: config.filePath, |
||||
name: config.name || 'file', |
||||
header: config.header, |
||||
formData: config.formData, |
||||
method: config.method || 'post', |
||||
success: (res) => { |
||||
let result = JSON.parse(res.data) |
||||
const code = result.code || 200 |
||||
const msg = errorCode[code] || result.msg || errorCode['default'] |
||||
if (code === 200) { |
||||
resolve(result) |
||||
} else if (code == 401) { |
||||
showConfirm("登录状态已过期，您可以继续留在该页面，或者重新登录?").then(res => { |
||||
if (res.confirm) { |
||||
store.dispatch('LogOut').then(res => { |
||||
uni.reLaunch({ url: '/pages/login/login' }) |
||||
}) |
||||
} |
||||
}) |
||||
reject('无效的会话，或者会话已过期，请重新登录。') |
||||
} else if (code === 500) { |
||||
toast(msg) |
||||
reject('500') |
||||
} else if (code !== 200) { |
||||
toast(msg) |
||||
reject(code) |
||||
} |
||||
}, |
||||
fail: (error) => { |
||||
let { message } = error |
||||
if (message == 'Network Error') { |
||||
message = '后端接口连接异常' |
||||
} else if (message.includes('timeout')) { |
||||
message = '系统接口请求超时' |
||||
} else if (message.includes('Request failed with status code')) { |
||||
message = '系统接口' + message.substr(message.length - 3) + '异常' |
||||
} |
||||
toast(message) |
||||
reject(error) |
||||
} |
||||
}) |
||||
}) |
||||
// 是否需要设置 token
|
||||
const isToken = (config.headers || {}).isToken === false |
||||
config.header = config.header || {} |
||||
if (getAccessToken() && !isToken) { |
||||
config.header['Authorization'] = 'Bearer ' + getAccessToken() |
||||
} |
||||
// get请求映射params参数
|
||||
if (config.params) { |
||||
let url = config.url + '?' + tansParams(config.params) |
||||
url = url.slice(0, -1) |
||||
config.url = url |
||||
} |
||||
// 设置租户 TODO 芋艿：强制 1 先
|
||||
config.header['tenant-id'] = '1'; |
||||
return new Promise((resolve, reject) => { |
||||
uni.uploadFile({ |
||||
timeout: config.timeout || timeout, |
||||
url: baseUrl + config.url, |
||||
filePath: config.filePath, |
||||
name: config.name || 'file', |
||||
header: config.header, |
||||
formData: config.formData, |
||||
method: config.method || 'post', |
||||
success: (res) => { |
||||
let result = JSON.parse(res.data) |
||||
const code = result.code || 200 |
||||
const msg = errorCode[code] || result.msg || errorCode['default'] |
||||
if (code === 200) { |
||||
resolve(result) |
||||
} else if (code == 401) { |
||||
showConfirm("登录状态已过期，您可以继续留在该页面，或者重新登录?").then(res => { |
||||
if (res.confirm) { |
||||
store.dispatch('LogOut').then(res => { |
||||
uni.reLaunch({ |
||||
url: '/pages/login/login' |
||||
}) |
||||
}) |
||||
} |
||||
}) |
||||
reject('无效的会话，或者会话已过期，请重新登录。') |
||||
} else if (code === 500) { |
||||
toast(msg) |
||||
reject('500') |
||||
} else if (code !== 200) { |
||||
toast(msg) |
||||
reject(code) |
||||
} |
||||
}, |
||||
fail: (error) => { |
||||
let { |
||||
message |
||||
} = error |
||||
if (message == 'Network Error') { |
||||
message = '后端接口连接异常' |
||||
} else if (message.includes('timeout')) { |
||||
message = '系统接口请求超时' |
||||
} else if (message.includes('Request failed with status code')) { |
||||
message = '系统接口' + message.substr(message.length - 3) + '异常' |
||||
} |
||||
toast(message) |
||||
reject(error) |
||||
} |
||||
}) |
||||
}) |
||||
} |
||||
|
||||
export default upload |
||||
export default upload |
||||
Loading…
Reference in new issue