提交 688424d2 编写于 作者: chengxiang.li's avatar chengxiang.li

update

上级 cb408586
......@@ -48,7 +48,11 @@ export default {
},
created() {
vm = this
vm.getToken()
console.log('..>>> ', process.env.BUILD_ENV);
// 本地开发环境,忽略token
if( process.env.BUILD_ENV != 'development'){
vm.getToken()
}
},
mounted() {
......
......@@ -26,6 +26,60 @@ export const getLabelList = (params) => {
})
}
export const createNewLabel = (data) => {
return fetch({
url: getBaseUrl(`healths/labels/`),
headers: {
"Content-Type": 'application/json'
},
method: 'post',
data: data,
description: '新增分组',
})
}
export const changeLabelName = (data) => {
return fetch({
url: getBaseUrl(`healths/labels/`),
// headers: {
// "Content-Type": 'application/json'
// },
method: 'put',
data: data,
description: '修改分组名',
})
}
export const getLabelDetail = (labelId, params) => {
return fetch({
headers,
url: getBaseUrl(`healths/labels/${labelId}/patients`),
method: 'get',
params: params,
description: '获取分组详情',
})
}
export const deleteCurrentLabel = (data) => {
return fetch({
headers,
url: getBaseUrl(`healths/labels/`),
method: 'delete',
data: data,
description: '删除分组',
})
}
export const deleteCurrentPatients = data => {
return fetch({
headers,
url: getBaseUrl(`healths/labels/patients`),
method: 'delete',
data: data,
description: '删除分组下的居民',
})
}
// 获取七牛上传token
export const getQiniuToken = (params) => {
return fetch({
......
......@@ -9,21 +9,21 @@
<div class="component-content screenSet" id="screenSet">
<div class="label-name">
<p class="title">分组名称:</p>
<p class="name">允小雀</p>
<p class="modify">修改</p>
<el-button type="danger" plain size="small" class="delete-label">删除分组</el-button>
<p class="name">{{$route.query.labelName}}</p>
<p class="modify" v-if="!isUngrouped" @click="handleChangeLabelName">修改</p>
<el-button type="danger" plain size="small" class="delete-label" v-if="!isUngrouped" @click="goToDeleteLabel">删除分组</el-button>
</div>
<div class="label-member">
<p class="title">分组成员:</p>
<p class="member-number">888</p>
<p class="member-number">{{searchData.totalRows}}</p>
<div class="right">
<el-button type="primary" size="small" class="create-new-label">添加居民</el-button>
<el-button type="default" size="small" class="create-new-label">批量删除</el-button>
<el-button type="primary" size="small" class="create-new-label" v-if="!isUngrouped" >添加居民</el-button>
<el-button type="default" size="small" class="create-new-label" v-if="!isUngrouped" @click="handleDeletePatients">批量删除</el-button>
</div>
</div>
<el-table
ref="multipleTable"
:data="tableData"
:data="searchData.tableData"
tooltip-effect="dark"
style="width: 100%"
@selection-change="handleSelectionChange">
......@@ -32,32 +32,108 @@
width="55">
</el-table-column>
<el-table-column
prop="name"
label="姓名"
prop="nickname"
width="120">
</el-table-column>
<el-table-column
prop="name"
label="性别"
prop="name"
width="120">
</el-table-column>
<el-table-column
prop="name"
label="年龄"
prop="patientAge"
width="120">
</el-table-column>
<el-table-column
prop="dd"
label="诊断"
prop="dd"
>
</el-table-column>
<el-table-column
prop="name"
width="120"
label="操作"
width="120"
>
<template slot-scope="scope" v-if="!isUngrouped">
<el-button
@click.native.prevent="goToDeleteRow(scope.$index, searchData.tableData)"
type="text"
size="small">
移除
</el-button>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty" v-if="searchData.tableData && searchData.tableData.length < 1">
<img class="empty-pic" src="../../../assets/image/no-content1.png">
<p class="tips">当前分组无成员</p>
</div>
</div>
</el-table>
<el-pagination
class="pagination-style"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="searchData.totalRows"
:current-page="1"
:page-sizes="[10, 30, 50, 100]"
:page-size="searchData.pageSize"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
<el-dialog
title="修改名称"
:visible.sync="showChangeLabelNameDialog"
width="400px"
center
:show-close='false'
:close-on-click-modal="false"
>
<el-form>
<el-form-item :class="changeNameClass">
<el-input
type="textarea"
v-model="ruleForm.newLabelName"
placeholder="请填写分组名称,最多15个字符"
maxlength="15"
>
</el-input>
<div class="err-text">{{changeNameTips}}</div>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="cancelChangeName">取 消</el-button>
<el-button type="primary" @click="confirmChangeName">确 定</el-button>
</span>
</el-dialog>
<el-dialog
title="删除分组"
:visible.sync="centerDialogVisible"
width="400px"
center
:show-close='false'
:close-on-click-modal="false"
>
<div class="delete-tips">分组删除后,所有分组具名(共{{searchData.tableData.length}}人)将不再属于此分组。</div>
<span slot="footer" class="dialog-footer">
<el-button @click="cancelDeleteLabel">取 消</el-button>
<el-button type="primary" @click="confirmDeleteLabel">确认移除</el-button>
</span>
</el-dialog>
<el-dialog
title="移除居民"
:visible.sync="showDeletePatientsDialog"
width="400px"
center
:show-close='false'
:close-on-click-modal="false"
>
<div class="delete-tips">移除后改居民将从分组中移除,若居民已没有任何分组,该居民将被自动分配至「未分组」</div>
<span slot="footer" class="dialog-footer">
<el-button @click="cancelDeletePatients">取 消</el-button>
<el-button type="primary" @click="confirmDeletePatients">确 定</el-button>
</span>
</el-dialog>
</div>
</div>
</template>
......@@ -65,6 +141,13 @@
<script>
import BreadCrumb from "@/components/breadcrumb.vue";
import * as commonUtil from "@/utils/utils";
import {
getLabelDetail,
deleteCurrentLabel,
changeLabelName,
deleteCurrentPatients,
} from '@/utils/patients/patientsapi'
export default {
data(){
......@@ -74,50 +157,220 @@
curmbThird: '分组详情',
jumPathThird: '/patients-manage/labels-manage/labels-list',
labelName: '',
tableData: [{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄',
dd:'第三方说带飞的身份多少发生大幅度沙发上的说带飞说带飞的身份我跟如果如果'
}, {
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-08',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-06',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-07',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}],
isChangeNameError: false,
changeNameTips: '',
showChangeLabelNameDialog: false,
centerDialogVisible: false,
showDeletePatientsDialog: false,
searchData: {
pageNo: 1, // 第几页
pageSize: 10, // 每页条数
tableData: [],
totalRows: 0,
},
ruleForm: {
newLabelName: '', // 修改后的分组名
},
multipleSelection: [],
}
},
components: {
BreadCrumb,
},
computed: {
changeNameClass() {
return this.isChangeNameError == true ? 'special-error-tips' : ''
},
isUngrouped(){ // 是否未分组
return this.$route.query.labelId == 0 ? true : false;
}
},
created() {
this.getDetail();
},
// 挂载到Dom完成时
mounted: function() {
mounted() {
commonUtil.resizeHeight();
},
methods: {
handleSelectionChange(){
console.log('handleSelectionChange>>>>')
getDetail() {
let labelId = this.$route.query.labelId;
// 获取分组详情
let params = {
pageNo: this.searchData.pageNo,
pageSize: this.searchData.pageSize,
};
commonUtil.openLoading(this);
getLabelDetail(labelId, params).then(data => {
commonUtil.closeLoading(this);
console.log('获取分组详情>> ', data)
if(data.data){
this.searchData = data.data;
let list = data.data.patientListsByLabelModels;
if(list && list.length > 0){
this.searchData.tableData = list;
}else{
this.searchData.tableData = [];
}
}
}).catch(err => {
console.log('error: ', err)
});
},
handleSelectionChange(val){
console.log('handleSelectionChange>>>> ', val)
this.multipleSelection = val;
},
handleSizeChange(val){
console.log('handleSizeChange>>>')
this.searchData.pageSize = val;
this.getDetail();
},
handleCurrentChange(val){
console.log('handleCurrentChange>>>', val)
// 切换当前页
this.searchData.pageNo = val;
this.getDetail();
},
deleteLabel(){
let labelId = this.$route.query.labelId;
let params = {
deleteList: [],
};
params.deleteList.push({
labelId: labelId
});
deleteCurrentLabel(params).then(data => {
console.log('删除分组>> ', data)
if(data.code == '000000'){
this.centerDialogVisible = false;
// this.$message({
// message: '删除分组成功',
// type: 'success'
// });
this.$router.replace({
path: '/patients-manage/labels-manage/labels-list',
})
}else{
this.$message({
message: '删除分组失败,请重新再试',
type: 'warning'
});
}
}).catch(err => {
console.log('error: ', err)
});
},
goToDeleteLabel(){
this.centerDialogVisible = true;
},
cancelDeleteLabel(){
this.centerDialogVisible = false;
},
confirmDeleteLabel(){
this.deleteLabel();
},
handleChangeLabelName(){
this.showChangeLabelNameDialog = true;
},
cancelChangeName(){
this.isChangeNameError = false;
this.ruleForm.newLabelName = '';
this.showChangeLabelNameDialog = false;
},
// 更改分组名
confirmChangeName() {
let params = {
labelId: this.$route.query.labelId,
labelName: this.$route.query.labelName,
newLabelName: this.ruleForm.newLabelName,
};
if(!params.newLabelName){
this.isChangeNameError = true;
this.changeNameTips = '请输入分组名';
return;
}
if( params.labelName == params.newLabelName ){
this.isChangeNameError = true;
this.changeNameTips = '该分组名称已被您使用,请重新输入';
return;
}
changeLabelName(params).then(data => {
if(data.code == '000000'){
console.log('分组名修改成功');
this.$message({
message: '分组名修改成功',
type: 'success'
});
this.cancelChangeName();
this.$router.replace({
path: '/patients-manage/labels-manage/labels-detail',
query: {
labelId: params.labelId,
labelName: params.newLabelName,
}
})
}else{
this.$message({
message: '请求接口失败,请重新再试',
type: 'warning'
});
}
}).catch(err => {
console.log('error: ', err)
});
},
goToDeleteRow(index, rows) {
console.log('rows ', rows[index])
this.showDeletePatientsDialog = true;
this.multipleSelection.push({
patientId: rows[index].id
})
},
handleDeletePatients() {
let selectList = this.multipleSelection;
if(selectList.length < 1){
this.$message({
message: '请先勾选病人,再进行删除',
type: 'error'
});
return;
};
console.log('list: ', selectList);
let tempArr = [];
for(let i=0; i<selectList.length; i++){
tempArr.push({
patientId: selectList[i].id
})
}
this.multipleSelection = tempArr;
this.showDeletePatientsDialog = true;
},
cancelDeletePatients() {
this.showDeletePatientsDialog = false;
},
confirmDeletePatients() {
let params = {
labelId: this.$route.query.labelId,
patientList: this.multipleSelection,
};
deleteCurrentPatients(params).then(data => {
if(data.code == '000000'){
this.$message({
message: '移除居民成功',
type: 'success'
});
this.showDeletePatientsDialog = false;
}else{
this.$message({
message: '请求接口失败,请重新再试',
type: 'warning'
});
}
}).catch(err => {
console.log('error: ', err)
});
}
}
}
</script>
......@@ -168,6 +421,31 @@
padding-top: 16px;
}
}
.delete-tips{
text-align: center !important;
line-height: 29px;
padding: 0 20px;
}
.pagination-style{
text-align: right;
}
.table-empty{
width: 100%;
height: auto;
text-align: center;
.empty-pic{
width: 100px;
height: 100px;
display: block;
border: 0;
margin: 0 auto;
}
.tips{
font-size: 14px;
color: #909399;
line-height: 14px;
}
}
}
</style>
......
......@@ -12,23 +12,57 @@
<el-button type="default" size="small" class="create-new-label" @click="resetLabelName">重置</el-button>
</el-col>
<el-col :span="6" class="right">
<el-button type="primary" size="small" class="create-new-label" :disabled="labelNameList.length >= 999">新建分组</el-button>
<el-button
type="primary" size="small" class="create-new-label"
:disabled="labelNameList.length >= 999"
@click="createNewLabel"
>
新建分组
</el-button>
</el-col>
</el-row>
<p class="total-label">共:{{labelNameList.length}}个分组</p>
<div class="label-list" v-if="labelNameList && labelNameList.length>0">
<el-tag class="each-label" @click="goToDetail" v-for="(item, index) in labelNameList" :key="index">{{item.labelName}}({{item.labelPatientNums}}人)</el-tag>
<div class="label-list" v-if="labelNameList && labelNameList.length > 0">
<el-tag class="each-label" @click="goToDetail(item)" v-for="(item, index) in labelNameList" :key="index">{{item.labelName}}({{item.labelPatientNums}}人)</el-tag>
</div>
<div class="table-empty" v-if="labelNameList && labelNameList.length < 1">
<img class="empty-pic" src="../../../assets/image/no-content1.png">
<p class="tips">未找到相似分组</p>
</div>
<el-dialog
class="dialog-boxd"
title="新增分组"
:visible.sync="centerDialogVisible"
width="400px"
center
:show-close='false'
:close-on-click-modal="false"
>
<el-form>
<el-form-item :class="addNewLabelClass">
<el-input
type="textarea"
v-model="ruleForm.newLabelName"
placeholder="请填写分组名称,最多15个字符"
maxlength="15"
>
</el-input>
<div class="err-text">{{addNewLabelTips}}</div>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="handleClose">取 消</el-button>
<el-button type="primary" @click="submitForm">确 定</el-button>
</span>
</el-dialog>
</div>
</div>
</template>
<script>
import BreadCrumb from "@/components/breadcrumb.vue";
import * as commonUtil from "@/utils/utils";
import { getLabelList } from '@/utils/patients/patientsapi'
import { getLabelList, createNewLabel } from '@/utils/patients/patientsapi'
export default {
data(){
return {
......@@ -36,6 +70,12 @@
curmbSecond: "分组管理",
labelName: '',
labelNameList: [],
centerDialogVisible: false,
ruleForm: {
newLabelName: '', // 新建分组名
},
addNewLabelTips: '',
isAddLabelError: false,
}
},
components: {
......@@ -44,22 +84,27 @@
created(){
this.getList();
},
computed: {
addNewLabelClass() {
return this.isAddLabelError == true ? 'special-error-tips' : ''
}
},
// 挂载到Dom完成时
mounted: function() {
mounted() {
commonUtil.resizeHeight();
},
methods: {
getList(){
getList() {
// 获取分组列表
let num = {
let params = {
type: 1,
token : localStorage.getItem("token"),
};
if(this.labelName){
num.labelName = this.labelName;
params.labelName = this.labelName;
}
commonUtil.openLoading(this);
getLabelList(num).then(data => {
getLabelList(params).then(data => {
commonUtil.closeLoading(this);
// console.log('获取分组列表>> ', data)
if(data.data && data.data.labelNameList){
......@@ -69,17 +114,79 @@
console.log('error: ', err)
});
},
resetLabelName(){
resetLabelName() {
this.labelName = '';
this.getList();
},
createNewLabel() {
console.log('新增分组...');
this.centerDialogVisible = true;
},
submitForm() {
let params = {
labelName: this.ruleForm.newLabelName,
};
if(!params.labelName){
this.isAddLabelError = true;
this.addNewLabelTips = '请输入分组名';
return;
}
// 请求新增
// commonUtil.openLoading(this);
createNewLabel(params).then(data => {
// commonUtil.closeLoading(this);
console.log('新增分组>> ', data)
if(data.code == '202520'){ // 分组名重复
console.log('tips: ', data.message)
this.isAddLabelError = true;
this.addNewLabelTips = '该分组名称已被您使用,请重新输入';
return;
}
if(data.code == '000000'){
console.log('新增成功');
this.$message({
message: '新增分组成功',
type: 'success'
});
this.handleClose();
this.$router.push({
path: '/patients-manage/labels-manage/labels-detail',
query: {
labelId: data.data.labelId,
labelName: params.labelName
}
})
callback();
}else{
this.$message({
message: '接口返回失败,请重新再试',
type: 'warning'
});
callback();
}
}).catch(err => {
console.log('error: ', err)
});
},
handleClose() {
this.isAddLabelError = false;
this.ruleForm.newLabelName = '';
this.centerDialogVisible = false
},
goToDetail(){
this.$router.push({path: '/patients-manage/labels-manage/labels-detail'})
goToDetail(item) {
this.$router.push({
path: '/patients-manage/labels-manage/labels-detail',
query: {
labelId: item.labelId,
labelName: item.labelName,
}
})
}
}
}
</script>
<style lang="less" >
<style lang="less" scoped>
.label-list-wrap{
.screenSet{
background: #fff;
......@@ -146,7 +253,59 @@
background-color: #bbb;
}
}
.table-empty{
width: 100%;
height: auto;
text-align: center;
.empty-pic{
width: 100px;
height: 100px;
display: block;
border: 0;
margin: 0 auto;
}
.tips{
font-size: 14px;
color: #909399;
}
}
}
</style>
<style lang="less">
.label-list-wrap{
.el-form-item{
margin-bottom: 0;
.el-textarea{
position: relative;
}
.el-textarea__inner{
outline: none !important;
resize: none !important;
height: 80px;
}
&.special-error-tips{
.el-textarea__inner{
border: 1px solid #F56C6C !important;
outline: none;
resize: none;
}
.err-text{
display: block;
position: absolute;
left: 0;
top: 80px;
}
}
.err-text{
display: none;
color: #F56C6C;
font-size: 12px;
padding-top: 4px;
line-height: 12px;
}
}
}
</style>
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册