first commit
This commit is contained in:
@@ -0,0 +1,290 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<style>
|
||||
|
||||
.note .el-textarea__inner {
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<guava>
|
||||
<el-card shadow="never">
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-date-picker
|
||||
v-model="pageForm.year"
|
||||
value-format="yyyy"
|
||||
type="year"
|
||||
placeholder="选择年">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-button type="primary" icon="el-icon-search" @click="doSearch">搜索</el-button>
|
||||
</div>
|
||||
|
||||
</el-card>
|
||||
<el-card shadow="never" class="mt10">
|
||||
<table-tool label="我的预约记录" :app="this">
|
||||
<template #func>
|
||||
|
||||
</template>
|
||||
</table-tool>
|
||||
<el-table :data="tableData" stripe border :size="tableSize" style="width: 100%">
|
||||
<el-table-column type="index" label="序号" width="80px"></el-table-column>
|
||||
<el-table-column
|
||||
align="center"
|
||||
header-align="center"
|
||||
v-for="column in tableColumns"
|
||||
show-overflow-tooltip
|
||||
:label="column.label"
|
||||
:prop="column.prop"
|
||||
:sortable="column.sortable"
|
||||
:width="column.width"
|
||||
>
|
||||
<template v-if="column.prop==='appointmentTime'" scope="{row}">
|
||||
{{row.startTime+' 至 '+row.endTime}}
|
||||
</template>
|
||||
<template v-else-if="column.prop==='stateName'" scope="{row}">
|
||||
<span :style="{color:row.stateColor}">
|
||||
{{row.stateName}}
|
||||
</span>
|
||||
</template>
|
||||
<template v-else-if="column.prop==='doctorUserName'" scope="{row}">
|
||||
<span v-if="row.doctorUser">
|
||||
{{row.doctorUserName}}
|
||||
</span>
|
||||
<span v-else>
|
||||
<span>暂未分配</span>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
</el-table-column>
|
||||
<el-table-column align="center" header-align="center" label="操作" width="250">
|
||||
<template scope="{row}">
|
||||
<el-button size="mini" type="primary" @click="openView(row)">查看预约</el-button>
|
||||
<el-button v-if="moment().unix() < moment(row.startTime).unix()" size="mini" type="danger"
|
||||
@click="doCancel(row.id)">取消预约
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--#include("/layouts/pagination.html"){}#-->
|
||||
</el-card>
|
||||
</guava>
|
||||
|
||||
<el-dialog :visible.sync="appointmentDialogVisible" width="60%" title="预约信息" top="100px">
|
||||
<el-form :model="formData" label-width="100px">
|
||||
<vi-title title="预约时间段"></vi-title>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="开始时间">
|
||||
<el-date-picker
|
||||
readonly style="width: 100%"
|
||||
v-model="formData.startTime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="datetime"
|
||||
placeholder="选择日期时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="结束时间">
|
||||
<el-date-picker
|
||||
readonly style="width: 100%"
|
||||
v-model="formData.endTime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="datetime"
|
||||
placeholder="选择日期时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<vi-title title="预约人信息"></vi-title>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="姓名">
|
||||
<!--<el-input value="${@shiro.getPrincipalProperty('username')}" readonly></el-input>-->
|
||||
<el-input :value="formData.appointmentUserName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="工号">
|
||||
<!--<el-input value="${@shiro.getPrincipalProperty('loginname')}" readonly></el-input>-->
|
||||
<el-input :value="formData.appointmentLoginName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="单位">
|
||||
<!--<el-input value="${@shiro.getPrincipalProperty('unit').getName()}" readonly></el-input>-->
|
||||
<el-input :value="formData.appointmentUnitName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="手机号">
|
||||
<!--<el-input value="${@shiro.getPrincipalProperty('mobile')}" readonly></el-input>-->
|
||||
<el-input :value="formData.appointmentMobile" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="预约咨询方式">
|
||||
<el-select
|
||||
v-model="formData.appointmentAskTypeValue"
|
||||
filterable disabled placeholder=""
|
||||
style="width: 100%">
|
||||
<el-option v-for="item in askTypeList" :label="item.name" :value="item.code"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="预约备注" class="note">
|
||||
<el-input type="textarea" :row="1" v-model="formData.appointmentUserNote" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<vi-title title="咨询师信息"></vi-title>
|
||||
<template v-if="formData.doctorUser">
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="姓名">
|
||||
<el-input :value="formData.doctorUserName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="单位">
|
||||
<el-input :value="formData.doctorUnitName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="电话">
|
||||
<el-input :value="formData.doctorMobile" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="职称">
|
||||
<el-input :value="formData.doctorJobTitle" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="个人简介">
|
||||
<el-input type="textarea" :row="3" :value="formData.doctorIntroduce" readonly></el-input>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="text-center m20">
|
||||
<svg t="1639556622680" class="icon" viewBox="0 0 1658 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="2268" width="200" height="200">
|
||||
<path d="M116.303139 786.479504c0 112.412717 308.981404 203.530494 690.447511 203.735253 381.466107 0 690.857029-91.117776 691.061788-203.530494v-0.204759c0-112.412717-309.186163-203.530494-690.65227-203.530494-381.466107-0.204759-690.857029 90.913017-690.857029 203.530494z"
|
||||
fill="#EDE6D6" p-id="2269"></path>
|
||||
<path d="M0 706.418716c0 12.080784 26.004399 21.909218 58.15157 21.909218s58.15157-9.828434 58.151569-21.909218c0-12.080784-26.004399-21.909218-58.151569-21.909218S0 694.542691 0 706.418716z m1512.35033 123.674465c0 15.971206 32.556689 29.075785 72.689462 29.075785s72.689462-12.89982 72.689462-29.075785c0-15.971206-32.556689-29.075785-72.689462-29.075784s-72.689462 12.89982-72.689462 29.075784z"
|
||||
fill="#EFEAD5" p-id="2270"></path>
|
||||
<path d="M247.144171 227.896821v535.240152c0 17.814037 14.128374 33.170966 33.990002 37.061387l524.797441 103.40332V290.34833c-372.456709-47.29934-558.787443-68.184763-558.787443-62.451509z"
|
||||
fill="#FBE8D7" p-id="2271"></path>
|
||||
<path d="M1358.576285 227.896821v535.240152c0 17.609278-14.128374 32.966207-33.785243 37.061387l-519.064187 103.608079-5.938013-613.458109c372.661468-47.29934 558.787443-68.184763 558.787443-62.451509z"
|
||||
fill="#E8C3A0" p-id="2272"></path>
|
||||
<path d="M101.765247 426.308338l148.245551-211.925615 556.125575 67.980004-129.612478 253.082184-574.758648-109.136573z"
|
||||
fill="#FEF6EF" p-id="2273"></path>
|
||||
<path d="M793.236553 278.472306L929.606079 532.987802l572.711058-116.917416-137.188563-203.735253L799.379324 278.472306h-6.142771z"
|
||||
fill="#F9DBC0" p-id="2274"></path>
|
||||
<path d="M750.237153 159.09778h-32.556689c-44.023195 0-79.65127-35.628074-79.65127-79.651269C638.029194 35.628074 673.657269 0 717.680464 0h363.242551c44.023195 0 79.65127 35.628074 79.65127 79.65127s-35.628074 79.65127-79.65127 79.651269H827.226555"
|
||||
fill="#2878FF" opacity=".5" p-id="2275"></path>
|
||||
<path d="M739.384923 108.727055c-15.971206 0.204759-29.280544-12.490302-29.690062-28.461508s12.490302-29.280544 28.461508-29.690062c15.971206-0.204759 29.280544 12.490302 29.485303 28.666267 0.409518 15.971206-12.285543 29.075785-28.256749 29.485303z m159.916817 0c-15.971206 0.204759-29.280544-12.490302-29.690062-28.461508s12.490302-29.280544 28.461507-29.690062c15.971206-0.204759 29.280544 12.490302 29.485303 28.666267 0.409518 15.971206-12.285543 29.075785-28.256748 29.485303z m159.916816 0c-15.971206 0-29.075785-13.104579-29.075785-29.075785s13.104579-29.075785 29.075785-29.075785c15.971206 0 29.075785 13.104579 29.075785 29.075785 0 15.971206-13.104579 29.075785-29.075785 29.075785z"
|
||||
fill="#FFFFFF" p-id="2276"></path>
|
||||
<path d="M1042.428314 486.302739l2.661868-11.466506s-18.837832-15.561688-17.609278-33.170966c1.433313-17.609278 12.89982-28.256749 12.89982-28.256749h35.013797l-5.323735 59.380124 0.614277 10.033194-28.256749 3.480903z m43.20416 508.416717l0.614277 8.804639h12.080783l-2.04759-11.466507-10.64747 2.661868z"
|
||||
fill="#F6D0C3" p-id="2277"></path>
|
||||
<path d="M1058.604279 1011.714457s1.433313-8.804639 7.371326-9.418916c5.323735-0.614277 26.413917 0.614277 32.351929 1.433313 0.614277 0 2.04759 0.614277 2.047591 2.047591v6.757048c0 1.433313-0.614277 2.04759-2.047591 2.047591H1058.604279v-2.866627z"
|
||||
fill="#333333" p-id="2278"></path>
|
||||
<path d="M1021.542891 1004.138372l0.614278 8.804639h11.466506l-1.433313-11.466506-10.647471 2.661867z"
|
||||
fill="#F6D0C3" p-id="2279"></path>
|
||||
<path d="M994.514697 1021.133373s1.433313-8.804639 7.371326-9.418916c5.323735-0.614277 26.413917 0.614277 32.351929 1.433313 0.614277 0 2.04759 0.614277 2.047591 2.047591v6.757049c0 1.433313-0.614277 2.04759-2.047591 2.04759h-39.928014v-2.866627z m89.889222-25.594881h13.514097l5.323736-143.126574c0-7.371326 1.433313-14.128374 2.661867-20.885423 6.757049-27.642472 21.704459-106.679464 17.609278-142.512298l-12.080783-20.885423-74.327535 4.095181s9.418916 87.022595 20.271146 121.422116c2.04759 6.757049 4.095181 13.514097 4.709458 20.271146l22.318736 181.621275z"
|
||||
fill="#333333" p-id="2280"></path>
|
||||
<path d="M982.433913 663.214557l37.061388 342.971406h14.94741l7.371326-140.464707c0.614277-8.190362 2.04759-16.380724 4.095181-24.366327 8.190362-31.123375 30.304339-108.112777 28.256749-154.593081l-91.732054-23.547291z"
|
||||
fill="#3A3A3A" p-id="2281"></path>
|
||||
<path d="M1144.39832 557.354129s12.080784 39.108978 10.85223 55.284943c-1.433313 14.128374-10.033193 51.394521-33.170966 56.103979l-0.614277-87.841631 21.704459-22.933014 1.228554-0.614277z m-180.802239 2.661868s-12.080784 39.108978-10.85223 55.284943c1.433313 14.128374 10.033193 51.394521 33.170966 56.103979l0.614277-87.841632-21.704459-22.933013-1.228554-0.614277z m74.122775-128.998201s6.142771-6.142771 10.85223-4.095181c5.323735 2.04759 6.142771 12.89982 3.276145 27.028195-2.661868 14.128374-15.561688-9.418916-15.561688-9.418916l1.433313-13.514098z"
|
||||
fill="#F6D0C3" p-id="2282"></path>
|
||||
<path d="M1043.861628 427.741652c-4.095181 0.614277-8.804639-0.614277-11.466507-4.095181-4.095181-5.323735-8.804639-13.514097-4.095181-19.656869 7.371326-10.033193 27.642472-17.609278 45.866027-7.371326 18.223555 10.033193 20.271146 33.170966 20.271146 33.170966s-1.433313 41.770846-25.594881 41.770846h-6.142772c-2.661868 0-5.323735-2.04759-6.142771-4.095181-3.276145-8.804639-4.709458-18.223555-4.095181-27.642471v-6.142772c-0.614277-5.938012-4.504699-6.757049-8.59988-5.938012z"
|
||||
fill="#333333" p-id="2283"></path>
|
||||
<path d="M1146.445911 557.968406c-16.995001-35.013797-46.480304-59.175365-60.813437-69.413317-3.890422-3.071386-6.961808-4.914217-8.190362-5.528494-4.709458-2.04759-27.642472 0-37.061388 2.04759-1.842831 0.409518-4.914217 2.25235-8.804639 4.709458-14.742651 8.59988-52.623075 33.170966-70.846631 70.846631l22.318736 36.447111 0.204759-0.20476-0.819036 73.918017c0 4.095181 2.04759 8.190362 5.323735 8.804639 71.665667 34.39952 121.422116 16.790242 134.321936 10.852229 2.04759-0.614277 4.095181-2.661868 4.095181-4.709458 3.685663-24.571086 3.071386-62.45151 1.023795-95.008198l19.247351-32.761448z"
|
||||
fill="#2878FF" p-id="2284"></path>
|
||||
<path d="M250.010798 214.382723l466.85063 71.05139v-118.760248l-4.29994-0.409518z"
|
||||
fill="#E0BC9C" p-id="2285"></path>
|
||||
<path d="M785.865227 289.119776l579.468106-76.784643L712.561488 166.264347V284.615077l73.303739 4.504699z"
|
||||
fill="#FBECDA" p-id="2286"></path>
|
||||
</svg>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
</el-form>
|
||||
<el-row class="text-right">
|
||||
<el-button type="primary" @click="appointmentDialogVisible = false">确定</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [initTableMixins],
|
||||
data() {
|
||||
return {
|
||||
askTypeList: [],
|
||||
askTypeArray: [],
|
||||
tableColumns: [
|
||||
{prop: 'appointmentTime', label: '预约时间', width: '350'},
|
||||
{prop: 'appointmentUserName', label: '姓名'},
|
||||
{prop: 'appointmentLoginName', label: '工号'},
|
||||
{prop: 'appointmentUnitName', label: '单位'},
|
||||
{prop: 'doctorUserName', label: '心理咨询师'},
|
||||
{prop: 'stateName', label: '预约状态'}
|
||||
],
|
||||
appointmentDialogVisible: false,
|
||||
pageForm: {
|
||||
year: null
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async doCancel(id) {
|
||||
const confirm = await this.$confirm('确认取消此次预约吗?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
if (confirm === 'confirm') {
|
||||
const resp = await $.post(loc() + '/doCancel', {id})
|
||||
if (resp.code === 0) {
|
||||
this.notifySuccess(resp.msg)
|
||||
this.doSearch()
|
||||
} else {
|
||||
this.notifyError(resp.msg)
|
||||
}
|
||||
}
|
||||
},
|
||||
openView(row) {
|
||||
this.formData = row
|
||||
this.appointmentDialogVisible = true
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.askTypeList = await getDictOptions("psychology_asktype")
|
||||
this.pageForm.year = new Date().getFullYear().toString()
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,385 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/plugins/jqFullCalendar/css/fullcalendar.css">
|
||||
<script src="${base!}/assets/platform/plugins/jqFullCalendar/js/fullcalendar.min.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/jqFullCalendar/js/moment.min.js"></script>
|
||||
|
||||
<style>
|
||||
#calendar {
|
||||
max-width: 1200px;
|
||||
margin: 20px auto 0;
|
||||
}
|
||||
|
||||
.fc-toolbar {
|
||||
display: block !important;
|
||||
visibility: unset !important;
|
||||
}
|
||||
|
||||
.gray {
|
||||
color: #FFFFFF;
|
||||
background-color: #7f8481;
|
||||
border: 1px solid #c6cbc8;
|
||||
}
|
||||
|
||||
.el-textarea__inner {
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
.green {
|
||||
color: #FFFFFF;
|
||||
background-color: #369a5f;
|
||||
border: 1px solid #257e4a;
|
||||
}
|
||||
|
||||
.fc-time-grid-event.fc-short .fc-time:before {
|
||||
content: none;
|
||||
}
|
||||
|
||||
.fc-time-grid-event.fc-short .fc-time span {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.fc-ltr .fc-time-grid .fc-event-container {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.el-row--flex.is-justify-space-between {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<guava>
|
||||
<el-card shadow="never">
|
||||
<div id="psychology-calendar"></div>
|
||||
</el-card>
|
||||
</guava>
|
||||
|
||||
<el-dialog :visible.sync="appointmentDialogVisible" width="60%" title="预约信息" :close-on-click-modal="false"
|
||||
top="50px">
|
||||
<el-form :model="formData" ref="ruleForm" label-width="120px" :rules="rules">
|
||||
<vi-title title="预约时间段"></vi-title>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="开始时间">
|
||||
<el-date-picker
|
||||
readonly
|
||||
v-model="formData.startTime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="datetime"
|
||||
style="width: 100%"
|
||||
placeholder="选择日期时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="结束时间">
|
||||
<el-date-picker
|
||||
readonly style="width: 100%"
|
||||
v-model="formData.endTime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="datetime"
|
||||
placeholder="选择日期时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<vi-title title="咨询师信息"></vi-title>
|
||||
<template v-if="formData.doctorUser">
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="姓名">
|
||||
<el-input :value="formData.doctorUserName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="性别">
|
||||
<el-input :value="formData.doctorSex" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="单位">
|
||||
<el-input :value="formData.doctorUnitName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="电话">
|
||||
<el-input :value="formData.doctorMobile" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<template v-else>
|
||||
..
|
||||
</template>
|
||||
|
||||
<vi-title title="预约人信息"></vi-title>
|
||||
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="姓名">
|
||||
<el-input value="${@shiro.getPrincipalProperty('username')}" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="工号">
|
||||
<el-input value="${@shiro.getPrincipalProperty('loginname')}" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="单位">
|
||||
<el-input value="${@shiro.getPrincipalProperty('unit').getName()}" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="手机号" prop="userMobile">
|
||||
<el-input v-model="formData.userMobile" placeholder="请填写联系方式"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="预约咨询方式" prop="appointmentAskTypeValue">
|
||||
<el-select
|
||||
v-model="formData.appointmentAskTypeValue"
|
||||
filterable
|
||||
style="width: 100%"
|
||||
placeholder="请选择咨询方式">
|
||||
<el-option v-for="item in askTypeArray" :key="item.code" :label="item.name"
|
||||
:value="item.code"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="预约备注">
|
||||
<el-input type="textarea" :row="3" v-model="formData.appointmentUserNote"
|
||||
placeholder="请输入预约备注事项"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
</el-form>
|
||||
<el-row class="text-center">
|
||||
<el-button @click="appointmentDialogVisible = false">关闭</el-button>
|
||||
<el-button type="primary" @click="doAdd">确定</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
let calendar = null
|
||||
const vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [initTableMixins],
|
||||
data() {
|
||||
return {
|
||||
askTypeList: [],
|
||||
askTypeArray: [],
|
||||
events: [],
|
||||
appointmentDialogVisible: false,
|
||||
calendarHeight: 0,
|
||||
rules: {
|
||||
appointmentAskTypeValue: [{required: true, message: '请选择咨询方式', trigger: ['change']}],
|
||||
userMobile: [{required: true, message: '请填写联系方式', trigger: ['change']}],
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
initCalendar() {
|
||||
const that = this
|
||||
if (calendar) {
|
||||
return
|
||||
}
|
||||
calendar = $('#psychology-calendar').fullCalendar({
|
||||
header: { //设置日历头部信息，false，则不显示头部信息。包括left，center,right左中右三个位置
|
||||
left: 'prev,next, today', //上一个、下一个、今天
|
||||
center: 'title', //标题
|
||||
right: 'month,agendaWeek,agendaDay' //月、周、日、日程列表
|
||||
},
|
||||
locale: 'zh-cn', //?没用？
|
||||
timeFormat: 'HH:mm', //日程事件的时间格式
|
||||
|
||||
buttonText: { //各按钮的显示文本信息
|
||||
today: '今天',
|
||||
month: '月',
|
||||
agendaWeek: '周',
|
||||
agendaDay: '日',
|
||||
listMonth: '日程',
|
||||
},
|
||||
monthNames: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"], //月份全称
|
||||
monthNamesShort: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"], //月份简写
|
||||
dayNames: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"], //周全称
|
||||
dayNamesShort: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"], //周简写
|
||||
noEventsMessage: "当月无数据", //listview视图下，无数据提示
|
||||
allDayText: "全天", //自定义全天视图的名称
|
||||
allDaySlot: false, //是否在周日历上方显示全天
|
||||
allDayDefault: false, //是否为全天日程事件，显示这一天中所做的事情
|
||||
slotDuration: "00:30:00", //一格时间槽代表多长时间，默认00:30:00（30分钟）
|
||||
slotLabelFormat: "H(:mm)a", //日期视图左边那一列显示的每一格日期时间格式
|
||||
slotLabelInterval: "01:00:00", //日期视图左边那一列多长间隔显示一条日期文字(默认跟着slotDuration走的，可自定义)
|
||||
snapDuration: "01:00:00", //其实就是动态创建一个日程时，默认创建多长的时间块
|
||||
firstDay: 1, //一周中显示的第一天是哪天，周日是0，周一是1，类推
|
||||
hiddenDays: [], //隐藏一周中的某一天或某几天，数组形式，如隐藏周二和周五：[2,5]，默认不隐藏，除非weekends设置为false。
|
||||
weekends: true, //是否显示周六和周日，设为false则不显示周六和周日。默认值为true
|
||||
weekMode: 'fixed', //月视图里显示周的模式，因每月周数不同月视图高度不定。fixed：固定显示6周高，日历高度保持不变liquid：不固定周数，高度随周数变化variable：不固定周数，但高度固定
|
||||
weekNumbers: false, //是否在日历中显示周次(一年中的第几周)，如果设置为true，则会在月视图的左侧、周视图和日视图的左上角显示周数。
|
||||
weekNumberCalculation: 'iso', //周次的显示格式。
|
||||
height: that.calendarHeight, //设置日历的高度，包括header日历头部，默认未设置，高度根据aspectRatio值自适应。
|
||||
// contentHeight: 600, //设置日历主体内容的高度，不包括header部分，默认未设置，高度根据aspectRatio值自适应。
|
||||
handleWindowResize: true, //是否随浏览器窗口大小变化而自动变化。
|
||||
defaultView: 'agendaWeek', //初始化时默认视图，默认是月month，agendaWeek是周，agendaDay是当天
|
||||
slotEventOverlap: false, //事件是否可以重叠覆盖
|
||||
defaultDate: moment().format('YYYY-MM-DD'), //默认显示那一天的日期视图getDates(true)2020-05-10
|
||||
nowIndicator: false, //周/日视图中显示今天当前时间点（以红线标记），默认false不显示
|
||||
eventLimit: 2, //数据条数太多时，限制显示条数（多余的以“+2more”格式显示），默认false不限制,支持输入数字设定固定的显示条数
|
||||
eventLimitText: "更多", //当一块区域内容太多以"+2 more"格式显示时，这个more的名称自定义（应该与eventLimit: true一并用）
|
||||
dayPopoverFormat: "YYYY年M月d日预约信息", //点开"+2 more"弹出的小窗口标题，与eventLimitClick可以结合用
|
||||
render: (view) => { //method,绑定日历到id上。$('#id').fullCalendar('render');
|
||||
},
|
||||
viewRender: (view) => {
|
||||
that.getData()
|
||||
},
|
||||
eventRender: (info) => {
|
||||
// $(info.el).html(info.event.title);
|
||||
},
|
||||
//日历数据源
|
||||
events: that.events,
|
||||
eventClick: async (event, jsEvent) => {
|
||||
this.askTypeArray = []
|
||||
if (event.o.appointmentUser) {
|
||||
return
|
||||
}
|
||||
if (new Date().getTime() > event.o.startTimeTs) {
|
||||
return
|
||||
}
|
||||
|
||||
//查询最近半年有没有预约3次，半年内不超过3次
|
||||
const {data: applyNum} = await $.post("/platform/psychology/appointmentApply/getAppointmentApplyNum")
|
||||
if (applyNum) {
|
||||
this.notifyWarning("您半年内已预约三次暂时无法在预约")
|
||||
return
|
||||
}
|
||||
this.appointmentDialogVisible = true
|
||||
that.formData = event.o
|
||||
if (event.askTypeList) {
|
||||
const array = JSON.parse(event.askTypeList)
|
||||
this.askTypeList.map(o => {
|
||||
if (array.includes(o.code)) {
|
||||
this.askTypeArray.push(o)
|
||||
}
|
||||
})
|
||||
}
|
||||
if (this.askTypeArray && this.askTypeArray.length === 1) {
|
||||
that.$set(that.formData, 'appointmentAskTypeValue', this.askTypeArray[0].code)
|
||||
that.$set(that.formData, 'userMobile', "${@shiro.getPrincipalProperty('mobile')}")
|
||||
}
|
||||
},
|
||||
selectable: false, //是否允许通过单击或拖动选择日历中的对象，包括天和时间
|
||||
selectMirror: true, //镜像
|
||||
lazyFetching: false, //是否启用懒加载技术--即只取当前条件下的视图数据，其它数据在切换时触发，默认true只取当前视图的，false是取全视图的
|
||||
defaultTimedEventDuration: "01:00:00", //在Event Object中如果没有end参数时使用，如start=7:00pm，则该日程对象时间范围就是7:00~9:00
|
||||
defaultAllDayEventDuration: {days: 1}, //默认1天是多长，（有的是采用工作时间模式，所以支持自定义）
|
||||
});
|
||||
},
|
||||
//获取预约数据
|
||||
async getData() {
|
||||
if (!calendar) {
|
||||
return
|
||||
}
|
||||
const view = calendar.fullCalendar('getView')
|
||||
//这里取时间戳
|
||||
const startTimeTs = view.start._i
|
||||
const endTimeTs = view.end._i
|
||||
const resp = await $.get('/platform/psychology/appointmentSet/getAppointmentInfo', {
|
||||
startTimeTs,
|
||||
endTimeTs
|
||||
})
|
||||
let events = []
|
||||
if (resp.code === 0) {
|
||||
const userId = "${@shiro.getPrincipalProperty('id')}";
|
||||
resp.data.forEach(v => {
|
||||
let className = ''
|
||||
let title = ''
|
||||
if (new Date().getTime() > v.startTimeTs) {
|
||||
className = 'gray'
|
||||
title = '不可预约'
|
||||
} else {
|
||||
if (!v.appointmentUser) {
|
||||
className = 'green'
|
||||
title = '可预约'
|
||||
} else if (v.appointmentUser === userId) {
|
||||
className = 'blue'
|
||||
title = '我已预约'
|
||||
} else {
|
||||
className = 'gray'
|
||||
title = '不可预约'
|
||||
}
|
||||
}
|
||||
events.push({
|
||||
id: v.id,
|
||||
title: title,
|
||||
start: v.startTime,
|
||||
end: v.endTime,
|
||||
className: className,
|
||||
o: v,
|
||||
askTypeList: v.askType,
|
||||
})
|
||||
})
|
||||
}
|
||||
calendar.fullCalendar('removeEvents', () => true)
|
||||
calendar.fullCalendar('addEventSource', events, true);
|
||||
},
|
||||
//预约
|
||||
async doAdd() {
|
||||
this.$refs["ruleForm"].validate(async (valid) => {
|
||||
if (valid) {
|
||||
const params = {
|
||||
appointmentUserNote: this.formData.appointmentUserNote,
|
||||
id: this.formData.id,
|
||||
userMobile: this.formData.userMobile,
|
||||
appointmentAskTypeValue: this.formData.appointmentAskTypeValue
|
||||
}
|
||||
const resp = await $.post(loc() + '/doApply', params)
|
||||
if (resp.code === 0) {
|
||||
this.notifySuccess(resp.msg)
|
||||
this.appointmentDialogVisible = false
|
||||
await this.getData()
|
||||
} else if (resp.code === 1) {
|
||||
this.notifyError(resp.msg)
|
||||
} else if (resp.code === 2) {
|
||||
this.notifyWarning(resp.msg)
|
||||
await this.getData()
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
setTimeout(() => {
|
||||
this.calendarHeight = window.innerHeight - 50 - 60
|
||||
}, 100)
|
||||
},
|
||||
async created() {
|
||||
this.askTypeList = await getDictOptions("psychology_asktype")
|
||||
this.$nextTick(() => {
|
||||
setTimeout(() => {
|
||||
this.initCalendar()
|
||||
this.getData()
|
||||
}, 100)
|
||||
})
|
||||
},
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,755 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/plugins/jqFullCalendar/css/fullcalendar.css">
|
||||
<script src="${base!}/assets/platform/plugins/jqFullCalendar/js/fullcalendar.min.js"></script>
|
||||
<script src="${base!}/assets/platform/plugins/jqFullCalendar/js/moment.min.js"></script>
|
||||
|
||||
<style>
|
||||
#calendar {
|
||||
max-width: 1200px;
|
||||
margin: 20px auto 0;
|
||||
}
|
||||
|
||||
.fc-toolbar {
|
||||
display: block !important;
|
||||
visibility: unset !important;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
预约成功
|
||||
*/
|
||||
.green {
|
||||
color: #FFFFFF;
|
||||
background-color: #369a5f;
|
||||
border: 1px solid #257e4a;
|
||||
}
|
||||
|
||||
/**
|
||||
无预约人
|
||||
*/
|
||||
.yellow {
|
||||
color: #FFFFFF;
|
||||
background-color: #f3b20f;
|
||||
border: 1px solid #af7d00;
|
||||
}
|
||||
|
||||
/**
|
||||
有预约人了但是没分配咨询师
|
||||
*/
|
||||
.red {
|
||||
color: #FFFFFF;
|
||||
background-color: #ea5454;
|
||||
border: 1px solid #b11616;
|
||||
}
|
||||
|
||||
.fc-time-grid-event.fc-short .fc-time:before {
|
||||
content: none;
|
||||
}
|
||||
|
||||
.fc-time-grid-event.fc-short .fc-time span {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.fc-ltr .fc-time-grid .fc-event-container {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.el-row--flex.is-justify-space-between {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<guava>
|
||||
<!-- <el-card shadow="never">-->
|
||||
<!-- <div class="btn-group tool-button mt5">-->
|
||||
<!-- <el-button type="primary" icon="el-icon-search" @click="doSearch">搜索</el-button>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <div class="pull-right offscreen-right mt5">-->
|
||||
<!-- <el-button type="primary">-->
|
||||
<!-- <i class="ti-plus"></i>-->
|
||||
<!-- 设置预约时间段-->
|
||||
<!-- </el-button>-->
|
||||
<!-- </div>-->
|
||||
<!-- </el-card>-->
|
||||
|
||||
<el-card shadow="never">
|
||||
<div>
|
||||
<vi-title2 title="是否开启短信通知：">
|
||||
<template #func>
|
||||
<el-switch v-model="isSendMsg" active-text="是" inactive-text="否"
|
||||
@change="msgChange"></el-switch>
|
||||
<span style="margin-left: 10px; font-size: 14px; color: #c33714;">（注：开启则表示每天九点系统会自动给当天预约了心理咨询的老师发送短信通知）</span>
|
||||
</template>
|
||||
</vi-title2>
|
||||
</div>
|
||||
<div id="psychology-calendar"></div>
|
||||
</el-card>
|
||||
</guava>
|
||||
|
||||
<el-dialog :visible.sync="dateDialogVisible" width="30%" title="新增预约时间段" :close-on-click-modal="false"
|
||||
@closed="addClose">
|
||||
<el-form :model="formData" :rules="rules" ref="ruleForm" label-width="80px">
|
||||
<el-form-item label="开始时间" prop="startTime">
|
||||
<el-date-picker
|
||||
readonly
|
||||
style="width: 100%"
|
||||
v-model="formData.startTime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="datetime"
|
||||
placeholder="选择日期时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="结束时间" prop="endTime">
|
||||
<el-date-picker
|
||||
readonly
|
||||
style="width: 100%"
|
||||
v-model="formData.endTime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="datetime"
|
||||
placeholder="选择日期时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="咨询师" prop="doctorUser">
|
||||
<el-select
|
||||
v-model="formData.doctorUser"
|
||||
filterable
|
||||
remote
|
||||
style="width: 100%"
|
||||
reserve-keyword
|
||||
placeholder="请输入关键词"
|
||||
:remote-method="selectQueryDoctorUser">
|
||||
<el-option
|
||||
v-for="item in doctorUserList"
|
||||
:key="item.id"
|
||||
:label="item.mobile ? item.doctorUserName + '（' + item.mobile + '）' : item.doctorUserName + '（暂无手机号）'"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="咨询方式" prop="askType">
|
||||
<el-select
|
||||
v-model="formData.askType"
|
||||
filterable multiple
|
||||
style="width: 100%"
|
||||
placeholder="请选择咨询方式">
|
||||
<el-option v-for="item in askTypeList" :key="item.code" :label="item.name"
|
||||
:value="item.code"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="doCancel">取消</el-button>
|
||||
<el-button type="primary" @click="doAdd">添加</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog :visible.sync="appointmentDialogVisible" width="60%" title="预约信息" :close-on-click-modal="false">
|
||||
<el-form :model="formData" ref="ruleForm" label-width="100px">
|
||||
<vi-title title="预约时间段"></vi-title>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="开始时间">
|
||||
<el-date-picker
|
||||
readonly style="width: 100%"
|
||||
v-model="formData.startTime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="datetime"
|
||||
placeholder="选择日期时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="结束时间">
|
||||
<el-date-picker
|
||||
readonly style="width: 100%"
|
||||
v-model="formData.endTime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="datetime"
|
||||
placeholder="选择日期时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<vi-title title="预约人信息"></vi-title>
|
||||
<template v-if="formData.appointmentUser">
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="姓名">
|
||||
<el-input v-model="formData.appointmentUserName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="工号">
|
||||
<el-input v-model="formData.appointmentLoginName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="单位">
|
||||
<el-input v-model="formData.appointmentUnitName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="手机号">
|
||||
<el-input v-model="formData.appointmentMobile" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="预约咨询方式">
|
||||
<el-input v-model="formData.appointmentAskTypeValue" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="预约人备注">
|
||||
<el-input v-model="formData.appointmentUserNote" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="text-center m20">
|
||||
<svg t="1639556622680" class="icon" viewBox="0 0 1658 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="2268" width="200" height="200">
|
||||
<path d="M116.303139 786.479504c0 112.412717 308.981404 203.530494 690.447511 203.735253 381.466107 0 690.857029-91.117776 691.061788-203.530494v-0.204759c0-112.412717-309.186163-203.530494-690.65227-203.530494-381.466107-0.204759-690.857029 90.913017-690.857029 203.530494z"
|
||||
fill="#EDE6D6" p-id="2269"></path>
|
||||
<path d="M0 706.418716c0 12.080784 26.004399 21.909218 58.15157 21.909218s58.15157-9.828434 58.151569-21.909218c0-12.080784-26.004399-21.909218-58.151569-21.909218S0 694.542691 0 706.418716z m1512.35033 123.674465c0 15.971206 32.556689 29.075785 72.689462 29.075785s72.689462-12.89982 72.689462-29.075785c0-15.971206-32.556689-29.075785-72.689462-29.075784s-72.689462 12.89982-72.689462 29.075784z"
|
||||
fill="#EFEAD5" p-id="2270"></path>
|
||||
<path d="M247.144171 227.896821v535.240152c0 17.814037 14.128374 33.170966 33.990002 37.061387l524.797441 103.40332V290.34833c-372.456709-47.29934-558.787443-68.184763-558.787443-62.451509z"
|
||||
fill="#FBE8D7" p-id="2271"></path>
|
||||
<path d="M1358.576285 227.896821v535.240152c0 17.609278-14.128374 32.966207-33.785243 37.061387l-519.064187 103.608079-5.938013-613.458109c372.661468-47.29934 558.787443-68.184763 558.787443-62.451509z"
|
||||
fill="#E8C3A0" p-id="2272"></path>
|
||||
<path d="M101.765247 426.308338l148.245551-211.925615 556.125575 67.980004-129.612478 253.082184-574.758648-109.136573z"
|
||||
fill="#FEF6EF" p-id="2273"></path>
|
||||
<path d="M793.236553 278.472306L929.606079 532.987802l572.711058-116.917416-137.188563-203.735253L799.379324 278.472306h-6.142771z"
|
||||
fill="#F9DBC0" p-id="2274"></path>
|
||||
<path d="M750.237153 159.09778h-32.556689c-44.023195 0-79.65127-35.628074-79.65127-79.651269C638.029194 35.628074 673.657269 0 717.680464 0h363.242551c44.023195 0 79.65127 35.628074 79.65127 79.65127s-35.628074 79.65127-79.65127 79.651269H827.226555"
|
||||
fill="#2878FF" opacity=".5" p-id="2275"></path>
|
||||
<path d="M739.384923 108.727055c-15.971206 0.204759-29.280544-12.490302-29.690062-28.461508s12.490302-29.280544 28.461508-29.690062c15.971206-0.204759 29.280544 12.490302 29.485303 28.666267 0.409518 15.971206-12.285543 29.075785-28.256749 29.485303z m159.916817 0c-15.971206 0.204759-29.280544-12.490302-29.690062-28.461508s12.490302-29.280544 28.461507-29.690062c15.971206-0.204759 29.280544 12.490302 29.485303 28.666267 0.409518 15.971206-12.285543 29.075785-28.256748 29.485303z m159.916816 0c-15.971206 0-29.075785-13.104579-29.075785-29.075785s13.104579-29.075785 29.075785-29.075785c15.971206 0 29.075785 13.104579 29.075785 29.075785 0 15.971206-13.104579 29.075785-29.075785 29.075785z"
|
||||
fill="#FFFFFF" p-id="2276"></path>
|
||||
<path d="M1042.428314 486.302739l2.661868-11.466506s-18.837832-15.561688-17.609278-33.170966c1.433313-17.609278 12.89982-28.256749 12.89982-28.256749h35.013797l-5.323735 59.380124 0.614277 10.033194-28.256749 3.480903z m43.20416 508.416717l0.614277 8.804639h12.080783l-2.04759-11.466507-10.64747 2.661868z"
|
||||
fill="#F6D0C3" p-id="2277"></path>
|
||||
<path d="M1058.604279 1011.714457s1.433313-8.804639 7.371326-9.418916c5.323735-0.614277 26.413917 0.614277 32.351929 1.433313 0.614277 0 2.04759 0.614277 2.047591 2.047591v6.757048c0 1.433313-0.614277 2.04759-2.047591 2.047591H1058.604279v-2.866627z"
|
||||
fill="#333333" p-id="2278"></path>
|
||||
<path d="M1021.542891 1004.138372l0.614278 8.804639h11.466506l-1.433313-11.466506-10.647471 2.661867z"
|
||||
fill="#F6D0C3" p-id="2279"></path>
|
||||
<path d="M994.514697 1021.133373s1.433313-8.804639 7.371326-9.418916c5.323735-0.614277 26.413917 0.614277 32.351929 1.433313 0.614277 0 2.04759 0.614277 2.047591 2.047591v6.757049c0 1.433313-0.614277 2.04759-2.047591 2.04759h-39.928014v-2.866627z m89.889222-25.594881h13.514097l5.323736-143.126574c0-7.371326 1.433313-14.128374 2.661867-20.885423 6.757049-27.642472 21.704459-106.679464 17.609278-142.512298l-12.080783-20.885423-74.327535 4.095181s9.418916 87.022595 20.271146 121.422116c2.04759 6.757049 4.095181 13.514097 4.709458 20.271146l22.318736 181.621275z"
|
||||
fill="#333333" p-id="2280"></path>
|
||||
<path d="M982.433913 663.214557l37.061388 342.971406h14.94741l7.371326-140.464707c0.614277-8.190362 2.04759-16.380724 4.095181-24.366327 8.190362-31.123375 30.304339-108.112777 28.256749-154.593081l-91.732054-23.547291z"
|
||||
fill="#3A3A3A" p-id="2281"></path>
|
||||
<path d="M1144.39832 557.354129s12.080784 39.108978 10.85223 55.284943c-1.433313 14.128374-10.033193 51.394521-33.170966 56.103979l-0.614277-87.841631 21.704459-22.933014 1.228554-0.614277z m-180.802239 2.661868s-12.080784 39.108978-10.85223 55.284943c1.433313 14.128374 10.033193 51.394521 33.170966 56.103979l0.614277-87.841632-21.704459-22.933013-1.228554-0.614277z m74.122775-128.998201s6.142771-6.142771 10.85223-4.095181c5.323735 2.04759 6.142771 12.89982 3.276145 27.028195-2.661868 14.128374-15.561688-9.418916-15.561688-9.418916l1.433313-13.514098z"
|
||||
fill="#F6D0C3" p-id="2282"></path>
|
||||
<path d="M1043.861628 427.741652c-4.095181 0.614277-8.804639-0.614277-11.466507-4.095181-4.095181-5.323735-8.804639-13.514097-4.095181-19.656869 7.371326-10.033193 27.642472-17.609278 45.866027-7.371326 18.223555 10.033193 20.271146 33.170966 20.271146 33.170966s-1.433313 41.770846-25.594881 41.770846h-6.142772c-2.661868 0-5.323735-2.04759-6.142771-4.095181-3.276145-8.804639-4.709458-18.223555-4.095181-27.642471v-6.142772c-0.614277-5.938012-4.504699-6.757049-8.59988-5.938012z"
|
||||
fill="#333333" p-id="2283"></path>
|
||||
<path d="M1146.445911 557.968406c-16.995001-35.013797-46.480304-59.175365-60.813437-69.413317-3.890422-3.071386-6.961808-4.914217-8.190362-5.528494-4.709458-2.04759-27.642472 0-37.061388 2.04759-1.842831 0.409518-4.914217 2.25235-8.804639 4.709458-14.742651 8.59988-52.623075 33.170966-70.846631 70.846631l22.318736 36.447111 0.204759-0.20476-0.819036 73.918017c0 4.095181 2.04759 8.190362 5.323735 8.804639 71.665667 34.39952 121.422116 16.790242 134.321936 10.852229 2.04759-0.614277 4.095181-2.661868 4.095181-4.709458 3.685663-24.571086 3.071386-62.45151 1.023795-95.008198l19.247351-32.761448z"
|
||||
fill="#2878FF" p-id="2284"></path>
|
||||
<path d="M250.010798 214.382723l466.85063 71.05139v-118.760248l-4.29994-0.409518z"
|
||||
fill="#E0BC9C" p-id="2285"></path>
|
||||
<path d="M785.865227 289.119776l579.468106-76.784643L712.561488 166.264347V284.615077l73.303739 4.504699z"
|
||||
fill="#FBECDA" p-id="2286"></path>
|
||||
</svg>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-if="formData.doctorUser">
|
||||
<vi-title title="咨询师信息"></vi-title>
|
||||
<template>
|
||||
<el-form-item label="咨询师">
|
||||
<el-select
|
||||
v-model="formData.doctorUser" style="width: 100%"
|
||||
filterable disabled
|
||||
remote
|
||||
reserve-keyword
|
||||
placeholder="请输入关键词"
|
||||
:remote-method="selectQueryDoctorUser">
|
||||
<el-option
|
||||
v-for="item in doctorUserList"
|
||||
:key="item.id"
|
||||
:label="item.mobile ? item.doctorUserName + '（' + item.mobile + '）' : item.doctorUserName + '（暂无手机号）'"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<el-form-item label="咨询方式">
|
||||
<el-select
|
||||
v-model="formData.askType" style="width: 100%"
|
||||
filterable multiple
|
||||
placeholder="请选择咨询方式">
|
||||
<el-option v-for="item in askTypeList" :key="item.code" :label="item.name"
|
||||
:value="item.code"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</template>
|
||||
|
||||
<template v-if="formData.appointmentUser && !formData.doctorUser">
|
||||
<vi-title title="分配咨询师"></vi-title>
|
||||
<template>
|
||||
<el-form :model="formData" label-width="100px">
|
||||
<el-form-item label="咨询师">
|
||||
<el-select
|
||||
v-model="formData.doctorUser"
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
placeholder="请输入关键词"
|
||||
:remote-method="selectQueryDoctorUser">
|
||||
<el-option
|
||||
v-for="item in doctorUserList"
|
||||
:key="item.id"
|
||||
:label="item.mobile ? item.doctorUserName + '（' + item.mobile + '）' : item.doctorUserName + '（暂无手机号）'"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="appointmentDialogVisible = false">关闭</el-button>
|
||||
<el-button type="danger" @click="doDelete">删除</el-button>
|
||||
<el-button type="primary" @click="updateType">确定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog :visible.sync="setDoctorDialogVisible" width="40%" title="预约信息" :close-on-click-modal="false">
|
||||
<el-form :model="formData" ref="ruleForm" label-width="100px">
|
||||
<vi-title title="预约时间段"></vi-title>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="开始时间">
|
||||
<el-date-picker
|
||||
readonly
|
||||
v-model="formData.startTime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="datetime"
|
||||
placeholder="选择日期时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="结束时间">
|
||||
<el-date-picker
|
||||
readonly
|
||||
v-model="formData.endTime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="datetime"
|
||||
placeholder="选择日期时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<vi-title title="预约人信息"></vi-title>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="姓名">
|
||||
<el-input v-model="formData.appointmentUserName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="工号">
|
||||
<el-input v-model="formData.appointmentLoginName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="单位">
|
||||
<el-input v-model="formData.appointmentUnitName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="手机号">
|
||||
<el-input v-model="formData.appointmentMobile" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="预约人备注">
|
||||
<el-input type="textarea" :row="2" v-model="formData.appointmentUserNote" readonly></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<vi-title title="安排咨询师"></vi-title>
|
||||
<el-form :model="formData" label-width="100px">
|
||||
<el-form-item label="咨询师">
|
||||
<el-select
|
||||
v-model="formData.doctorUser"
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
placeholder="请输入关键词"
|
||||
:remote-method="selectQueryDoctorUser">
|
||||
<el-option
|
||||
v-for="item in doctorUserList"
|
||||
:key="item.id"
|
||||
:label="item.mobile ? item.doctorUserName + '（' + item.mobile + '）' : item.doctorUserName + '（暂无手机号）'"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="setDoctorDialogVisible = false">关闭</el-button>
|
||||
<el-button type="primary" @click="doSetDoctor">确定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
let calendar = null
|
||||
let $calendar = $('#psychology-calendar')
|
||||
const vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [initTableMixins],
|
||||
data() {
|
||||
return {
|
||||
isSendMsg: false,
|
||||
dateDialogVisible: false,
|
||||
appointmentDialogVisible: false,
|
||||
setDoctorDialogVisible: false,
|
||||
selectData: {},
|
||||
events: [],
|
||||
doctorUserList: [],
|
||||
calendarHeight: 0,
|
||||
askTypeList: [],
|
||||
rules: {
|
||||
startTime: [{required: true, message: '请选择开始时间', trigger: ['change', 'blur']}],
|
||||
endTime: [{required: true, message: '请选择结束时间', trigger: ['change', 'blur']}],
|
||||
doctorUser: [{required: true, message: '请选择咨询师', trigger: ['change', 'blur']}],
|
||||
askType: [{type: 'array', required: true, message: '请选择咨询方式', trigger: 'change'}],
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async updateType() {
|
||||
const confirm = await this.$confirm('这将清空预约人已选择的咨询方式，您确定要修改咨询方式吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
dangerouslyUseHTMLString: true,
|
||||
type: 'warning'
|
||||
})
|
||||
if (confirm === 'confirm') {
|
||||
const resp = await $.post(loc() + '/updateType', {
|
||||
id: this.formData.id,
|
||||
askType: JSON.stringify(this.formData.askType)
|
||||
})
|
||||
if (resp.code === 0) {
|
||||
await this.getData()
|
||||
this.appointmentDialogVisible = false
|
||||
this.notifySuccess(resp.msg)
|
||||
}
|
||||
}
|
||||
},
|
||||
//搜索咨询师
|
||||
async selectQueryDoctorUser(keyWord) {
|
||||
const resp = await $.get(loc() + '/selectQueryDoctorUser', {
|
||||
keyWord,
|
||||
startTimeTs: this.formData.startTimeTs,
|
||||
endTimeTs: this.formData.endTimeTs,
|
||||
})
|
||||
this.doctorUserList = resp.data
|
||||
},
|
||||
addClose() {
|
||||
if (this.$refs["ruleForm"]) {
|
||||
this.$refs["ruleForm"].resetFields()
|
||||
}
|
||||
},
|
||||
//获取预约数据
|
||||
async getData() {
|
||||
if (!calendar) {
|
||||
return
|
||||
}
|
||||
|
||||
const view = calendar.fullCalendar('getView')
|
||||
//这里取时间戳
|
||||
const startTimeTs = moment(moment(view.start._i).format('YYYY-MM-DD') + ' 00:00:00').unix()
|
||||
const endTimeTs = view.end._i
|
||||
const resp = await $.get(loc() + '/getAppointmentInfo', {startTimeTs, endTimeTs})
|
||||
let events = []
|
||||
if (resp.code === 0) {
|
||||
resp.data.forEach(v => {
|
||||
let className = ''
|
||||
if (!v.appointmentUser) {
|
||||
className = ''
|
||||
} else if (v.appointmentUser && !v.doctorUser) {
|
||||
className = 'red'
|
||||
} else if (v.appointmentUser && v.doctorUser) {
|
||||
className = 'green'
|
||||
}
|
||||
events.push({
|
||||
id: v.id,
|
||||
title: v.doctorUserName,
|
||||
start: v.startTime,
|
||||
end: v.endTime,
|
||||
className: className,
|
||||
o: v
|
||||
})
|
||||
this.events = events
|
||||
})
|
||||
}
|
||||
|
||||
calendar.fullCalendar('removeEvents', () => true)
|
||||
calendar.fullCalendar('addEventSource', events, true)
|
||||
},
|
||||
doCancel() {
|
||||
this.dateDialogVisible = false
|
||||
calendar.fullCalendar('unselect');
|
||||
},
|
||||
async doAdd() {
|
||||
if (Date.parse(this.formData.startTime) < new Date().getTime()) {
|
||||
this.notifyWarning('预约时间不能小于当前时间，请重新设置！')
|
||||
this.dateDialogVisible = false
|
||||
calendar.fullCalendar('unselect');
|
||||
return
|
||||
}
|
||||
/*if(this.formData.doctorUser === '' || this.formData.doctorUser === undefined) {
|
||||
this.notifyWarning('请设置咨询师！')
|
||||
return
|
||||
}*/
|
||||
this.$refs["ruleForm"].validate(async (valid) => {
|
||||
if (valid) {
|
||||
calendar.fullCalendar('unselect')
|
||||
this.formData.askType = JSON.stringify(this.formData.askType)
|
||||
const resp = await $.post(loc() + '/doAdd', this.formData)
|
||||
if (resp.code === 0) {
|
||||
this.notifySuccess(resp.msg)
|
||||
await this.getData()
|
||||
} else if (resp.code === 1) {
|
||||
this.notifyWarning(resp.msg)
|
||||
}
|
||||
this.dateDialogVisible = false
|
||||
this.setDoctorDialogVisible = false
|
||||
}
|
||||
})
|
||||
},
|
||||
async doDelete() {
|
||||
/*if (this.formData.appointmentUser) {
|
||||
this.notifyWarning('该时间段已有预约人，不能进行删除！')
|
||||
return
|
||||
}*/
|
||||
let msg = '确定删除吗?'
|
||||
if (this.formData.appointmentUser) {
|
||||
msg = "<span style='color: red'>该时间段已有预约人</span>，确定要删除吗？"
|
||||
}
|
||||
const confirm = await this.$confirm(msg, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
dangerouslyUseHTMLString: true,
|
||||
type: 'warning'
|
||||
})
|
||||
if (confirm === 'confirm') {
|
||||
const resp = await $.post(loc() + '/doDelete', {id: this.formData.id})
|
||||
if (resp.code === 0) {
|
||||
await this.getData()
|
||||
this.appointmentDialogVisible = false
|
||||
this.notifySuccess(resp.msg)
|
||||
}
|
||||
}
|
||||
},
|
||||
async doSetDoctor() {
|
||||
if (!this.formData.doctorUser) {
|
||||
this.notifyWarning('请先分配心理咨询师')
|
||||
return
|
||||
}
|
||||
const {id, doctorUser} = this.formData
|
||||
const resp = await $.post(loc() + '/doSetDoctor', {
|
||||
id, doctorUser
|
||||
})
|
||||
if (resp.code === 0) {
|
||||
await this.getData()
|
||||
this.setDoctorDialogVisible = false
|
||||
this.notifySuccess(resp.msg)
|
||||
}
|
||||
},
|
||||
initCalendar() {
|
||||
const that = this
|
||||
const today = moment().format('YYYY-MM-DD')
|
||||
if (calendar) {
|
||||
return
|
||||
}
|
||||
calendar = $('#psychology-calendar').fullCalendar({
|
||||
header: { //设置日历头部信息，false，则不显示头部信息。包括left，center,right左中右三个位置
|
||||
left: 'prev,next, today', //上一个、下一个、今天
|
||||
center: 'title', //标题
|
||||
right: 'month,agendaWeek,agendaDay,listMonth' //月、周、日、日程列表
|
||||
},
|
||||
locale: 'zh-cn', //?没用？
|
||||
timeFormat: 'HH:mm', //日程事件的时间格式
|
||||
|
||||
buttonText: { //各按钮的显示文本信息
|
||||
today: '今天',
|
||||
month: '月',
|
||||
agendaWeek: '周',
|
||||
agendaDay: '日',
|
||||
listMonth: '日程',
|
||||
},
|
||||
slotMinTime: '11:00:00',
|
||||
monthNames: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"], //月份全称
|
||||
monthNamesShort: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"], //月份简写
|
||||
dayNames: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"], //周全称
|
||||
dayNamesShort: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"], //周简写
|
||||
noEventsMessage: "当月无数据", //listview视图下，无数据提示
|
||||
allDayText: "全天", //自定义全天视图的名称
|
||||
allDaySlot: false, //是否在周日历上方显示全天
|
||||
allDayDefault: false, //是否为全天日程事件，显示这一天中所做的事情
|
||||
slotDuration: "00:30:00", //一格时间槽代表多长时间，默认00:30:00（30分钟）
|
||||
slotLabelFormat: "H(:mm)a", //日期视图左边那一列显示的每一格日期时间格式
|
||||
slotLabelInterval: "01:00:00", //日期视图左边那一列多长间隔显示一条日期文字(默认跟着slotDuration走的，可自定义)
|
||||
snapDuration: "01:00:00", //其实就是动态创建一个日程时，默认创建多长的时间块
|
||||
firstDay: 1, //一周中显示的第一天是哪天，周日是0，周一是1，类推
|
||||
hiddenDays: [], //隐藏一周中的某一天或某几天，数组形式，如隐藏周二和周五：[2,5]，默认不隐藏，除非weekends设置为false。
|
||||
weekends: true, //是否显示周六和周日，设为false则不显示周六和周日。默认值为true
|
||||
weekMode: 'fixed', //月视图里显示周的模式，因每月周数不同月视图高度不定。fixed：固定显示6周高，日历高度保持不变liquid：不固定周数，高度随周数变化variable：不固定周数，但高度固定
|
||||
weekNumbers: false, //是否在日历中显示周次(一年中的第几周)，如果设置为true，则会在月视图的左侧、周视图和日视图的左上角显示周数。
|
||||
weekNumberCalculation: 'iso', //周次的显示格式。
|
||||
height: that.calendarHeight, //设置日历的高度，包括header日历头部，默认未设置，高度根据aspectRatio值自适应。
|
||||
// contentHeight: 600, //设置日历主体内容的高度，不包括header部分，默认未设置，高度根据aspectRatio值自适应。
|
||||
handleWindowResize: true, //是否随浏览器窗口大小变化而自动变化。
|
||||
defaultView: 'agendaWeek', //初始化时默认视图，默认是月month，agendaWeek是周，agendaDay是当天
|
||||
slotEventOverlap: false, //事件是否可以重叠覆盖
|
||||
defaultDate: today, //默认显示那一天的日期视图getDates(true)2020-05-10
|
||||
nowIndicator: false, //周/日视图中显示今天当前时间点（以红线标记），默认false不显示
|
||||
eventLimit: 2, //数据条数太多时，限制显示条数（多余的以“+2more”格式显示），默认false不限制,支持输入数字设定固定的显示条数
|
||||
eventLimitText: "更多", //当一块区域内容太多以"+2 more"格式显示时，这个more的名称自定义（应该与eventLimit: true一并用）
|
||||
dayPopoverFormat: "YYYY年M月d日预约信息", //点开"+2 more"弹出的小窗口标题，与eventLimitClick可以结合用
|
||||
render: (view) => { //method,绑定日历到id上。$('#id').fullCalendar('render');
|
||||
},
|
||||
viewRender: (view) => {
|
||||
that.getData()
|
||||
},
|
||||
eventRender: (info) => {
|
||||
// $(info.el).html(info.event.title);
|
||||
},
|
||||
//日历数据源
|
||||
events: that.events,
|
||||
//日程事件点击
|
||||
eventClick: (event, jsEvent) => {
|
||||
if (event.o.doctorUser) {
|
||||
this.doctorUserList = [{
|
||||
id: event.o.doctorUser,
|
||||
doctorUserName: event.o.doctorUserName,
|
||||
mobile: event.o.doctorMobile,
|
||||
}]
|
||||
this.appointmentDialogVisible = true
|
||||
} else {
|
||||
this.setDoctorDialogVisible = true
|
||||
this.doctorUserList = []
|
||||
}
|
||||
if (this.$refs["ruleForm"]) {
|
||||
this.$refs["ruleForm"].resetFields()
|
||||
}
|
||||
this.$forceUpdate()
|
||||
//
|
||||
// if (event.o.appointmentUser && !event.o.doctorUser) {
|
||||
// this.setDoctorDialogVisible = true
|
||||
// this.doctorUserList = []
|
||||
// } else if (event.o.appointmentUser && event.o.doctorUser) {
|
||||
// this.setDoctorDialogVisible = true
|
||||
// this.doctorUserList = [{
|
||||
// id: event.o.doctorUser,
|
||||
// doctorUserName: event.o.doctorUserName
|
||||
// }]
|
||||
// } else if (!event.o.appointmentUser) {
|
||||
// this.appointmentDialogVisible = true
|
||||
// }
|
||||
that.formData = JSON.parse(JSON.stringify(event.o))
|
||||
that.formData.askType = that.formData.askType ? JSON.parse(that.formData.askType) : []
|
||||
if (this.formData.appointmentAskTypeValue) {
|
||||
const type = this.askTypeList.find(o => o.code === this.formData.appointmentAskTypeValue + '')
|
||||
this.formData.appointmentAskTypeValue = type ? type.name : '暂无'
|
||||
} else {
|
||||
this.formData.appointmentAskTypeValue = '暂无'
|
||||
}
|
||||
},
|
||||
selectable: true, //是否允许通过单击或拖动选择日历中的对象，包括天和时间
|
||||
unselectAuto: false, //当点击页面日历以外的位置时，是否自动取消当前的选中状态。
|
||||
selectHelper: true, //当点击或拖动选择时间时，是否预先画出“日程区块”的样式显示默认加载的提示信息，该属性只在周/天视图里可用
|
||||
selectMirror: true, //镜像
|
||||
selectOverlap: false, //是否允许选择被事件占用的时间段，默认true可占用时间段
|
||||
select: (start, end, allDay) => { //点击空白区域/选择区域内容触发
|
||||
if (calendar.fullCalendar('getView').name === 'month') {
|
||||
return
|
||||
}
|
||||
|
||||
const startTime = $.fullCalendar.formatDate(start, "YYYY-MM-DD HH:mm:ss")
|
||||
const endTime = $.fullCalendar.formatDate(end, "YYYY-MM-DD HH:mm:ss")
|
||||
|
||||
if (new Date().getTime() > Date.parse(endTime)) {
|
||||
that.$message.warning('该时段不可设置')
|
||||
calendar.fullCalendar('unselect');
|
||||
return
|
||||
}
|
||||
|
||||
that.formData = {}
|
||||
that.$set(that.formData, 'startTime', startTime)
|
||||
that.$set(that.formData, 'endTime', endTime)
|
||||
that.$set(that.formData, 'doctorUser', '')
|
||||
that.$set(that.formData, 'askType', [])
|
||||
that.dateDialogVisible = true
|
||||
that.selectData = {start, end, allDay}
|
||||
if (this.$refs["ruleForm"]) {
|
||||
this.$refs["ruleForm"].resetFields()
|
||||
}
|
||||
this.$forceUpdate()
|
||||
},
|
||||
lazyFetching: false, //是否启用懒加载技术--即只取当前条件下的视图数据，其它数据在切换时触发，默认true只取当前视图的，false是取全视图的
|
||||
defaultTimedEventDuration: "01:00:00", //在Event Object中如果没有end参数时使用，如start=7:00pm，则该日程对象时间范围就是7:00~9:00
|
||||
defaultAllDayEventDuration: {days: 1}, //默认1天是多长，（有的是采用工作时间模式，所以支持自定义）
|
||||
});
|
||||
},
|
||||
async getIsSendMsg() {
|
||||
const resp = await $.post('/platform/psychology/appointmentSet/getIsSendMsg')
|
||||
this.isSendMsg = resp.data
|
||||
},
|
||||
async msgChange(val) {
|
||||
const resp = await $.post('/platform/psychology/appointmentSet/msgChange', {isSend: val})
|
||||
if (resp.code === 0) {
|
||||
this.$notify.success({title: '提示', message: resp.msg})
|
||||
} else {
|
||||
this.$notify.warning({title: '警告', message: resp.msg})
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
setTimeout(() => {
|
||||
this.calendarHeight = window.innerHeight - 50 - 60
|
||||
}, 100)
|
||||
},
|
||||
async created() {
|
||||
await this.getIsSendMsg()
|
||||
this.askTypeList = await getDictOptions("psychology_asktype")
|
||||
this.$nextTick(() => {
|
||||
setTimeout(() => {
|
||||
$('#psychology-calendar').fullCalendar('destroy');
|
||||
calendar = null
|
||||
this.initCalendar()
|
||||
this.getData()
|
||||
}, 100)
|
||||
});
|
||||
await this.selectQueryDoctorUser(null)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,389 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<style>
|
||||
.avatar-uploader .el-upload {
|
||||
border: 1px dashed #d9d9d9;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.avatar-uploader .el-upload:hover {
|
||||
border-color: #409EFF;
|
||||
}
|
||||
|
||||
.avatar-uploader-icon {
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
width: 178px;
|
||||
height: 178px;
|
||||
line-height: 178px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 150px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.el-popover {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
</style>
|
||||
<div id="app">
|
||||
<guava ref="guava">
|
||||
<el-card shadow="never">
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-input placeholder="请输入内容" v-model="pageForm.searchKeyword" clearable @keyup.enter.native="doSearch">
|
||||
<el-select v-model="pageForm.searchName" slot="prepend" placeholder="查询类型" style="width: 120px;">
|
||||
<el-option label="姓名" value="u.username"></el-option>
|
||||
<el-option label="工号" value="u.loginname"></el-option>
|
||||
</el-select>
|
||||
</el-input>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-button type="primary" icon="el-icon-search" @click="doSearch">搜索</el-button>
|
||||
</div>
|
||||
|
||||
<div class="pull-right offscreen-right mt5">
|
||||
<el-button type="primary" @click="openAdd">
|
||||
<i class="ti-plus"></i>
|
||||
新增咨询师
|
||||
</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<el-card shadow="never" class="mt10">
|
||||
<table-tool label="咨询师列表" :app="this">
|
||||
<template #func>
|
||||
|
||||
</template>
|
||||
</table-tool>
|
||||
<el-table :data="tableData" stripe border :size="tableSize" style="width: 100%">
|
||||
<el-table-column type="index" label="序号" width="80px"></el-table-column>
|
||||
<el-table-column
|
||||
align="center"
|
||||
header-align="center"
|
||||
v-for="column in tableColumns"
|
||||
show-overflow-tooltip
|
||||
:label="column.label"
|
||||
:prop="column.prop"
|
||||
:sortable="column.sortable"
|
||||
>
|
||||
|
||||
<template v-if="column.prop==='avatar'" scope="{row}">
|
||||
<el-popover
|
||||
placement="top-start"
|
||||
width="100"
|
||||
trigger="hover">
|
||||
<el-image
|
||||
style="height: 100px"
|
||||
:src="APP_DOMAIN+FILE_STREAM_PREVIEW_ADDRESS+'?id='+row.avatar"
|
||||
fit="cover">
|
||||
<div slot="error" class="image-slot">
|
||||
<i class="el-icon-picture-outline"></i>
|
||||
</div>
|
||||
</el-image>
|
||||
<el-image
|
||||
slot="reference"
|
||||
style="height: 30px;"
|
||||
:src="APP_DOMAIN+FILE_STREAM_PREVIEW_ADDRESS+'?id='+row.avatar"
|
||||
fit="cover">
|
||||
<div slot="error" class="image-slot">
|
||||
<i class="el-icon-picture-outline"></i>
|
||||
</div>
|
||||
</el-image>
|
||||
</el-popover>
|
||||
</template>
|
||||
|
||||
</el-table-column>
|
||||
<el-table-column align="center" header-align="center" label="操作" width="250">
|
||||
<template scope="{row}">
|
||||
<el-button size="small" @click="openView(row)">查看</el-button>
|
||||
<el-button size="small" type="primary" @click="openEdit(row)">编辑</el-button>
|
||||
<el-button size="small" type="danger" @click="doDelete(row.id)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--#include("/layouts/pagination.html"){}#-->
|
||||
</el-card>
|
||||
|
||||
<template #edit>
|
||||
<!-- <h3 style="color: rgb(24, 103, 176);">录入咨询师信息</h3>-->
|
||||
<el-form :model="formData" :rules="rules" ref="ruleForm" label-width="100px" style="width: 1000px">
|
||||
<el-row type="flex" :gutter="12">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="姓名" prop="userid">
|
||||
<el-select
|
||||
style="width: 100%"
|
||||
v-model="formData.userid"
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
placeholder="请输入关键词"
|
||||
:remote-method="selectQueryUser"
|
||||
@change="selectUserChange"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in selectUserList"
|
||||
:key="item.id"
|
||||
:label="item.username"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="性别" prop="sex">
|
||||
<el-input v-model="formData.sex"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="职称" prop="jobTitle">
|
||||
<el-input v-model="formData.jobTitle"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-form-item label="单位" prop="unitName">
|
||||
<el-input v-model="formData.unitName"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="电话" prop="mobile">
|
||||
<el-input v-model.trim="formData.mobile"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
<el-form-item label="简介" prop="introduce">
|
||||
<el-input type="textarea" :rows="3" v-model="formData.introduce"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="特长" prop="specialty">
|
||||
<el-input type="textarea" :rows="3" v-model="formData.specialty"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="工作理念" prop="workingIdeal">
|
||||
<el-input type="textarea" :rows="3" v-model="formData.workingIdeal"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
<el-form-item label="头像" prop="avatar">
|
||||
<el-upload
|
||||
class="avatar-uploader"
|
||||
:action="FILE_UPLOAD_ADDRESS"
|
||||
:show-file-list="false"
|
||||
:on-success="handleAvatarSuccess"
|
||||
:before-upload="beforeAvatarUpload">
|
||||
<img v-if="formData.avatar" :src="APP_DOMAIN+FILE_STREAM_PREVIEW_ADDRESS+'?id='+formData.avatar"
|
||||
class="avatar">
|
||||
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
|
||||
<div slot="tip" class="el-upload__tip">请上传一寸登记照，格式为jpg、png、jpeg的图片</div>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item class="text-right">
|
||||
<el-button @click="$refs.guava.index()">取消</el-button>
|
||||
<el-button type="primary" @click="doHandle">确定</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
</template>
|
||||
|
||||
<template #view>
|
||||
<!-- <h3 style="color: rgb(24, 103, 176);">录入咨询师信息</h3>-->
|
||||
<el-form :model="viewData" label-width="100px" style="width: 1000px">
|
||||
<el-row type="flex" :gutter="12">
|
||||
<el-col :span="8">
|
||||
<el-form-item readonly label="姓名">
|
||||
<el-input readonly v-model="viewData.username"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="性别">
|
||||
<el-input readonly v-model="viewData.sex"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="职称">
|
||||
<el-input readonly v-model="viewData.jobTitle"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-form-item label="单位">
|
||||
<el-input readonly v-model="viewData.unitName"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="电话">
|
||||
<el-input readonly v-model="viewData.mobile"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="特长">
|
||||
<el-input readonly type="textarea" :rows="3" v-model="viewData.specialty"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="简介">
|
||||
<el-input readonly type="textarea" :rows="3" v-model="viewData.introduce"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="工作理念">
|
||||
<el-input readonly type="textarea" :rows="3" v-model="viewData.workingIdeal"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="头像">
|
||||
<img v-if="viewData.avatar" :src="APP_DOMAIN+FILE_STREAM_PREVIEW_ADDRESS+'?id='+viewData.avatar"
|
||||
class="avatar">
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
|
||||
</template>
|
||||
|
||||
</guava>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [initTableMixins],
|
||||
data() {
|
||||
return {
|
||||
selectUserList: [],
|
||||
rules: {
|
||||
userid: [{required: true, message: '请输入姓名', trigger: ['change', 'blur']}],
|
||||
sex: [{required: true, message: '请选择性别', trigger: ['change', 'blur']}],
|
||||
// jobTitle: [{required: true, message: '请输入职称', trigger: ['change', 'blur']}],
|
||||
//mobile: [{required: true, message: '请输入电话', trigger: ['change', 'blur']}],
|
||||
specialty: [{required: true, message: '请输入特长', trigger: ['change', 'blur']}],
|
||||
introduce: [{required: true, message: '请输入简介', trigger: ['change', 'blur']}],
|
||||
avatar: [{required: true, message: '请上传头像', trigger: ['change', 'blur']}],
|
||||
},
|
||||
tableColumns: [
|
||||
{prop: 'loginname', label: '工号'},
|
||||
{prop: 'username', label: '姓名'},
|
||||
{prop: 'sex', label: '性别'},
|
||||
{prop: 'unitName', label: '单位'},
|
||||
{prop: 'jobTitle', label: '职称'},
|
||||
{prop: 'mobile', label: '联系电话'},
|
||||
{prop: 'avatar', label: '头像'}
|
||||
],
|
||||
formData: {
|
||||
userid: null,
|
||||
sex: null,
|
||||
unitName: null,
|
||||
jobTitle: null,
|
||||
mobile: null,
|
||||
avatar: null,
|
||||
specialty: null,
|
||||
introduce: null,
|
||||
},
|
||||
pageForm: {
|
||||
searchName: 'u.username'
|
||||
},
|
||||
viewData: {}
|
||||
}
|
||||
},
|
||||
components: {},
|
||||
methods: {
|
||||
openAdd() {
|
||||
this.selectUserList = []
|
||||
this.$refs['guava'].edit()
|
||||
this.$refs['ruleForm'].resetFields()
|
||||
this.formData.id = undefined
|
||||
this.formData.loginname = undefined
|
||||
this.formData.username = undefined
|
||||
},
|
||||
async selectQueryUser(keyWord) {
|
||||
this.selectUserList = await searchUser(keyWord, null, null, null, null)
|
||||
},
|
||||
selectUserChange(val) {
|
||||
if (val) {
|
||||
const user = this.selectUserList.find(v => v.id === val)
|
||||
this.$set(this.formData, 'sex', user.sex)
|
||||
this.$set(this.formData, 'mobile', user.mobile)
|
||||
this.$set(this.formData, 'unitName', user.unitname)
|
||||
}
|
||||
},
|
||||
async doHandle() {
|
||||
const valid = await this.$refs['ruleForm'].validate()
|
||||
if (valid) {
|
||||
const methodName = typeof this.formData.id === 'undefined' ? '/doAdd' : '/doEdit'
|
||||
const resp = await $.post(loc() + methodName, this.formData)
|
||||
switch (resp.code) {
|
||||
case 0:
|
||||
this.notifySuccess(resp.msg)
|
||||
this.doSearch()
|
||||
this.$refs['guava'].index()
|
||||
break
|
||||
case 1:
|
||||
this.notifyError(resp.msg)
|
||||
break
|
||||
case 2:
|
||||
this.notifyWarning(resp.msg)
|
||||
break
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
openView(row) {
|
||||
this.viewData = row
|
||||
this.$refs['guava'].view()
|
||||
|
||||
},
|
||||
openEdit(row) {
|
||||
this.$refs['guava'].edit()
|
||||
this.selectUserList = [
|
||||
{
|
||||
id: row.userid,
|
||||
username: row.username,
|
||||
loginname: row.loginname
|
||||
}
|
||||
]
|
||||
this.formData = JSON.parse(JSON.stringify(row))
|
||||
},
|
||||
async doDelete(id) {
|
||||
const confirm = await this.$confirm('确定删除吗?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
if (confirm === 'confirm') {
|
||||
const resp = await $.post(loc() + '/doDelete', {id})
|
||||
if (resp.code === 0) {
|
||||
this.$notify.success(resp.msg)
|
||||
this.doSearch()
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
async handleAvatarSuccess(res, file) {
|
||||
this.$set(this.formData, 'avatar', res.data.filepath)
|
||||
await this.$refs['ruleForm'].validate()
|
||||
},
|
||||
beforeAvatarUpload(file) {
|
||||
console.log(file.type)
|
||||
const isJPG = file.type === 'image/jpeg' || file.type === 'image/png' || file.type === 'image/jpg';
|
||||
const isLt2M = file.size / 1024 / 1024 < 2;
|
||||
if (!isJPG) {
|
||||
this.$message.error('上传头像图片只能是 jpg、png、jpeg 格式!');
|
||||
}
|
||||
if (!isLt2M) {
|
||||
this.$message.error('上传头像图片大小不能超过 2MB!');
|
||||
}
|
||||
return isJPG && isLt2M;
|
||||
}
|
||||
|
||||
},
|
||||
created() {
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,44 @@
|
||||
<el-dialog title="查看详情" :visible.sync="viewDialogVisible" width="55%" top="100px"
|
||||
:close-on-click-modal="false">
|
||||
<el-form :model="formData" ref="ruleForm" :rules="rules" label-width="100px" label-suffix="：">
|
||||
<vi-title title="咨询信息"></vi-title>
|
||||
<el-form-item label="咨询人">
|
||||
<span>{{viewData.posterUserName}}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="咨询主题" prop="postTitle">
|
||||
<span>{{viewData.postTitle}}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="主要内容" prop="postContent">
|
||||
<span>{{viewData.postContent}}</span>
|
||||
</el-form-item>
|
||||
|
||||
<vi-title title="回复信息"></vi-title>
|
||||
<template v-if="viewData.replyList">
|
||||
<div class="reply-list">
|
||||
<div class="reply-list-item" v-for="item in viewData.replyList">
|
||||
<div class="user-face">
|
||||
<svg t="1639966214107" class="icon" viewBox="0 0 3208 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="6251" width="80" height="30">
|
||||
<path d="M343.496334 367.185736m-225.049322 0a225.049322 225.049322 0 1 0 450.098644 0 225.049322 225.049322 0 1 0-450.098644 0Z"
|
||||
fill="#FFFFFF" p-id="6252"></path>
|
||||
<path d="M1879.043392 0H355.341035c-3.079622 0-20.846674 23.689402-23.689402 23.689402 14.687429 3.079622 23.689402-11.370913 33.638951 0C400.350899 58.512824 450.098644 99.49549 497.477449 94.757609h23.689402c37.903044 0 58.512824 5.685457 57.565248 41.693348a155.639373 155.639373 0 0 0 71.068207 118.447012 76.51677 76.51677 0 0 1 10.186443 6.869927 64.19828 64.19828 0 0 1 9.001973 93.573139 152.796645 152.796645 0 0 0-23.689403 134.318911 58.27593 58.27593 0 0 1 3.553411 12.555383A66.567221 66.567221 0 0 1 592.235058 578.495205a161.087936 161.087936 0 0 0-108.260569 87.650788 77.227452 77.227452 0 0 1-6.159244 12.555384c-14.924323 23.689402-19.42531 11.370913-47.378805 6.869926L426.409242 686.992667h9.001973l11.370913 23.689403h1432.261264C2071.164445 710.68207 2226.803818 562.149517 2226.803818 379.030437v-47.378804c0-183.11908-155.639373-331.651633-347.760426-331.651633z"
|
||||
fill="#EDF5FE" p-id="6253"></path>
|
||||
<path d="M688.650926 261.767896a74.147829 74.147829 0 0 0-9.949549-6.869927 156.586949 156.586949 0 0 1-67.514797-118.447012 65.619644 65.619644 0 0 0-63.961386-66.804114 61.355552 61.355552 0 0 0-13.266066 1.18447 154.218009 154.218009 0 0 1-126.975196-47.378805 65.145856 65.145856 0 0 0-36.718574-21.557356 21.320462 21.320462 0 0 0-12.318489 12.081595 324.544812 324.544812 0 0 0-58.039036 23.689403 334.020573 334.020573 0 0 1 58.27593-23.689403 21.79425 21.79425 0 0 1 12.555383-12.081595 64.19828 64.19828 0 0 0-54.722519 12.318489 78.88571 78.88571 0 0 0-10.423337 9.475761 154.691797 154.691797 0 0 1-126.975196 47.378805 65.619644 65.619644 0 0 0-76.51677 52.116685 61.355552 61.355552 0 0 0 0 13.266065 157.060737 157.060737 0 0 1-67.514797 118.447012 66.567221 66.567221 0 0 0-23.689402 90.967305 55.433201 55.433201 0 0 0 4.974775 9.475761 158.95589 158.95589 0 0 1 23.689402 134.555805 65.856538 65.856538 0 0 0 37.903044 85.281848 56.617672 56.617672 0 0 0 12.792277 3.553411 156.586949 156.586949 0 0 1 103.522688 87.650788 65.145856 65.145856 0 0 0 82.43912 40.982666 86.466318 86.466318 0 0 0 12.555383-5.92235 154.218009 154.218009 0 0 1 135.266488 0 66.567221 66.567221 0 0 0 22.268038 8.054397 64.672068 64.672068 0 0 0 66.330326-30.559329 59.934188 59.934188 0 0 0 5.685457-12.555384 156.586949 156.586949 0 0 1 103.522688-87.650788 66.330327 66.330327 0 0 0 54.248731-76.279876 58.27593 58.27593 0 0 0-3.55341-12.555383 158.482102 158.482102 0 0 1 23.689402-134.318911 66.330327 66.330327 0 0 0-7.580608-93.810033zM355.341035 564.281563v17.530158a129.107243 129.107243 0 0 0 99.258596 125.316938A129.107243 129.107243 0 0 1 355.341035 581.811721v-17.530158L194.016205 240.684328h81.017756L355.341035 416.933481V25.110766 416.933481l81.017756-176.486047h81.017756zM921.51775 298.249575a584.891343 584.891343 0 0 1-98.074125 96.415868l-20.60978-22.504932a501.978435 501.978435 0 0 0 94.757609-92.151776z m-86.703212-120.10527a415.275223 415.275223 0 0 1 71.068207 54.959414l-21.79425 21.320462a450.098644 450.098644 0 0 0-70.594419-55.433201z m295.643741 227.181369v154.691797h-29.848647v-20.846674h-218.890078v20.846674H852.818484v-154.691797z m-248.738725 104.944052h218.890078v-76.042981h-218.890078z m101.153748-275.507749a260.583426 260.583426 0 0 1-47.378804 62.303128l-19.188416-23.689402a225.996898 225.996898 0 0 0 60.171082-108.260569l30.559329 3.790305c-3.079622 11.607807-6.869927 23.689402-11.370913 36.718573H1160.780714v24.400085a351.55073 351.55073 0 0 1-41.930242 71.068207l-22.504932-18.003946a268.874716 268.874716 0 0 0 30.559329-47.378805h-68.462373c0 16.819476-2.36894 29.374859-3.553411 37.429256 18.003946 47.378805 61.118658 78.648816 129.581031 94.757609l-12.792277 29.137965c-65.619644-18.003946-108.023675-47.378805-127.448985-91.441093-20.372886 40.745772-62.540022 71.068207-126.264514 89.309047l-13.029171-27.716601c68.699267-18.003946 108.734357-48.800169 118.447011-92.151775a298.486469 298.486469 0 0 0 4.027199-38.85062zM1221.18869 299.197151h92.151775v189.515219c11.370913-9.949549 26.058343-23.689402 43.825394-41.693348l8.528185 32.454481A544.856253 544.856253 0 0 1 1286.334546 544.856253l-11.844701-27.242812a25.821449 25.821449 0 0 0 9.475761-18.951522v-170.089909h-62.776916z m51.169109-126.264514a502.926011 502.926011 0 0 1 71.068207 65.619644l-20.846674 21.320462a458.153041 458.153041 0 0 0-72.489571-66.093432z m170.089908 0a395.139231 395.139231 0 0 1-13.502959 42.640924h167.957863q0 231.445461-5.922351 288.53692a54.485625 54.485625 0 0 1-60.64487 53.301156l-40.508878-1.18447-7.343715-27.716601c23.689402 0 37.429256 1.658258 44.062289 1.658258 19.662204 0 31.033117-12.555383 34.586527-37.903044s4.500986-108.260569 5.448563-247.791148h-150.901493a310.33117 310.33117 0 0 1-56.617672 76.279875l-19.42531-23.689402a260.583426 260.583426 0 0 0 72.252677-129.581031z m-58.749717 121.526634h130.528607v195.200675h-130.528607z m29.848647 83.860484h71.068207v-58.749718h-71.068207z m71.068207 84.80806V402.71984h-71.068207v59.223505zM1741.881753 170.800591h29.848647v203.018178q-1.895152 126.975196-86.940107 185.961808l-23.689402-20.135992c52.827367-34.586527 79.359498-90.019729 80.307074-165.825816z m-75.095405 55.906989h29.848646V450.098644h-29.848646z m131.002394-40.508878H2037.2886v29.848647h-104.707158v52.353579h87.650788v208.940529c0 23.689402-10.660231 35.534103-32.217587 35.534103h-29.137965l-8.054397-29.848647 27.242813 1.658259c8.528185 0 12.792277-4.500986 12.792277-13.739854v-173.880213h-58.275929v260.583426h-30.085541v-260.583426h-58.27593v218.653184h-29.374859V268.400928h87.650789V216.047349h-104.707159z"
|
||||
fill="#4492F4" p-id="6254"></path>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="content-user">{{item.replyUserName}}</div>
|
||||
<p class="content-text">{{item.replyContent}}</p>
|
||||
<div class="content-info">
|
||||
<span>{{item.replyTime}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
无人回复
|
||||
</template>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
@@ -0,0 +1,50 @@
|
||||
.reply-list{
|
||||
/*box-sizing: content-box;*/
|
||||
/*position: relative;*/
|
||||
}
|
||||
.reply-list-item{
|
||||
box-sizing: content-box;
|
||||
position: relative;
|
||||
}
|
||||
.reply-list-item>.user-face{
|
||||
margin: 24px 0 0 0px;
|
||||
position: absolute;
|
||||
width: 82px;
|
||||
}
|
||||
.reply-list-item>.content{
|
||||
position: relative;
|
||||
margin-left: 85px;
|
||||
padding: 22px 0 14px 0;
|
||||
border-top: 1px solid #e5e9ef;
|
||||
}
|
||||
|
||||
.reply-list-item>.content>.content-user{
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
line-height: 18px;
|
||||
padding-bottom: 4px;
|
||||
display: block;
|
||||
word-wrap: break-word;
|
||||
position: relative;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.reply-list-item>.content>.content-text{
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
line-height: 20px;
|
||||
padding: 2px 0;
|
||||
font-size: 14px;
|
||||
text-shadow: none;
|
||||
overflow: hidden;
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.reply-list-item>.content>.content-info{
|
||||
color: #99a2aa;
|
||||
line-height: 14px;
|
||||
margin-top: 6px;
|
||||
font-size: 12px;
|
||||
}
|
||||
@@ -0,0 +1,216 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
<!--
|
||||
#include
|
||||
|
||||
(
|
||||
"/platform/psychology/onlinePost/include/postInfoCss.html"
|
||||
)
|
||||
{
|
||||
}
|
||||
#-- >
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<guava>
|
||||
<el-card shadow="never">
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-date-picker
|
||||
v-model="pageForm.year"
|
||||
value-format="yyyy"
|
||||
type="year"
|
||||
placeholder="选择年">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select v-model="pageForm.isReply">
|
||||
<el-option :value="null" label="全部"></el-option>
|
||||
<el-option :value="true" label="已回复"></el-option>
|
||||
<el-option :value="false" label="未回复"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-button type="primary" icon="el-icon-search" @click="doSearch">搜索</el-button>
|
||||
</div>
|
||||
<div class="pull-right offscreen-right mt5">
|
||||
<el-button type="primary" @click="openAdd">
|
||||
我要咨询
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
</el-card>
|
||||
|
||||
<el-card shadow="never" class="mt10">
|
||||
<table-tool label="咨询记录" :app="this">
|
||||
<template #func>
|
||||
|
||||
</template>
|
||||
</table-tool>
|
||||
<el-table :data="tableData" stripe border :size="tableSize" style="width: 100%">
|
||||
<el-table-column type="index" label="序号" width="80px"></el-table-column>
|
||||
<el-table-column
|
||||
align="center"
|
||||
header-align="center"
|
||||
v-for="column in tableColumns"
|
||||
show-overflow-tooltip
|
||||
:label="column.label"
|
||||
:prop="column.prop"
|
||||
:sortable="column.sortable"
|
||||
>
|
||||
<template v-if="column.prop==='isReply'" scope="{row}">
|
||||
<el-tag type="success" v-if="row.isReply">已回复</el-tag>
|
||||
<el-tag type="info" v-else>未回复</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" header-align="center" label="操作" width="250">
|
||||
<template scope="{row}">
|
||||
<el-button size="mini" type="primary" @click="openView(row)">查看</el-button>
|
||||
<el-button size="mini" type="primary" @click="openEdit(row)">编辑</el-button>
|
||||
<el-button v-if="!row.isReply" size="mini" type="danger" @click="doDelete(row.id)">删除咨询
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--#include("/layouts/pagination.html"){}#-->
|
||||
</el-card>
|
||||
</guava>
|
||||
|
||||
<el-dialog :title="formData.id ? '编辑咨询内容' : '发布咨询内容'" :visible.sync="addDialogVisible" width="55%" top="100px"
|
||||
:close-on-click-modal="false">
|
||||
<el-form :model="formData" ref="ruleForm" :rules="rules" label-width="100px" label-suffix="：">
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="咨询人姓名">
|
||||
<el-input v-model="formData.posterUserName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="咨询人工号">
|
||||
<el-input v-model="formData.posterLoginName" readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-form-item label="咨询主题" prop="postTitle">
|
||||
<el-input v-model="formData.postTitle" maxlength="20" placeholder="请简约填写咨询主题，不超过20个字"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="主要内容" prop="postContent">
|
||||
<el-input type="textarea" rows="5" v-model="formData.postContent" maxlength="500"
|
||||
placeholder="请输入内容"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<div class="text-primary">
|
||||
<i class="el-icon-warning"></i>
|
||||
提示：不会发布您的个人隐私信息，您咨询的内容只有心理咨询师可查看并回复。
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</el-form>
|
||||
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button @click="addDialogVisible=false">取消</el-button>
|
||||
<el-button type="primary" @click="doAdd">提交</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
|
||||
<!--#include("/platform/psychology/onlinePost/include/postInfo.html"){}#-->
|
||||
|
||||
</div>
|
||||
<script>
|
||||
const vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [initTableMixins],
|
||||
data() {
|
||||
return {
|
||||
tableColumns: [
|
||||
{prop: 'posterLoginName', label: '工号'},
|
||||
{prop: 'posterUserName', label: '姓名'},
|
||||
{prop: 'postTitle', label: '标题'},
|
||||
{prop: 'postingTime', label: '咨询时间'},
|
||||
{prop: 'isReply', label: '回复情况'}
|
||||
],
|
||||
addDialogVisible: false,
|
||||
viewDialogVisible: false,
|
||||
rules: {
|
||||
postTitle: [{required: true, message: '请输入咨询主题', trigger: ['change', 'blur']}],
|
||||
postContent: [{required: true, message: '请输入咨询内容', trigger: ['change', 'blur']}],
|
||||
},
|
||||
formData: {
|
||||
postTitle: null,
|
||||
postContent: null
|
||||
},
|
||||
pageForm: {
|
||||
isReply: null,
|
||||
year: null
|
||||
},
|
||||
viewData: {}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
openAdd() {
|
||||
this.addDialogVisible = true
|
||||
if (this.$refs['ruleForm']) {
|
||||
this.$refs['ruleForm'].resetFields()
|
||||
}
|
||||
this.$set(this.formData, 'posterLoginName', "${@shiro.getPrincipalProperty('loginname')}")
|
||||
this.$set(this.formData, 'posterUserName', "${@shiro.getPrincipalProperty('username')}")
|
||||
this.$set(this.formData, 'postTitle', null)
|
||||
this.$set(this.formData, 'postContent', null)
|
||||
delete this.formData.id
|
||||
},
|
||||
async doAdd() {
|
||||
const valid = await this.$refs['ruleForm'].validate()
|
||||
if (valid) {
|
||||
const method = this.formData.id ? '/doEdit' : '/doAdd'
|
||||
const resp = await $.post(loc() + method, this.formData)
|
||||
if (resp.code === 0) {
|
||||
this.notifySuccess(resp.msg)
|
||||
this.addDialogVisible = false
|
||||
this.doSearch()
|
||||
}
|
||||
}
|
||||
},
|
||||
async doDelete(id) {
|
||||
const confirm = await this.$confirm('确定删除吗?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
if (confirm === 'confirm') {
|
||||
const resp = await $.post(loc() + '/doDelete', {id})
|
||||
if (resp.code === 0) {
|
||||
this.notifySuccess(resp.msg)
|
||||
this.doSearch()
|
||||
}
|
||||
}
|
||||
},
|
||||
openEdit(row) {
|
||||
const {id, posterUserName, posterLoginName, postTitle, postContent} = row
|
||||
this.formData = {
|
||||
id, posterUserName, posterLoginName, postTitle, postContent
|
||||
}
|
||||
this.addDialogVisible = true
|
||||
},
|
||||
openView(row) {
|
||||
this.viewDialogVisible = true
|
||||
this.viewData = row
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.pageForm.year = new Date().getFullYear().toString()
|
||||
this.pageForm.isReply = null
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,173 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
<!--
|
||||
#include
|
||||
|
||||
(
|
||||
"/platform/psychology/onlinePost/include/postInfoCss.html"
|
||||
)
|
||||
{
|
||||
}
|
||||
#-- >
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<guava>
|
||||
<el-card shadow="never">
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-date-picker
|
||||
v-model="pageForm.year"
|
||||
value-format="yyyy"
|
||||
type="year"
|
||||
placeholder="选择年">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select v-model="pageForm.isReply">
|
||||
<el-option :value="null" label="全部"></el-option>
|
||||
<el-option :value="true" label="已回复"></el-option>
|
||||
<el-option :value="false" label="未回复"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-button type="primary" icon="el-icon-search" @click="doSearch">搜索</el-button>
|
||||
</div>
|
||||
|
||||
</el-card>
|
||||
|
||||
<el-card shadow="never" class="mt10">
|
||||
<table-tool label="咨询列表" :app="this">
|
||||
<template #func>
|
||||
|
||||
</template>
|
||||
</table-tool>
|
||||
<el-table :data="tableData" stripe border :size="tableSize" style="width: 100%">
|
||||
<el-table-column type="index" label="序号" width="80px"></el-table-column>
|
||||
<el-table-column
|
||||
align="center"
|
||||
header-align="center"
|
||||
v-for="column in tableColumns"
|
||||
show-overflow-tooltip
|
||||
:label="column.label"
|
||||
:prop="column.prop"
|
||||
:sortable="column.sortable"
|
||||
>
|
||||
<template v-if="column.prop==='replyCount'" scope="{row}">
|
||||
<el-tag type="success" v-if="row.replyCount>0">已回复</el-tag>
|
||||
<el-tag type="info" v-else>未回复</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" header-align="center" label="操作" width="250">
|
||||
<template scope="{row}">
|
||||
<el-button size="mini" type="primary" @click="openView(row)">查看</el-button>
|
||||
<el-button size="mini" type="primary" @click="openReply(row)">回复</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--#include("/layouts/pagination.html"){}#-->
|
||||
</el-card>
|
||||
</guava>
|
||||
|
||||
<el-dialog title="回复咨询" :visible.sync="replyDialogVisible" width="55%" top="100px"
|
||||
:close-on-click-modal="false">
|
||||
<el-form :model="formData" ref="ruleForm" :rules="rules" label-width="100px" label-suffix="：">
|
||||
<vi-title title="咨询信息"></vi-title>
|
||||
<el-form-item label="咨询人">
|
||||
<span>{{formData.posterUserName}}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="咨询主题" prop="postTitle">
|
||||
<span>{{formData.postTitle}}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="主要内容" prop="postContent">
|
||||
<span>{{formData.postContent}}</span>
|
||||
</el-form-item>
|
||||
|
||||
<vi-title title="我来回复"></vi-title>
|
||||
<el-form-item label="回复内容" prop="replyContent">
|
||||
<el-input type="textarea" rows="3" v-model="formData.replyContent"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button @click="replyDialogVisible=false">取消</el-button>
|
||||
<el-button type="primary" @click="doReply">提交</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
|
||||
<!--#include("/platform/psychology/onlinePost/include/postInfo.html"){}#-->
|
||||
|
||||
</div>
|
||||
<script>
|
||||
const vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [initTableMixins],
|
||||
data() {
|
||||
return {
|
||||
tableColumns: [
|
||||
{prop: 'posterUserName', label: '姓名'},
|
||||
{prop: 'postTitle', label: '标题'},
|
||||
{prop: 'postingTime', label: '咨询时间'},
|
||||
{prop: 'replyCount', label: '回复情况'}
|
||||
],
|
||||
replyDialogVisible: false,
|
||||
viewDialogVisible: false,
|
||||
rules: {
|
||||
replyContent: [{required: true, message: '请输入回复内容', trigger: ['change', 'blur']}],
|
||||
|
||||
},
|
||||
formData: {
|
||||
postTitle: null,
|
||||
postContent: null,
|
||||
replyContent: null
|
||||
},
|
||||
pageForm: {
|
||||
isReply: null,
|
||||
year: null
|
||||
},
|
||||
viewData: {}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
openReply(row) {
|
||||
const {id, posterUserName, postTitle, postContent} = row
|
||||
this.formData = {
|
||||
id, posterUserName, postTitle, postContent,
|
||||
replyContent: null
|
||||
}
|
||||
this.replyDialogVisible = true
|
||||
},
|
||||
async doReply() {
|
||||
const valid = await this.$refs['ruleForm'].validate()
|
||||
if (valid) {
|
||||
const params = {
|
||||
replyContent: this.formData.replyContent,
|
||||
postId: this.formData.id
|
||||
}
|
||||
const resp = await $.post(loc() + '/doReply', params)
|
||||
if (resp.code === 0) {
|
||||
this.notifySuccess(resp.msg)
|
||||
this.replyDialogVisible = false
|
||||
this.doSearch()
|
||||
}
|
||||
}
|
||||
},
|
||||
openView(row) {
|
||||
this.viewDialogVisible = true
|
||||
this.viewData = row
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.pageForm.year = new Date().getFullYear().toString()
|
||||
this.pageForm.isReply = null
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,254 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
.top-col {
|
||||
background-color: white;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
padding: 20px;
|
||||
width: calc((100% - (20px * 3)) / 4);
|
||||
overflow: hidden;
|
||||
color: #FFFFFF;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.top-col:hover {
|
||||
transform: scale(1.01);
|
||||
}
|
||||
|
||||
.top-col:not(:last-child), .center-col:not(:last-child) {
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.col-title {
|
||||
/*color: rgba(0, 0, 0, .45);*/
|
||||
font-size: 14px;
|
||||
margin-bottom: 10px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.top-col-member-number {
|
||||
font-size: 30px;
|
||||
/*color: rgba(0, 0, 0, .85);*/
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.top-col-chart {
|
||||
height: 80px;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.center-col {
|
||||
background-color: white;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
padding: 20px;
|
||||
/*width: calc((100% - (20px)) / 2);*/
|
||||
}
|
||||
|
||||
.el-table__body-wrapper::-webkit-scrollbar {
|
||||
display: none; /* Chrome Safari */
|
||||
}
|
||||
|
||||
.el-table__body-wrapper {
|
||||
scrollbar-width: none; /* firefox */
|
||||
-ms-overflow-style: none; /* IE 10+ */
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 500px) {
|
||||
.num-card {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.num-card .top-col {
|
||||
width: 100%;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak style="background-color: #f0f2f5;padding: 20px;box-sizing: border-box;">
|
||||
|
||||
<el-card shadow="never">
|
||||
|
||||
<el-date-picker
|
||||
@change="getData()"
|
||||
v-model="pageForm.year"
|
||||
value-format="yyyy"
|
||||
type="year"
|
||||
placeholder="年度">
|
||||
</el-date-picker>
|
||||
</el-card>
|
||||
|
||||
<el-row type="flex" style="margin-top: 20px" class="num-card">
|
||||
<el-col :span="6" class="top-col" style="background: rgb(248, 108, 107)">
|
||||
<div class="col-title">总开放场次</div>
|
||||
<div class="top-col-member-number">{{numberSessionMap.total}}<span
|
||||
style="font-size: 14px"> 次</span></div>
|
||||
</el-col>
|
||||
<el-col :span="6" class="top-col" style="background: rgb(133, 149, 244)">
|
||||
<div class="col-title">预约成功场次</div>
|
||||
<div class="top-col-member-number">{{numberSessionMap.successNum}}<span
|
||||
style="font-size: 14px"> 次</span></div>
|
||||
</el-col>
|
||||
<el-col :span="6" class="top-col" style="background: rgb(254, 187, 80)">
|
||||
<div @click="tableIndex = 1; tableChange()">
|
||||
<div class="col-title">咨询师人数</div>
|
||||
<div class="top-col-member-number">{{doctorList.length}}<span
|
||||
style="font-size: 14px"> 人</span></div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="6" class="top-col" style="background: #26A65B">
|
||||
<div @click="tableIndex = 2; tableChange()">
|
||||
<div class="col-title">总计服务教师人数</div>
|
||||
<div class="top-col-member-number">{{serviceTeacherCount}}<span
|
||||
style="font-size: 14px"> 人</span></div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row type="flex" style="background-color: #f0f2f5;margin-top: 20px">
|
||||
<!-- <el-col class="center-col" :span="12">-->
|
||||
<!-- <vi-title title="按分工会统计"></vi-title>-->
|
||||
<!-- <el-table ref="unionTable" :data="unionData" style="width: 100%;"-->
|
||||
<!-- :height="tableHeight"-->
|
||||
<!-- :header-cell-style="{background:'#FAFAFA'}" row-key="id">-->
|
||||
<!-- <el-table-column label="序号" width="100px" type="index"></el-table-column>-->
|
||||
<!-- <el-table-column prop="unioncode" label="院级工会" sortable show-overflow-tooltip>-->
|
||||
<!-- <template scope="{row}">-->
|
||||
<!-- {{row.unionName}} {{isDisPlayCode?'（'+row.unionCode+'）':null}}-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<!-- <el-table-column prop="userNum" label="预约人数" width="120px" sortable-->
|
||||
<!-- show-overflow-tooltip></el-table-column>-->
|
||||
<!-- </el-table>-->
|
||||
<!-- </el-col>-->
|
||||
<el-col v-show="tableIndex === 1" class="center-col" :span="24">
|
||||
<vi-title title="按咨询师统计"></vi-title>
|
||||
<el-table ref="unionTable" :data="doctorList" style="width: 100%;"
|
||||
:height="tableHeight"
|
||||
:header-cell-style="{background:'#FAFAFA'}" row-key="id">
|
||||
<el-table-column label="序号" width="100px" type="index"></el-table-column>
|
||||
<el-table-column prop="doctorUserName" label="咨询师" sortable show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="sex" label="性别" sortable show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="jobTitle" label="职称" sortable show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="serviceNum" label="服务次数" width="120px" sortable
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column label="操作" width="160px">
|
||||
<template scope="{row}">
|
||||
<el-button @click="openView(row)" type="primary" size="mini">查看</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
|
||||
<el-col v-if="tableIndex === 2" class="center-col" :span="24">
|
||||
<vi-title title="按服务教师统计"></vi-title>
|
||||
<el-table ref="unionTable" :data="applyUserTable" style="width: 100%;"
|
||||
:height="tableHeight"
|
||||
:header-cell-style="{background:'#FAFAFA'}" row-key="id">
|
||||
<el-table-column label="序号" width="100px" type="index"></el-table-column>
|
||||
<el-table-column prop="applyUserName" label="教师" sortable show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="sex" label="性别" sortable show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="unitName" label="所属单位" sortable show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="unionName" label="所属工会" sortable show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="startTime" label="开始时间" sortable show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="endTime" label="结束时间" sortable show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="doctorUserName" label="咨询师" sortable show-overflow-tooltip></el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
|
||||
|
||||
<el-dialog :visible.sync="applyUserVisible" width="60%" title="服务教师列表" top="100px">
|
||||
<el-table :data="applyUserList" style="width: 100%;" row-key="id">
|
||||
<el-table-column label="序号" width="100px" type="index"></el-table-column>
|
||||
<el-table-column prop="applyUserName" label="教师" sortable show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="sex" label="性别" sortable show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="unitName" label="所属单位" sortable show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="unionName" label="所属工会" sortable show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="startTime" label="开始时间" sortable show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="endTime" label="结束时间" sortable show-overflow-tooltip></el-table-column>
|
||||
</el-table>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="applyUserVisible = false">取 消</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const vue = new Vue({
|
||||
el: '#app',
|
||||
data() {
|
||||
return {
|
||||
applyUserList: [],
|
||||
applyUserVisible: false,
|
||||
numberSessionMap: {},
|
||||
unionData: [],
|
||||
tableHeight: '0px',
|
||||
doctorList: [],
|
||||
pageForm: {
|
||||
year: null
|
||||
},
|
||||
serviceTeacherCount: 0,
|
||||
tableIndex: 1,
|
||||
applyUserTable: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async openView(row) {
|
||||
const resp = await $.post(loc() + '/tableChangeData', {
|
||||
year: this.pageForm.year,
|
||||
tableIndex: 2,
|
||||
doctorUser: row.userId
|
||||
})
|
||||
if (resp.code === 0) {
|
||||
this.applyUserList = resp.data
|
||||
}
|
||||
this.applyUserVisible = true
|
||||
},
|
||||
async tableChange() {
|
||||
this.pageForm.tableIndex = this.tableIndex
|
||||
const resp = await $.post(loc() + '/tableChangeData', this.pageForm)
|
||||
if (resp.code === 0) {
|
||||
if (this.tableIndex === 1) {
|
||||
this.doctorList = resp.data
|
||||
} else {
|
||||
this.applyUserTable = resp.data
|
||||
}
|
||||
}
|
||||
},
|
||||
async getData() {
|
||||
const resp = await $.post(loc() + '/getData', this.pageForm)
|
||||
if (resp.code === 0) {
|
||||
this.numberSessionMap = resp.data.numberSessionMap
|
||||
this.unionData = resp.data.unionList
|
||||
this.doctorList = resp.data.doctorList
|
||||
this.serviceTeacherCount = resp.data.serviceTeacherCount
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
setTimeout(() => {
|
||||
this.tableHeight = window.innerHeight - (this.$refs.unionTable.$el.getBoundingClientRect().top) - 20 - 20 + 'px'
|
||||
window.onresize = () => {
|
||||
this.tableHeight = window.innerHeight - (this.$refs.unionTable.$el.getBoundingClientRect().top) - 20 - 20 + 'px'
|
||||
}
|
||||
})
|
||||
},
|
||||
created() {
|
||||
this.getData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
Reference in New Issue
Block a user