Compare commits
6 Commits
e7cd0eecca
...
6da9b43918
| Author | SHA1 | Date |
|---|---|---|
 jwg
|
6da9b43918 | 3 months ago |
|
jwg
|
742b29f6c2 | 3 months ago |
|
jwg
|
e57a20cca6 | 6 months ago |
|
jwg
|
121b97b5ce | 6 months ago |
|
jwg
|
2332440e81 | 6 months ago |
|
jwg
|
62ce60e8d6 | 6 months ago |
@ -0,0 +1,58 @@
|
|||||||
|
import request from '@/plugin/axios'
|
||||||
|
|
||||||
|
// 申请单报表
|
||||||
|
export function applyReportApi(query) {
|
||||||
|
return request({
|
||||||
|
url: 'bs/expense-apply/getreport',
|
||||||
|
method: 'get',
|
||||||
|
params: query,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 申请单报表
|
||||||
|
export function claimReportApi(query) {
|
||||||
|
return request({
|
||||||
|
url: 'bs/expense-claim/getreport',
|
||||||
|
method: 'get',
|
||||||
|
params: query,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 报表
|
||||||
|
export function gatherMsgApi(query) {
|
||||||
|
return request({
|
||||||
|
url: 'bs/statement/gathering ',
|
||||||
|
method: 'get',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 申请单报表
|
||||||
|
export function paymentMsgApi(query) {
|
||||||
|
return request({
|
||||||
|
url: 'bs/statement/payment',
|
||||||
|
method: 'get',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 付款饼图
|
||||||
|
export function paymentPieApi(query) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/statement/paymentPie',
|
||||||
|
method: 'get',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 收款饼图
|
||||||
|
export function gatheringPieApi(query) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/statement/gatheringPie',
|
||||||
|
method: 'get',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 供应商柱状图
|
||||||
|
export function paymentColumnarApi(query) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/statement/paymentColumnar',
|
||||||
|
method: 'get',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
@ -0,0 +1,34 @@
|
|||||||
|
import request from '@/plugin/axios'
|
||||||
|
// 创建银行账户信息
|
||||||
|
export function createBankInfo(data) {
|
||||||
|
return request({
|
||||||
|
url: "/system/bank-info/create",
|
||||||
|
method: "post",
|
||||||
|
data: data,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 更新银行账户信息
|
||||||
|
export function updateBankInfo(data) {
|
||||||
|
return request({
|
||||||
|
url: "/system/bank-info/update",
|
||||||
|
method: "put",
|
||||||
|
data: data,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除银行账户信息
|
||||||
|
export function deleteBankAccountInfo(id) {
|
||||||
|
return request({
|
||||||
|
url: "/system/bank-info/delete?id=" + id,
|
||||||
|
method: "delete",
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取银行账户信息详情
|
||||||
|
export function getDetail(id) {
|
||||||
|
return request({
|
||||||
|
url: "/system/bank-info/get?id=" + id,
|
||||||
|
method: "get",
|
||||||
|
});
|
||||||
|
}
|
||||||
@ -0,0 +1,15 @@
|
|||||||
|
import layoutHome from '../../layout/index.vue'
|
||||||
|
|
||||||
|
const meta = { requiresAuth: true }
|
||||||
|
|
||||||
|
export default {
|
||||||
|
path: '/reportForms',
|
||||||
|
name: 'reportForms',
|
||||||
|
meta,
|
||||||
|
redirect: { name: 'reportForms' },
|
||||||
|
component: layoutHome,
|
||||||
|
children: (pre => [
|
||||||
|
{ path: '/myReportForms', name: `${pre}myReportForms`, component: () => import('@/views/reportForms/myReportForms'), meta: { cache: true, title: '我的报表' } },
|
||||||
|
{ path: '/userInfo', name: `${pre}UserInfo`, component: () => import('@/views/reportForms/userInfo'), meta: { cache: true, title: '个人信息' } },
|
||||||
|
])('reportForms-')
|
||||||
|
}
|
||||||
@ -0,0 +1,126 @@
|
|||||||
|
<template>
|
||||||
|
<div :class="className" :style="{ height: height, width: width }" />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import * as echarts from "echarts";
|
||||||
|
require("echarts/theme/macarons"); // echarts theme
|
||||||
|
// import resize from '../mixins/resize'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
// mixins: [resize],
|
||||||
|
props: {
|
||||||
|
className: {
|
||||||
|
type: String,
|
||||||
|
default: "chart",
|
||||||
|
},
|
||||||
|
width: {
|
||||||
|
type: String,
|
||||||
|
default: "100%",
|
||||||
|
},
|
||||||
|
height: {
|
||||||
|
type: String,
|
||||||
|
default: "350px",
|
||||||
|
},
|
||||||
|
autoResize: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true,
|
||||||
|
},
|
||||||
|
chartData: {
|
||||||
|
type: Object,
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
chart: null,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
chartData: {
|
||||||
|
deep: true,
|
||||||
|
handler(val) {
|
||||||
|
this.setOptions(val);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.initChart();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
if (!this.chart) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.chart.dispose();
|
||||||
|
this.chart = null;
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
initChart() {
|
||||||
|
this.chart = echarts.init(this.$el, "macarons");
|
||||||
|
this.setOptions(this.chartData);
|
||||||
|
},
|
||||||
|
setOptions({ amountDataList } = {}) {
|
||||||
|
let newAmountDataList = amountDataList || [];
|
||||||
|
let xArr = [];
|
||||||
|
newAmountDataList.forEach((element) => {
|
||||||
|
xArr.push(element.date);
|
||||||
|
});
|
||||||
|
let yArr = [];
|
||||||
|
newAmountDataList.forEach((element) => {
|
||||||
|
yArr.push(element.num);
|
||||||
|
});
|
||||||
|
this.chart.setOption({
|
||||||
|
tooltip: {
|
||||||
|
trigger: "axis",
|
||||||
|
axisPointer: {
|
||||||
|
type: "shadow",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
left: "3%",
|
||||||
|
right: "4%",
|
||||||
|
bottom: "3%",
|
||||||
|
containLabel: true,
|
||||||
|
},
|
||||||
|
xAxis: [
|
||||||
|
{
|
||||||
|
type: "category",
|
||||||
|
data: xArr,
|
||||||
|
axisTick: {
|
||||||
|
alignWithLabel: true,
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
//这是x轴文字颜色
|
||||||
|
lineStyle: {
|
||||||
|
color: "#333",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
yAxis: [
|
||||||
|
{
|
||||||
|
type: "value",
|
||||||
|
axisLine: {
|
||||||
|
//这是y轴文字颜色
|
||||||
|
lineStyle: {
|
||||||
|
color: "#333",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
color: "#4E98FF",
|
||||||
|
name: "CNY",
|
||||||
|
type: "bar",
|
||||||
|
barWidth: "30%",
|
||||||
|
data: yArr,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
@ -0,0 +1,273 @@
|
|||||||
|
<template>
|
||||||
|
<div class="common-list-contain">
|
||||||
|
<div class="common-form">
|
||||||
|
<van-form
|
||||||
|
ref="queryParams"
|
||||||
|
:show-error-message="false"
|
||||||
|
validate-trigger=""
|
||||||
|
:submit-on-enter="false"
|
||||||
|
label-width="8rem"
|
||||||
|
>
|
||||||
|
<div class="section"><span class="line"> </span> 查询条件</div>
|
||||||
|
<div class="trips-box">
|
||||||
|
<div class="item-box">
|
||||||
|
<RePick
|
||||||
|
v-model="bblx"
|
||||||
|
titleKey="label"
|
||||||
|
idKey="value"
|
||||||
|
label="报表类型"
|
||||||
|
:list="option1"
|
||||||
|
isRequrie
|
||||||
|
isCell
|
||||||
|
clearable
|
||||||
|
/>
|
||||||
|
<RePick
|
||||||
|
v-model="ssdlx"
|
||||||
|
titleKey="label"
|
||||||
|
idKey="value"
|
||||||
|
label="申请单类型"
|
||||||
|
:list="option2"
|
||||||
|
isRequrie
|
||||||
|
isCell
|
||||||
|
clearable
|
||||||
|
/>
|
||||||
|
<van-field
|
||||||
|
:value="queryParams.createTime"
|
||||||
|
label="日期"
|
||||||
|
placeholder="请选择"
|
||||||
|
@click="handleDateShow"
|
||||||
|
:right-icon="queryParams.createTime ? '' : 'arrow'"
|
||||||
|
input-align="right"
|
||||||
|
autosize
|
||||||
|
rows="1"
|
||||||
|
type="textarea"
|
||||||
|
>
|
||||||
|
<template v-if="queryParams.createTime" #button>
|
||||||
|
<van-icon
|
||||||
|
name="clear"
|
||||||
|
color="#C8C9CC"
|
||||||
|
size="16"
|
||||||
|
@click.stop="handleClear"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</van-field>
|
||||||
|
<div style="display: flex; justify-content: center">
|
||||||
|
<van-button
|
||||||
|
style="margin-right: 30px"
|
||||||
|
@click="handleConfirm"
|
||||||
|
type="primary"
|
||||||
|
size="normal"
|
||||||
|
>搜索</van-button
|
||||||
|
>
|
||||||
|
<van-button @click="handleDateReset">重置</van-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</van-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 费用统计 -->
|
||||||
|
<van-cell-group style="margin-top: 20px">
|
||||||
|
<van-cell title="费用统计" />
|
||||||
|
<div class="account-box">
|
||||||
|
<div class="item-box" v-for="(item, index) in accountList" :key="index">
|
||||||
|
<div class="box-tt">
|
||||||
|
<div>
|
||||||
|
<span>{{ item.tt }}</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
CNY <span class="fw600">{{ item.m }}</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
单据 <span class="fw600">{{ item.num }}</span> 笔
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</van-cell-group>
|
||||||
|
|
||||||
|
<van-cell-group style="margin-top: 20px">
|
||||||
|
<van-cell title="金额按月统计" />
|
||||||
|
<LineChart :chartData="chartData" />
|
||||||
|
</van-cell-group>
|
||||||
|
|
||||||
|
<van-cell-group style="margin-top: 20px">
|
||||||
|
<van-cell title="按费用类型统计" />
|
||||||
|
<RoundChart :chartData="chartData" />
|
||||||
|
</van-cell-group>
|
||||||
|
|
||||||
|
<!--行程时间范围选择 -->
|
||||||
|
<van-calendar
|
||||||
|
ref="vanCalendar"
|
||||||
|
allow-same-day
|
||||||
|
:maxDate="maxDate"
|
||||||
|
v-model="dateShow"
|
||||||
|
:min-date="minDate"
|
||||||
|
:default-date="defaultDate"
|
||||||
|
type="range"
|
||||||
|
color="#0088FE"
|
||||||
|
@confirm="handleDateSelect"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div class="common-bottom-btns" style="bottom: 6rem">
|
||||||
|
<div class="common-bottom-btn" @click="handleBack">
|
||||||
|
<img src="@/assets/images/icons/home.png" alt="" />
|
||||||
|
<span>返回首页</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import dayjs from "dayjs";
|
||||||
|
import { applyReportApi, claimReportApi } from "@/api/bs/chart";
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
RePick: () => import("@/components/ReComponents/RePick"),
|
||||||
|
RoundChart: () => import("./components/RoundChart"),
|
||||||
|
LineChart: () => import("./components/LineChart"),
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
// 报表类型
|
||||||
|
option1: [
|
||||||
|
{
|
||||||
|
value: "SQ",
|
||||||
|
label: "申请单",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "BX",
|
||||||
|
label: "费用单",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
// 申请单类型
|
||||||
|
option2: [
|
||||||
|
{
|
||||||
|
value: "RC",
|
||||||
|
label: "日常",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "CL",
|
||||||
|
label: "差旅",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
// 查询参数
|
||||||
|
bblx: "SQ",
|
||||||
|
ssdlx: "RC",
|
||||||
|
queryParams: {
|
||||||
|
billType: "RCSQ",
|
||||||
|
createTime: "",
|
||||||
|
startDate: null,
|
||||||
|
endDate: null,
|
||||||
|
},
|
||||||
|
minDate: new Date("2000/01/01"),
|
||||||
|
maxDate: new Date("2030/01/01"),
|
||||||
|
defaultDate: new Date(),
|
||||||
|
dateShow: false,
|
||||||
|
// 费用统计
|
||||||
|
accountList: [
|
||||||
|
{
|
||||||
|
m: 747.8,
|
||||||
|
num: 2,
|
||||||
|
tt: "合计",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
tt: "流程中",
|
||||||
|
m: 747.8,
|
||||||
|
num: 2,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
chartData: {},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
ssdlx: {
|
||||||
|
handler(val) {
|
||||||
|
this.queryParams.billType = val + this.bblx;
|
||||||
|
},
|
||||||
|
immediate: true,
|
||||||
|
},
|
||||||
|
bblx: {
|
||||||
|
handler(val) {
|
||||||
|
this.queryParams.billType = this.ssdlx + val;
|
||||||
|
},
|
||||||
|
immediate: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 转换日期
|
||||||
|
handleDateShow(obj) {
|
||||||
|
const { startTime, endTime } = obj;
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.$refs.vanCalendar && this.$refs.vanCalendar.reset();
|
||||||
|
this.dateShow = true;
|
||||||
|
if (startTime && endTime) {
|
||||||
|
this.defaultDate = [
|
||||||
|
dayjs(startTime).toDate(),
|
||||||
|
dayjs(endTime).toDate(),
|
||||||
|
];
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 清除搜索日期
|
||||||
|
handleClear() {
|
||||||
|
this.queryParams.startDate = "";
|
||||||
|
this.queryParams.endDate = "";
|
||||||
|
},
|
||||||
|
// 选择日期
|
||||||
|
handleDateSelect(list) {
|
||||||
|
this.queryParams.startDate = dayjs(list[0]).format("YY/MM/DD");
|
||||||
|
this.queryParams.endDate = dayjs(list[1]).format("YY/MM/DD");
|
||||||
|
this.queryParams.createTime = `${dayjs(list[0]).format(
|
||||||
|
"YY/MM/DD"
|
||||||
|
)}~${dayjs(list[1]).format("YY/MM/DD")}`;
|
||||||
|
this.dateShow = false;
|
||||||
|
},
|
||||||
|
// 搜索
|
||||||
|
handleConfirm() {
|
||||||
|
let api = this.bblx == "SQ" ? applyReportApi : claimReportApi;
|
||||||
|
const { billType, startDate, endDate } = this.queryParams;
|
||||||
|
api({
|
||||||
|
billType,
|
||||||
|
startDate: startDate || null,
|
||||||
|
endDate: endDate || null,
|
||||||
|
}).then((res) => {
|
||||||
|
this.chartData = res.data || {};
|
||||||
|
this.accountList[0].m = this.chartData.totalAmount;
|
||||||
|
this.accountList[0].num = this.chartData.totalCount;
|
||||||
|
this.accountList[1].m = this.chartData.processAmount;
|
||||||
|
this.accountList[1].num = this.chartData.processCount;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 重置搜索
|
||||||
|
handleDateReset() {
|
||||||
|
this.queryParams = {
|
||||||
|
billType: "RCSQ",
|
||||||
|
createTime: "",
|
||||||
|
startDate: null,
|
||||||
|
endDate: null,
|
||||||
|
};
|
||||||
|
this.handleConfirm();
|
||||||
|
},
|
||||||
|
handleBack() {
|
||||||
|
history.back();
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@import "~@/assets/style/common/form.scss";
|
||||||
|
/* .account-box {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
} */
|
||||||
|
.box-tt {
|
||||||
|
padding: 10px 30px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
.fw600 {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,196 @@
|
|||||||
|
<template>
|
||||||
|
<div class="common-list-contain">
|
||||||
|
<van-tabs v-model="active" @click="onChange" class="tabs">
|
||||||
|
<van-tab title="基本资料">
|
||||||
|
<van-field
|
||||||
|
v-model="user.nickname"
|
||||||
|
clearable
|
||||||
|
label="用户昵称"
|
||||||
|
placeholder="请输入用户昵称"
|
||||||
|
/>
|
||||||
|
<van-field
|
||||||
|
v-model="user.mobile"
|
||||||
|
required
|
||||||
|
clearable
|
||||||
|
label="手机号码"
|
||||||
|
placeholder="请输入手机号码"
|
||||||
|
/>
|
||||||
|
<van-field
|
||||||
|
v-model="user.email"
|
||||||
|
required
|
||||||
|
clearable
|
||||||
|
label="邮箱"
|
||||||
|
placeholder="请输入邮箱"
|
||||||
|
/>
|
||||||
|
<div class="van-cell van-field">
|
||||||
|
<div class="van-cell__title van-field__label">
|
||||||
|
<span>性别</span>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell__value van-field__value">
|
||||||
|
<div class="van-field__body">
|
||||||
|
<input type="radio" name="sex" v-model="user.sex" :value="1" />男
|
||||||
|
<span style="display: inline-block; width: 20px"></span>
|
||||||
|
<input type="radio" name="sex" v-model="user.sex" :value="2" />女
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="btn-box">
|
||||||
|
<van-button
|
||||||
|
type="info"
|
||||||
|
size="small"
|
||||||
|
style="width: 30%"
|
||||||
|
@click="saveUser"
|
||||||
|
>保存</van-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</van-tab>
|
||||||
|
<van-tab title="修改密码">
|
||||||
|
<van-field
|
||||||
|
v-model="password.oldPassword"
|
||||||
|
clearable
|
||||||
|
type="password"
|
||||||
|
label="旧密码"
|
||||||
|
placeholder="请输入"
|
||||||
|
/>
|
||||||
|
<van-field
|
||||||
|
v-model="password.newPassword"
|
||||||
|
required
|
||||||
|
clearable
|
||||||
|
type="password"
|
||||||
|
label="新密码"
|
||||||
|
placeholder="请输入"
|
||||||
|
/>
|
||||||
|
<van-field
|
||||||
|
v-model="password.confirmPassword"
|
||||||
|
required
|
||||||
|
clearable
|
||||||
|
type="password"
|
||||||
|
label="确认密码"
|
||||||
|
placeholder="请输入"
|
||||||
|
/>
|
||||||
|
<div class="btn-box">
|
||||||
|
<van-button
|
||||||
|
type="info"
|
||||||
|
size="small"
|
||||||
|
style="width: 30%"
|
||||||
|
@click="savePassword"
|
||||||
|
>保存</van-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</van-tab>
|
||||||
|
<van-tab title="银行">
|
||||||
|
<BankInfo :user="user" @update="getUser"></BankInfo>
|
||||||
|
</van-tab>
|
||||||
|
</van-tabs>
|
||||||
|
|
||||||
|
<div class="common-bottom-btns" style="bottom: 6rem">
|
||||||
|
<div class="common-bottom-btn" @click="handleBack">
|
||||||
|
<img src="@/assets/images/icons/home.png" alt="" />
|
||||||
|
<span>返回首页</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
updateUserProfile,
|
||||||
|
getUserProfile,
|
||||||
|
updateUserPwd
|
||||||
|
} from '@/api/system/user'
|
||||||
|
import BankInfo from './bankInfo'
|
||||||
|
export default {
|
||||||
|
components: { BankInfo },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
active: 0,
|
||||||
|
user: {
|
||||||
|
nickname: '',
|
||||||
|
mobile: '',
|
||||||
|
email: '',
|
||||||
|
sex: null
|
||||||
|
},
|
||||||
|
password: {
|
||||||
|
oldPassword: '',
|
||||||
|
newPassword: '',
|
||||||
|
confirmPassword: ''
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getUser()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
onChange(index, title) {
|
||||||
|
this.active = index
|
||||||
|
},
|
||||||
|
// 获取用户信息
|
||||||
|
getUser() {
|
||||||
|
getUserProfile().then((response) => {
|
||||||
|
this.user = response.data
|
||||||
|
})
|
||||||
|
},
|
||||||
|
saveUser() {
|
||||||
|
if (!this.user.mobile) {
|
||||||
|
this.$fm('手机号不可为空！')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!this.user.email) {
|
||||||
|
this.$fm('邮箱不可为空！')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
updateUserProfile(this.user).then((res) => {
|
||||||
|
if (res.data) this.$fm('保存成功！')
|
||||||
|
})
|
||||||
|
},
|
||||||
|
savePassword() {
|
||||||
|
if (!this.password.oldPassword) {
|
||||||
|
this.$fm('不可为空！')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!this.password.newPassword) {
|
||||||
|
this.$fm('不可为空！')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (this.password.confirmPassword !== this.password.newPassword) {
|
||||||
|
this.$fm('两次输入的密码不一致')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
const regex = new RegExp(
|
||||||
|
/^(?=.*[A-Z])(?=.*\d)(?=.*[!@#$%^&*\.])[A-Za-z\d!@#$%^&*\.]{8,16}$/
|
||||||
|
)
|
||||||
|
if (!regex.test(this.password.newPassword)) {
|
||||||
|
this.$fm('密码必须包含大写字母、数字、特殊字符, 且8-16位')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
updateUserPwd(this.password.oldPassword, this.password.newPassword).then(
|
||||||
|
(response) => {
|
||||||
|
this.$fm('修改成功')
|
||||||
|
}
|
||||||
|
)
|
||||||
|
},
|
||||||
|
handleBack() {
|
||||||
|
history.back()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@import '~@/assets/style/common/form.scss';
|
||||||
|
.tabs {
|
||||||
|
::v-deep .van-tabs__content {
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-radio {
|
||||||
|
.van-radio__icon {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.btn-box {
|
||||||
|
margin-top: 40px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue