update ui

This commit is contained in:
LittleBoy 2019-06-27 17:37:32 +08:00
parent 1fd01403d3
commit 880b269f34
13 changed files with 343 additions and 113 deletions

View File

@ -12,10 +12,12 @@
"@antv/data-set": "^0.10.2",
"core-js": "^2.6.5",
"element-ui": "^2.0.11",
"lodash": "^4.17.11",
"mobx-vue": "^2.0.9",
"moment": "^2.24.0",
"viser-vue": "^2.4.5",
"vue": "^2.6.10",
"qs": "^6.7.0",
"vue-router": "^3.0.3"
},
"devDependencies": {
@ -27,7 +29,6 @@
"eslint-plugin-vue": "^5.0.0",
"less": "^3.0.4",
"less-loader": "^4.1.0",
"qs": "^6.7.0",
"sass": "^1.21.0",
"sass-loader": "^7.1.0",
"vue-template-compiler": "^2.5.21"

View File

@ -70,10 +70,8 @@
:style="{color:colors.primary}"></i>
<span style="font-size: 15px;">当前位置:</span>
</span>
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>活动管理</el-breadcrumb-item>
<el-breadcrumb-item>活动列表</el-breadcrumb-item>
<el-breadcrumb-item>活动详情</el-breadcrumb-item>
<el-breadcrumb-item>首页</el-breadcrumb-item>
<el-breadcrumb-item :key="nav.name" v-for="nav in breadcrumb">{{nav.text}}</el-breadcrumb-item>
</el-breadcrumb>
</div>
</div>
@ -82,21 +80,21 @@
</el-main>
</el-container>
<el-dialog title="修改密码" :visible.sync="dialogUpdatePwdVisible" width="400px">
<el-form name="dialog" :model="updateModel">
<el-form-item>
<el-dialog title="修改密码" :visible.sync="dialogUpdatePwdVisible" width="400px" :close-on-click-modal="false">
<el-form name="dialog" ref="updateForm" :rules="updateRules" :model="updateModel">
<el-form-item prop="origin">
<el-input placeholder="请输入原始密码" v-model="updateModel.origin" show-password></el-input>
</el-form-item>
<el-form-item>
<el-input placeholder="请输入新密码" v-model="updateModel.origin" show-password></el-input>
<el-form-item prop="new_pwd">
<el-input placeholder="请输入新密码" v-model="updateModel.new_pwd" show-password></el-input>
</el-form-item>
<el-form-item>
<el-input placeholder="请再次输入新密码" v-model="updateModel.origin" show-password></el-input>
<el-form-item prop="new_pwd2">
<el-input placeholder="请再次输入新密码" v-model="updateModel.new_pwd2" show-password></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogUpdatePwdVisible = false"> </el-button>
<el-button type="primary" @click="dialogUpdatePwdVisible = false">确定修改</el-button>
<el-button @click="onCancelSubmit"> </el-button>
<el-button type="primary" @click="onSubmit">确定修改</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="helpDialogVisible" :title="langData.help.title">
@ -109,11 +107,9 @@
</template>
<script>
// import { use } from "element-ui/lib/locale"
import langConfig from "./../utils/lang";
import {updatePwd} from './../service/api'
import {adminRoutes} from "./../router/routes";
// import zhLocale from "element-ui/lib/locale/lang/zh-CN"
// import enLocale from "element-ui/lib/locale/lang/en"
export default {
data() {
const currentLang = "zh-cn";
@ -131,6 +127,7 @@
routes: adminRoutes,
lang: currentLang,
langData: langConfig[currentLang],
breadcrumb:[],
colors: {
primary: "#2EC7A5",
contentBg: '#F5F6FA'
@ -198,11 +195,13 @@
setTimeout(() => {
loading.close();
sessionStorage.removeItem('ms_username');
this.$router.push('login');
this.$router.replace('/user/login')
}, 1000);
break;
case 'updatePwd':
this.dialogUpdatePwdVisible = true;
this.$refs['updateForm'].resetFields();
break;
}
// this.$message('...');
@ -211,7 +210,47 @@
if (this.$route.meta.text) {
document.title = this.$route.meta.text;
}
this.activeMenu = this.$route.path;
let routeName = this.$route.name,
showName = this.langData.navs[routeName],
routePath = this.$route.path;
this.breadcrumb = [{
text:showName,
name:routeName,
path:routePath
}];
this.activeMenu = routePath;
},
onCancelSubmit(){
this.$refs.updateForm.resetFields();
this.dialogUpdatePwdVisible = false;
},
onSubmit(){
this.$refs['updateForm'].validate((valid) => {
if (valid) {
this.updatePwd();
}
});
},
async updatePwd(){
const loading = this.$loading({
lock: true,
text: '正在修改密码...',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
try{
let data = await updatePwd(this.updateModel);
if(data.code && data.code != 0){
this.$message.info(data.message);
}else{
this.$message.info('更新密码成功');
this.dialogUpdatePwdVisible = false;
}
}catch (e) {
this.$message.error('更新密码失败');
}
loading.close();
},
switchLang(currentLang) {
this.lang = currentLang;

View File

@ -18,11 +18,11 @@
<el-input v-model="searchModel.name" placeholder="姓名"></el-input>
</el-form-item>
<el-form-item>
<el-button type="info" @click="onSearch">查询</el-button>
<el-button type="info" @click="resetAndSearch">查询</el-button>
</el-form-item>
<div class="float-right">
<el-form-item>
<el-select v-model="searchModel.sort" placeholder="排序方式">
<el-select @change="onSortChange" v-model="searchModel.sort" placeholder="排序方式">
<el-option label="评估时间排序" value="time"></el-option>
<el-option label="评估总分排序" value="score"></el-option>
</el-select>
@ -32,7 +32,7 @@
</div>
<div class="data-list">
<el-table :data="dataList" class="table-border">
<el-table-column prop="create_time" label="自评时间" width="180" />
<el-table-column prop="create_time" label="自评时间" width="180"/>
<el-table-column width="100" prop="realname" label="姓名"/>
<el-table-column prop="headache" label="头痛症状"/>
<el-table-column prop="gastrointestinal" label="胃肠道症状"/>
@ -43,37 +43,37 @@
</el-table>
</div>
<div class="data-page text-right">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[100, 200, 300, 400]"
:page-size="100"
layout="total, prev, pager, next,sizes, jumper"
:total="totalCount">
<el-pagination @size-change="handleSizeChange"
@current-change="handleCurrentChange"
@prev-click="handPrev"
@next-click="handNext"
:current-page="searchModel.page"
:page-sizes="[20, 50, 100, 200]"
:page-size="searchModel.pageSize"
layout="total, prev, pager, next,sizes, jumper" :total="totalCount">
</el-pagination>
</div>
<el-dialog title="导出记录" :visible.sync="dialogExportVisible" class="el-dialog-export"
width="750px">
width="790px">
<el-form name="dialog" :model="exportModel">
<p><b>导出数据</b></p>
<el-form-item>
<el-radio-group v-model="exportModel.dataCount">
<el-radio label="current">当前筛选数据({{dataList.length}})</el-radio>
<el-radio label="all">所有数据({{totalCount}})</el-radio>
<el-radio label="current">当前筛选数据({{totalCount}})</el-radio>
<el-radio label="all">所有数据({{allCount}})</el-radio>
</el-radio-group>
</el-form-item>
<p><b>导出字段</b></p>
<el-form-item>
<el-checkbox-group v-model="exportModel.fields_basic">
<el-checkbox border label="time">自评时间</el-checkbox>
<el-checkbox border label="name">姓名</el-checkbox>
<el-checkbox border label="head">头痛症状</el-checkbox>
<el-checkbox border label="gastrointestinal">胃肠道症状</el-checkbox>
<el-checkbox border label="tired">劳累或疲劳</el-checkbox>
<el-checkbox border label="dizzy">头晕或眩晕</el-checkbox>
<el-checkbox border label="score">总分</el-checkbox>
<el-checkbox border label="result">评估结果</el-checkbox>
<el-checkbox-group v-model="exportModel.fields">
<el-checkbox border checked label="create_time">自评时间</el-checkbox>
<el-checkbox border checked label="realname">姓名</el-checkbox>
<el-checkbox border checked label="headache">头痛症状</el-checkbox>
<el-checkbox border checked label="gastrointestinal">胃肠道症状</el-checkbox>
<el-checkbox border checked label="tired">劳累或疲劳</el-checkbox>
<el-checkbox border checked label="dizzy">头晕或眩晕</el-checkbox>
<el-checkbox border checked label="score">总分</el-checkbox>
<el-checkbox border checked label="result">评估结果</el-checkbox>
</el-checkbox-group>
</el-form-item>
<p>
@ -81,7 +81,7 @@
<small>基本信息</small>
</p>
<el-form-item>
<el-checkbox-group v-model="exportModel.fields_basic">
<el-checkbox-group v-model="exportModel.fields">
<el-checkbox border label="gender">性别</el-checkbox>
<el-checkbox border label="age">年龄</el-checkbox>
<el-checkbox border label="height">身高</el-checkbox>
@ -89,8 +89,8 @@
<el-checkbox border label="address">久居地</el-checkbox>
<el-checkbox border label="smoke">抽烟量</el-checkbox>
<el-checkbox border label="drink">饮酒量</el-checkbox>
<el-checkbox border label="is_first_to">首次进藏</el-checkbox>
<el-checkbox border label="medal_history">既往病历</el-checkbox>
<el-checkbox border label="is_first_to_tibet">首次进藏</el-checkbox>
<el-checkbox border label="medical_history">既往病历</el-checkbox>
</el-checkbox-group>
</el-form-item>
<p><b>导出格式</b></p>
@ -103,14 +103,16 @@
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogExportVisible = false"> </el-button>
<el-button type="primary" @click="dialogExportVisible = false"> </el-button>
<el-button type="primary" @click="exportClick">确定导出</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {evaluationSearch} from './../../service/api'
import {evaluationSearch, getDownloadUrl} from './../../service/api'
import formatDate from './../../utils/datetime'
import object from 'lodash/fp/object'
export default {
name: "test_record",
@ -120,36 +122,86 @@
cities: [],
exportModel: {
dataCount: 'current',
fields_basic: [],
fields_optional: [],
fields: [],
format: 'csv'
},
searchModel: {
resultType: '-1',
name: '',
sort: 'time',
page: 1,
pageSize: 20
},
loadingData: true,
totalCount: 0,
allCount: 0,
loadingData: false,
dataList: [],
currentPage: 1,
totalCount: 401
currentPage: 1
}
},
mounted() {
window.console.log(formatDate());
this.onSearch();
},
methods: {
onSortChange(sort) {
this.searchModel.sort = sort
this.onSearch();
},
resetAndSearch() {
this.searchModel.page = 1;
this.onSearch();
},
async onSearch() {
this.loadingData = true;
let data = await evaluationSearch(this.searchModel);
this.dataList = data.list;
this.totalCount = data.totalCount;
this.allCount = data.allCount;
this.loadingData = false;
},
handleSizeChange() {
handleSizeChange(size) {
this.searchModel.pageSize = size
this.onSearch();
},
handleCurrentChange() {
handleCurrentChange(page) {
this.searchModel.page = page
this.onSearch();
},
handPrev() {
if (this.searchModel.page <= 1) {
return;
}
this.searchModel.page--
this.onSearch();
},
handNext() {
this.searchModel.page++
this.onSearch();
},
exportClick() {
let params = object.assign(
this.searchModel,
{page: 1, pageSize: -1}
);
params = object.assign(params, this.exportModel);
let url = getDownloadUrl(params),
fileName = '评估记录_';
if (this.exportModel.dataCount == 'all') {
fileName += 'all';
} else {
fileName += formatDate('mdHi');
}
let link = document.createElement('a')
link.href = url;
// link.setAttribute('target', '_blank');
link.download = fileName + '.' + (
this.exportModel.format == 'csv' ? 'csv' : 'xlsx');
link.click();
//
this.dialogExportVisible = false;
}
}
}
@ -171,16 +223,19 @@
width: 90px;
}
}
/*.el-dialog-export{*/
/*width:795px;*/
/*width:795px;*/
/*}*/
.el-checkbox-group{
.el-checkbox-group {
margin-right: -20px;
}
.el-checkbox{
.el-checkbox {
margin-right: 13px;
margin-top:10px;
margin-top: 10px;
}
.el-checkbox, .el-checkbox__input.is-focus {
.el-checkbox__inner {
border-radius: 50%;

View File

@ -1,5 +1,5 @@
<template>
<div id="user-list">
<div id="user-list" v-loading="loadingData">
<div class="search-bar">
<el-form :inline="true" :model="searchModel" class="demo-form-inline">
<el-form-item>
@ -24,23 +24,23 @@
</el-form-item>
<el-form-item>
<el-select v-model="searchModel.city">
<el-option label="城市" value="-1"></el-option>
<template v-if="cities.length > 0">
<el-option v-for="c in cities" :key="c.code" :label="c.name" :value="c.code"></el-option>
</template>
<el-option v-else label="城市" value="-1"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-input v-model="searchModel.name" placeholder="姓名/openid"></el-input>
</el-form-item>
<el-form-item>
<el-button type="info" @click="onSearch">查询</el-button>
<el-button type="info" @click="resetAndSearch">查询</el-button>
</el-form-item>
</el-form>
</div>
<div class="data-list">
<el-table :data="userList" class="table-border">
<el-table-column label="微信" width="300">
<el-table-column label="微信" width="320">
<template slot-scope="scope">
<div class="user-head-name">
<div class="img">
@ -78,8 +78,12 @@
</el-table>
</div>
<div class="data-page text-right">
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="searchModel.page" :page-sizes="[20, 50, 100, 200]"
<el-pagination @size-change="handleSizeChange"
@current-change="handleCurrentChange"
@prev-click="handPrev"
@next-click="handNext"
:current-page="searchModel.page"
:page-sizes="[20, 50, 100, 200]"
:page-size="searchModel.pageSize"
layout="total, prev, pager, next,sizes, jumper" :total="totalCount">
</el-pagination>
@ -88,22 +92,7 @@
</template>
<script>
var userObj = {
nickname: '张三',
open_id: '123123',
realname: '123123',
gender: 1,
age: 12,
height: 176,
weight: 106,
address: '北京',
smoke: '不抽烟',
drink: '是',
is_first_to_tibet: 1,
medical_history: 1,
medical_history_data: '反流性食道炎、、结肠炎',
}
import cities from '../../utils/distpicker';
import cities from './../../utils/cities';
import {userSearch} from './../../service/api';
export default {
@ -117,12 +106,13 @@
province: '-1',
city: '-1',
gender: '-1',
name: '',
page: 1,
pageSize: 20,
name: ''
pageSize: 20
},
userList: [],
totalCount: 401
totalCount: 0,
loadingData: false
}
},
filters: {
@ -148,6 +138,10 @@
},
methods: {
handleProvinceChange(provinceId) {
if (provinceId == -1) {
this.cities = [];
return;
}
for (var i = 0; i < cities.length; i++) {
if (provinceId && provinceId == cities[i].code) {
this.cities = cities[i].children;
@ -155,16 +149,35 @@
}
}
},
resetAndSearch(){
this.searchModel.page = 1;
this.onSearch();
},
async onSearch() {
this.loadingData = true;
let data = await userSearch(this.searchModel);
this.userList = data.list;
this.totalCount = data.totalCount;
this.loadingData = false;
},
handleSizeChange() {
handleSizeChange(size) {
this.searchModel.pageSize = size
this.onSearch();
},
handleCurrentChange() {
handleCurrentChange(page) {
this.searchModel.page = page
this.onSearch();
},
handPrev() {
if (this.searchModel.page <= 1) {
return;
}
this.searchModel.page--
this.onSearch();
},
handNext() {
this.searchModel.page++
this.onSearch();
}
}
}

View File

@ -51,6 +51,7 @@
// components: {YCIcon},
mounted() {
// console.log('user login loaded');
this.$message.closeAll();
},
created() {
// console.log('user login created');
@ -97,7 +98,10 @@
} else {
appConfig.setUserData(data);
appConfig.setUserToken(data.token);
this.$router.push("/");
let redirect =
this.$router.query && this.$router.query.redirect
?this.$router.query.redirect:null;
this.$router.push(redirect?redirect:"/");
}
} else {
// this.$message.error('');

View File

@ -16,7 +16,8 @@ router.beforeEach((to, from, next) => {
const sessionName = AppConfig.userSessionName;
const path = to.path;
if (path.startsWith('/user/login')) {
sessionStorage.removeItem(sessionName);
// sessionStorage.removeItem(sessionName);
AppConfig.resetUserData();
next();
} else {
let user = sessionStorage.getItem(sessionName);

View File

@ -9,24 +9,25 @@ export const adminRoutes = [
{
path: '/dashboard',
name: 'dashboard',
component: ()=>import('./../pages/Dashboard'),
component: ()=>import(/* Dashboard */'./../pages/Dashboard'),
icon: 'home'
},
{
path: '/users',
name: 'user_index',
component: ()=>import('./../pages/user/Index'),
component: ()=>import(/* user_index */'./../pages/user/Index'),
icon: 'user'
},
{
path: '/history',
name: 'evaluation_history',
component: ()=>import('../pages/evaluation/History'),
component: ()=>import(/* evaluation_history */'../pages/evaluation/History'),
icon: 'file'
},
];
const routes = [{
const routes = [
{
path: '/user',
redirect: '/user/login',
name: 'user_index'

View File

@ -1,6 +1,7 @@
import {
get,
post
post,
buildUrl
} from '../utils/http';
import {
stringify
@ -14,6 +15,12 @@ import {
export async function adminLogin(params = {}) {
return post(`/admin/login`,params);
}
export async function updatePwd(params = {}) {
return post(`/admin/updatePwd`,params);
}
export function getDownloadUrl(params = {}) {
return buildUrl(`/admin/downloadEvaluation?${stringify(params)}`)
}
export async function evaluationSearch(params = {}) {
return get(`/admin/searchEvaluation?${stringify(params)}`);
}
@ -38,7 +45,9 @@ export async function queryComments(params = {}) {
return get(`/comments/query?${stringify(params)}`);
}
export default {
getDownloadUrl,
adminLogin,
updatePwd,
queryNews,
queryHotNews,
queryComments,

View File

@ -10,6 +10,10 @@ export default {
getUserData() {
return currentUserData;
},
resetUserData(){
sessionStorage.removeItem('ms_username');
sessionStorage.removeItem('user_token');
},
setUserData(userData) {
currentUserData = userData;
sessionStorage.setItem('ms_username',userData.username);

38
src/utils/datetime.js Normal file
View File

@ -0,0 +1,38 @@
"use strict";
const tools = {
Y: function (d) {
return d.getFullYear();
},
m: function (d) {
return d.getMonth() + 1;
},
d: function (d) {
return d.getDate();
},
H: function (d) {
return d.getHours();
},
i: function (d) {
return d.getMinutes();
},
s: function (d) {
return d.getSeconds();
},
fileZero: function (v) {
return v < 10 ? '0' + v : v.toString();
}
};
export default (format = 'Y-m-d H:i:s') => {
const arr = format.split('');
let value = [], now = new Date();
arr.forEach((key, i) => {
value.push(
typeof(tools[key]) == "function"
? tools.fileZero(tools[key].call(this, now))
: key
);
})
return value.join('');
}

35
src/utils/datetime_.ts Normal file
View File

@ -0,0 +1,35 @@
const tools = {
Y(d: Date): number {
return d.getFullYear();
},
m(d: Date): number {
return d.getMonth() + 1;
},
d(d: Date): number {
return d.getDate();
},
H(d: Date): number {
return d.getHours();
},
i(d: Date): number {
return d.getMinutes();
},
s(d: Date): number {
return d.getSeconds();
},
fileZero(v: number): string {
return v < 10 ? '0' + v : v.toString();
}
}
export default (format:string = 'Y-m-d H:i:s') => {
const arr = format.split('');
let value = [],now = new Date();
arr.forEach((key,i)=>{
value.push(
typeof(tools[key]) == "function"
?tools.fileZero(tools[key].call(this,now))
:key
);
})
return value.join('');
}

View File

@ -1,4 +1,5 @@
import appConfig from './config';
import router from './../router';
const codeMessage = {
200: '服务器成功返回请求的数据。',
@ -18,6 +19,7 @@ const codeMessage = {
504: '网关超时。',
};
export function get(api) {
return new Promise((resolve, reject) => {
api += (api.search(/\?/) === -1 ? '?' : '&') + 'token=' + appConfig.getUserToken();
@ -26,13 +28,30 @@ export function get(api) {
}).then(res => {
return res.json();
}).then(data => {
resolve(data);
if (data.code && data.code == 401) {
gotoLogin()
} else {
resolve(data);
}
}).catch(data => {
reject(data)
})
})
}
export function buildUrl(api) {
return appConfig.apiUrl + api + (api.search(/\?/) === -1 ? '?' : '&') + 'token=' + appConfig.getUserToken();
}
// import {Message} from 'element-ui';
const gotoLogin = () => {
router.replace({
path: '/user/login',
query: {redirect: router.currentRoute.path},
})
}
/**
* 发送post请求
* @param {string} api
@ -55,7 +74,11 @@ export function post(api, postData) {
}).then(res => {
return res.json();
}).then(data => {
resolve(data);
if (data.code && data.code == 401) {
gotoLogin()
} else {
resolve(data);
}
}).catch(data => {
reject(data)
})
@ -63,5 +86,5 @@ export function post(api, postData) {
}
export default {
get, post
get, post, buildUrl
}

View File

@ -1,22 +1,29 @@
let all = require('./distpicker')
const fs = require('fs')
import formatDate from './datetime'
var ops = [];
all.forEach(o => {
var op = {code: o.code, name: o.name, children: []};
var _c = o.children;
if (_c.length == 1 && _c[0].name == '市辖区') {
_c = _c[0].children;
}
_c.forEach(o => {
op.children.push({
code: o.code, name: o.name
const test1 = ()=>{
var ops = [];
all.forEach(o => {
var op = {code: o.code, name: o.name, children: []};
var _c = o.children;
if (_c.length == 1 && _c[0].name == '市辖区') {
_c = _c[0].children;
}
_c.forEach(o => {
op.children.push({
code: o.code, name: o.name
})
})
ops.push(op);
})
ops.push(op);
})
fs.writeFile('cities.json', JSON.stringify(ops), (err) => {
fs.writeFile('cities.json', JSON.stringify(ops), (err) => {
console.log(err ? err : 'success');
});
console.log(err ? err : 'success');
});
}
const test2 = () =>{
window.console.log(formatDate());
}
test2();