first commit
This commit is contained in:
@@ -0,0 +1,124 @@
|
||||
const basicForm = {
|
||||
template: /*language=HTML*/ `
|
||||
<div>
|
||||
<el-dialog :visible.sync="addDialogVisible"
|
||||
width="50%" title="心理咨询预约"
|
||||
:close-on-click-modal="false"
|
||||
append-to-body>
|
||||
<div class="left-span-label">预约时间段</div>
|
||||
<el-descriptions :column="2" border class="table_fixed">
|
||||
<el-descriptions-item label="开始时间">
|
||||
{{ formData.startTime }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="结束时间">
|
||||
{{ formData.endTime }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<div class="left-span-label">咨询师信息</div>
|
||||
<el-descriptions :column="2" border class="table_fixed">
|
||||
<el-descriptions-item label="姓名">
|
||||
{{ formData.doctorUserName }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="性别">
|
||||
{{ formData.doctorSex }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="单位">
|
||||
{{ formData.doctorUnitName }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="电话">
|
||||
{{ formData.doctorMobile }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<div class="left-span-label">预约人信息</div>
|
||||
<el-form :model="formData" ref="formRef" :rules="formRules" label-width="110px" label-position="left">
|
||||
<el-form-item label="姓名">
|
||||
<el-input :value="$store.state.user.username" readonly></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="工号">
|
||||
<el-input :value="$store.state.user.loginname" readonly></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="单位">
|
||||
<el-input :value="$store.state.user.unit.name" readonly></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系方式" prop="mobile">
|
||||
<el-input v-model="formData.mobile" placeholder="请输入联系方式"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="预约咨询方式" prop="askTypeValue">
|
||||
<el-select
|
||||
v-model="formData.askTypeValue"
|
||||
filterable
|
||||
style="width: 100%"
|
||||
placeholder="请选择咨询方式">
|
||||
<el-option v-for="item in askTypeOptions"
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="预约备注" prop="remark">
|
||||
<el-input type="textarea" :row="3" v-model="formData.remark"
|
||||
placeholder="请输入预约备注事项"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="$emit('refresh'); addDialogVisible = false">取消</el-button>
|
||||
<el-button @click="onSubmit" type="primary">提交</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
`,
|
||||
dicts: ["LEGAL_ASK_TYPE"],
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
formData: {},
|
||||
formRules: {
|
||||
askTypeValue: [{required: true, message: '请选择咨询方式', trigger: ['change']}],
|
||||
mobile: [{required: true, message: '请输入联系方式', trigger: ['change']}],
|
||||
},
|
||||
addDialogVisible: false,
|
||||
askTypeOptions: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onOpen(row) {
|
||||
if(row.askType) {
|
||||
row.askType = JSON.parse(row.askType)
|
||||
this.askTypeOptions = this.dict.type.LEGAL_ASK_TYPE.filter(o => row.askType.includes(o.code))
|
||||
}
|
||||
this.formData = clone(row)
|
||||
if(this.askTypeOptions.length > 0) {
|
||||
this.$set(this.formData, 'askTypeValue', this.askTypeOptions[0].code)
|
||||
}
|
||||
this.$set(this.formData, 'mobile', this.$store.state.user.mobile)
|
||||
this.addDialogVisible = true
|
||||
},
|
||||
onSubmit() {
|
||||
this.$refs.formRef.validate((valid) => {
|
||||
if (valid) {
|
||||
this.$confirm("您确定要提交吗？", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(async () => {
|
||||
const resp = await this.$axios.post("/platform/legal/apply/submit", this.formData)
|
||||
if (resp.code === 0) {
|
||||
this.$message.success(resp.msg)
|
||||
this.$emit('refresh')
|
||||
this.addDialogVisible = false
|
||||
} else {
|
||||
this.$message.warning(resp.msg)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
style: /*language=CSS*/ `
|
||||
|
||||
`
|
||||
}
|
||||
@@ -0,0 +1,209 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<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;
|
||||
}
|
||||
.fc-icon {
|
||||
height: 1.5em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.fc-event .fc-content {
|
||||
padding: 3px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
|
||||
<el-card shadow="never">
|
||||
<div id="legal-calendar"></div>
|
||||
</el-card>
|
||||
|
||||
<basic-form ref="basicFormRef" @refresh="refresh"></basic-form>
|
||||
|
||||
</div>
|
||||
<script nonce="${cspNonce!}">
|
||||
<!--#include('basicForm.js'){}#-->
|
||||
let calendar = null
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
mixins: [initTableMixins],
|
||||
components: {
|
||||
"basic-form": basicForm,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
calendarHeight: 0,
|
||||
events: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
refresh() {
|
||||
calendar.fullCalendar('unselect')
|
||||
this.queryAppointmentInfo()
|
||||
},
|
||||
initCalendar() {
|
||||
const that = this
|
||||
const today = this.$moment().format('YYYY-MM-DD')
|
||||
if (calendar) return
|
||||
calendar = $('#legal-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: "00:30:00", //日期视图左边那一列多长间隔显示一条日期文字(默认跟着slotDuration走的，可自定义)
|
||||
snapDuration: "00:30: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.queryAppointmentInfo()
|
||||
},
|
||||
eventRender: (info) => {
|
||||
},
|
||||
//日历数据源
|
||||
events: that.events,
|
||||
//日程事件点击
|
||||
eventClick: (event, jsEvent) => {
|
||||
if (event.data.appointmentUser) return
|
||||
if (new Date().getTime() > event.data.startTimeTs) return
|
||||
this.$refs.basicFormRef.onOpen(clone(event.data))
|
||||
},
|
||||
selectable: false, //是否允许通过单击或拖动选择日历中的对象，包括天和时间
|
||||
selectMirror: true, //镜像
|
||||
lazyFetching: false, //是否启用懒加载技术--即只取当前条件下的视图数据，其它数据在切换时触发，默认true只取当前视图的，false是取全视图的
|
||||
defaultTimedEventDuration: "00:30:00", //在Event Object中如果没有end参数时使用，如start=7:00pm，则该日程对象时间范围就是7:00~9:00
|
||||
defaultAllDayEventDuration: {days: 1}, //默认1天是多长，（有的是采用工作时间模式，所以支持自定义）
|
||||
});
|
||||
},
|
||||
//获取预约数据
|
||||
async queryAppointmentInfo() {
|
||||
if (!calendar) return
|
||||
const view = calendar.fullCalendar('getView')
|
||||
//这里取时间戳
|
||||
const startTimeTs = view.start._i
|
||||
const endTimeTs = view.end._i
|
||||
const resp = await this.$axios.post('/platform/legal/appointmentSet/queryAppointmentInfo', {startTimeTs, endTimeTs})
|
||||
let events = []
|
||||
if (resp.code === 0) {
|
||||
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 === this.$store.state.user.id) {
|
||||
className = 'blue'
|
||||
title = '我已预约'
|
||||
} else {
|
||||
className = 'gray'
|
||||
title = '不可预约'
|
||||
}
|
||||
}
|
||||
events.push({
|
||||
id: v.id,
|
||||
title: title,
|
||||
start: v.startTime,
|
||||
end: v.endTime,
|
||||
className: className,
|
||||
data: v,
|
||||
})
|
||||
})
|
||||
}
|
||||
calendar.fullCalendar('removeEvents', () => true)
|
||||
calendar.fullCalendar('addEventSource', events, true)
|
||||
},
|
||||
init() {
|
||||
this.$nextTick(() => {
|
||||
setTimeout(() => {
|
||||
this.initCalendar()
|
||||
this.queryAppointmentInfo()
|
||||
}, 100)
|
||||
})
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.calendarHeight = window.innerHeight - 160
|
||||
},
|
||||
async created() {
|
||||
this.init()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,128 @@
|
||||
const addForm = {
|
||||
template: /*language=HTML*/ `
|
||||
<div>
|
||||
<el-dialog :visible.sync="addDialogVisible"
|
||||
width="30%" title="新增预约时间段"
|
||||
:close-on-click-modal="false"
|
||||
append-to-body>
|
||||
<el-form :model="formData" ref="formRef" :rules="formRules" label-width="80px" label-position="left">
|
||||
<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="queryDoctorUser">
|
||||
<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 dict.type.LEGAL_ASK_TYPE"
|
||||
:key="item.code"
|
||||
:label="item.label"
|
||||
:value="item.code"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="$emit('refresh'); addDialogVisible = false">取消</el-button>
|
||||
<el-button @click="onSubmit" type="primary">提交</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
`,
|
||||
store,
|
||||
dicts:["LEGAL_ASK_TYPE"],
|
||||
data() {
|
||||
return {
|
||||
addDialogVisible: false,
|
||||
formData: {},
|
||||
formRules: {
|
||||
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'}],
|
||||
},
|
||||
doctorUserList: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onOpen(row) {
|
||||
this.formData = row
|
||||
this.addDialogVisible = true
|
||||
},
|
||||
async queryDoctorUser(keyWord) {
|
||||
const resp = await this.$axios.post(loc() + '/queryDoctorUser', {
|
||||
keyWord,
|
||||
startTimeTs: this.formData.startTimeTs,
|
||||
endTimeTs: this.formData.endTimeTs,
|
||||
})
|
||||
this.doctorUserList = resp.data
|
||||
},
|
||||
onSubmit() {
|
||||
if (Date.parse(this.formData.startTime) < new Date().getTime()) {
|
||||
this.$message.warning('预约时间不能小于当前时间，请重新设置')
|
||||
this.$emit('refresh')
|
||||
this.addDialogVisible = false
|
||||
return
|
||||
}
|
||||
this.$refs.formRef.validate((valid) => {
|
||||
if (valid) {
|
||||
this.$confirm("您确定要提交吗？", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(async () => {
|
||||
this.formData.askType = JSON.stringify(this.formData.askType)
|
||||
const resp = await this.$axios.post("/platform/legal/appointmentSet/onSubmit", this.formData)
|
||||
if (resp.code === 0) {
|
||||
this.$message.success(resp.msg)
|
||||
this.$emit('refresh')
|
||||
this.addDialogVisible = false
|
||||
} else {
|
||||
this.$message.warning(resp.msg)
|
||||
}
|
||||
}).catch(() => {})
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.queryDoctorUser(null)
|
||||
},
|
||||
style: /*language=CSS*/ `
|
||||
|
||||
`
|
||||
}
|
||||
@@ -0,0 +1,221 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<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;
|
||||
}
|
||||
.fc-icon {
|
||||
height: 1.5em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.fc-event .fc-content {
|
||||
padding: 3px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
|
||||
<el-card shadow="never">
|
||||
<div id="legal-calendar"></div>
|
||||
</el-card>
|
||||
|
||||
<add-form ref="addFormRef" @refresh="refresh"></add-form>
|
||||
<info ref="infoRef" @refresh="refresh"></info>
|
||||
|
||||
</div>
|
||||
<script nonce="${cspNonce!}">
|
||||
<!--#include('addForm.js'){}#-->
|
||||
<!--#include('info.js'){}#-->
|
||||
let calendar = null
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
mixins: [initTableMixins],
|
||||
components: {
|
||||
"add-form": addForm,
|
||||
"info": info,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
calendarHeight: 0,
|
||||
events: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
refresh() {
|
||||
calendar.fullCalendar('unselect')
|
||||
this.queryAppointmentInfo()
|
||||
},
|
||||
initCalendar() {
|
||||
const that = this
|
||||
const today = this.$moment().format('YYYY-MM-DD')
|
||||
if (calendar) return
|
||||
calendar = $('#legal-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: "00:30:00", //日期视图左边那一列多长间隔显示一条日期文字(默认跟着slotDuration走的，可自定义)
|
||||
snapDuration: "00:30: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.queryAppointmentInfo()
|
||||
},
|
||||
eventRender: (info) => {
|
||||
},
|
||||
//日历数据源
|
||||
events: that.events,
|
||||
//日程事件点击
|
||||
eventClick: (event, jsEvent) => {
|
||||
this.$refs.infoRef.onOpen(clone(event.data))
|
||||
},
|
||||
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
|
||||
}
|
||||
const row = {
|
||||
startTime: startTime,
|
||||
endTime: endTime,
|
||||
doctorUser: '',
|
||||
askType: [],
|
||||
}
|
||||
this.$refs.addFormRef.onOpen(row)
|
||||
},
|
||||
lazyFetching: false, //是否启用懒加载技术--即只取当前条件下的视图数据，其它数据在切换时触发，默认true只取当前视图的，false是取全视图的
|
||||
defaultTimedEventDuration: "00:30:00", //在Event Object中如果没有end参数时使用，如start=7:00pm，则该日程对象时间范围就是7:00~9:00
|
||||
defaultAllDayEventDuration: {days: 1}, //默认1天是多长，（有的是采用工作时间模式，所以支持自定义）
|
||||
});
|
||||
},
|
||||
//获取预约数据
|
||||
async queryAppointmentInfo() {
|
||||
if (!calendar) return
|
||||
const view = calendar.fullCalendar('getView')
|
||||
//这里取时间戳
|
||||
const startTimeTs = this.$moment(this.$moment(view.start._i).format('YYYY-MM-DD') + ' 00:00:00').unix()
|
||||
const endTimeTs = view.end._i
|
||||
const resp = await this.$axios.post(loc() + '/queryAppointmentInfo', {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,
|
||||
data: v
|
||||
})
|
||||
this.events = events
|
||||
})
|
||||
}
|
||||
calendar.fullCalendar('removeEvents', () => true)
|
||||
calendar.fullCalendar('addEventSource', events, true)
|
||||
},
|
||||
init() {
|
||||
this.$nextTick(() => {
|
||||
this.initCalendar()
|
||||
this.queryAppointmentInfo()
|
||||
})
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.calendarHeight = window.innerHeight - 160
|
||||
},
|
||||
async created() {
|
||||
this.init()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,165 @@
|
||||
const info = {
|
||||
template: /*language=HTML*/ `
|
||||
<div>
|
||||
<el-dialog :visible.sync="infoDialogVisible"
|
||||
width="50%" title="预约信息"
|
||||
:close-on-click-modal="false"
|
||||
append-to-body>
|
||||
<div class="left-span-label">预约时间段</div>
|
||||
<el-descriptions :column="2" border class="table_fixed">
|
||||
<el-descriptions-item label="开始时间">
|
||||
{{ formData.startTime }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="结束时间">
|
||||
{{ formData.endTime }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<div class="left-span-label">预约人信息</div>
|
||||
<el-descriptions v-if="formData.appointmentUser" :column="2" border class="table_fixed">
|
||||
<el-descriptions-item label="姓名">
|
||||
{{ formData.appointmentUserName }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="工号">
|
||||
{{ formData.appointmentLoginName }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="单位">
|
||||
{{ formData.appointmentUnitName }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="联系方式">
|
||||
{{ formData.appointmentMobile }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="预约咨询方式" :span="2">
|
||||
<dict-tag :options="dict.type.LEGAL_ASK_TYPE"
|
||||
:value="formData.askTypeValue"></dict-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="预约人备注" :span="2">
|
||||
{{ formData.remark }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<el-empty v-else description="暂无人预约"></el-empty>
|
||||
<div class="left-span-label">咨询师信息</div>
|
||||
<el-form :model="formData" ref="formRef" :rules="formRules" label-width="80px" label-position="left">
|
||||
<el-form-item label="咨询师" prop="doctorUser">
|
||||
<el-select
|
||||
v-model="formData.doctorUser"
|
||||
filterable
|
||||
remote
|
||||
style="width: 100%"
|
||||
reserve-keyword
|
||||
placeholder="请输入关键词"
|
||||
:remote-method="queryDoctorUser">
|
||||
<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 dict.type.LEGAL_ASK_TYPE"
|
||||
:key="item.code"
|
||||
:label="item.label"
|
||||
:value="item.code"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="$emit('refresh'); infoDialogVisible = false">取消</el-button>
|
||||
<el-button @click="onDelete" type="danger">删除</el-button>
|
||||
<el-button @click="onSubmit" type="primary">提交</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
`,
|
||||
dicts:["LEGAL_ASK_TYPE"],
|
||||
data() {
|
||||
return {
|
||||
formData: {},
|
||||
formRules: {
|
||||
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'}],
|
||||
},
|
||||
infoDialogVisible: false,
|
||||
doctorUserList: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onOpen(row) {
|
||||
if (row.doctorUser) {
|
||||
this.doctorUserList = [{
|
||||
id: row.doctorUser,
|
||||
doctorUserName: row.doctorUserName,
|
||||
mobile: row.doctorMobile,
|
||||
}]
|
||||
}
|
||||
row.askType = row ? JSON.parse(row.askType) : []
|
||||
this.formData = row
|
||||
this.infoDialogVisible = true
|
||||
},
|
||||
onDelete() {
|
||||
let msg = '您确定要删除吗？'
|
||||
if (this.formData.appointmentUser) {
|
||||
msg = "<span style='color: red'>该时间段已有预约人</span>，您确定要删除吗？"
|
||||
}
|
||||
this.$confirm(msg, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
dangerouslyUseHTMLString: true,
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
const resp = await this.$axios.post('/platform/legal/appointmentSet/onDelete', {id: this.formData.id})
|
||||
if (resp.code === 0) {
|
||||
this.$message.success(resp.msg)
|
||||
this.$emit('refresh')
|
||||
this.infoDialogVisible = false
|
||||
}
|
||||
}).catch(() => {})
|
||||
},
|
||||
onSubmit() {
|
||||
let msg = ''
|
||||
if (this.formData.appointmentUser) {
|
||||
msg += "<span style='color: red'>该时间段已有预约人</span>，"
|
||||
}
|
||||
msg += '这将清空预约人已选择的咨询方式，您确定要修改咨询方式吗？';
|
||||
this.$refs.formRef.validate((valid) => {
|
||||
if (valid) {
|
||||
this.$confirm(msg, "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
dangerouslyUseHTMLString: true,
|
||||
type: "warning"
|
||||
}).then(async () => {
|
||||
this.formData.askType = JSON.stringify(this.formData.askType)
|
||||
const resp = await this.$axios.post("/platform/legal/appointmentSet/onEdit", this.formData)
|
||||
if (resp.code === 0) {
|
||||
this.$message.success(resp.msg)
|
||||
this.$emit('refresh')
|
||||
this.infoDialogVisible = false
|
||||
} else {
|
||||
this.$message.warning(resp.msg)
|
||||
}
|
||||
}).catch(() => {})
|
||||
}
|
||||
})
|
||||
},
|
||||
async queryDoctorUser(keyWord) {
|
||||
const resp = await this.$axios.post('/platform/legal/appointmentSet/queryDoctorUser', {
|
||||
keyWord,
|
||||
startTimeTs: this.formData.startTimeTs,
|
||||
endTimeTs: this.formData.endTimeTs,
|
||||
})
|
||||
this.doctorUserList = resp.data
|
||||
},
|
||||
},
|
||||
style: /*language=CSS*/ `
|
||||
|
||||
`
|
||||
}
|
||||
@@ -0,0 +1,125 @@
|
||||
const basicForm = {
|
||||
template: /*language=HTML*/ `
|
||||
<div>
|
||||
<el-form :model="formData" ref="formRef" :rules="formRules" label-width="110px" label-position="left">
|
||||
<el-form-item label="姓名" prop="userId">
|
||||
<el-select
|
||||
style="width: 100%"
|
||||
v-model="formData.userId"
|
||||
filterable
|
||||
remote
|
||||
:disabled="formData.id !== '' && formData.id !== null && formData.id !== undefined"
|
||||
reserve-keyword
|
||||
placeholder="请输入关键词"
|
||||
:remote-method="selectQueryUser"
|
||||
@change="selectUserChange"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in userOptions"
|
||||
:key="item.id"
|
||||
:label="item.userName"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="性别" prop="sex">
|
||||
<el-select v-model="formData.sex" placeholder="请选择性别" style="width: 100%">
|
||||
<el-option label="男" value="男"></el-option>
|
||||
<el-option label="女" value="女"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="职称" prop="technicalTitle">
|
||||
<el-input v-model="formData.technicalTitle" placeholder="请输入职称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="单位" prop="unitName">
|
||||
<el-input v-model="formData.unitName" placeholder="请输入单位"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系方式" prop="mobile">
|
||||
<el-input v-model.trim="formData.mobile" placeholder="请输入联系方式"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="特长" prop="specialty">
|
||||
<el-input type="textarea" :rows="3" v-model="formData.specialty" placeholder="请输入特长"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="简介" prop="introduce">
|
||||
<el-input type="textarea" :rows="3" v-model="formData.introduce" placeholder="请输入简介"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="头像" prop="avatar">
|
||||
<file-upload :value.sync="formData.avatar" accept=".jpg,.jpeg,.png"
|
||||
:upload_number="1" upload_result_category="interval"
|
||||
complete_result upload_mode="drag"></file-upload>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row class="mt10" justify="end" type="flex">
|
||||
<el-button @click="$emit('refresh')">取消</el-button>
|
||||
<el-button @click="onSubmit" type="primary">提交</el-button>
|
||||
</el-row>
|
||||
</div>
|
||||
`,
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
formData: {},
|
||||
formRules: {
|
||||
userId: [{required: true, message: '请输入姓名', trigger: ['change', 'blur']}],
|
||||
sex: [{required: true, message: '请选择性别', trigger: ['change', 'blur']}],
|
||||
jobTitle: [{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']}],
|
||||
},
|
||||
userOptions: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
selectQueryUser(keyword) {
|
||||
this.$axios.post("/platform/legal/doctorManage/listUser", { keyword: keyword }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.userOptions = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
selectUserChange(val) {
|
||||
if (val) {
|
||||
const user = this.userOptions.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)
|
||||
this.$set(this.formData, 'technicalTitle', user.technicalTitle)
|
||||
}
|
||||
},
|
||||
onOpen(row) {
|
||||
if(row && row.id) {
|
||||
this.userOptions = [
|
||||
{
|
||||
id: row.userId,
|
||||
userName: row.userName,
|
||||
loginName: row.loginName
|
||||
}
|
||||
]
|
||||
this.formData = clone(row)
|
||||
}
|
||||
},
|
||||
onSubmit() {
|
||||
this.$refs.formRef.validate(async (valid) => {
|
||||
if (valid) {
|
||||
this.$confirm("您确定要提交吗？", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(async () => {
|
||||
const resp = await this.$axios.post("/platform/legal/doctorManage/onSubmit", this.formData)
|
||||
if (resp.code === 0) {
|
||||
this.$message.success(resp.msg)
|
||||
this.$emit('refresh')
|
||||
} else {
|
||||
this.$message.warning(resp.msg)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
style: /*language=CSS*/ `
|
||||
|
||||
`
|
||||
}
|
||||
@@ -0,0 +1,162 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<search @search="doSearch">
|
||||
<search-item label="姓名/工号">
|
||||
<el-input placeholder="请输入姓名或工号" v-model="pageForm.searchKeyword" clearable @keyup.enter.native="doSearch"></el-input>
|
||||
</search-item>
|
||||
</search>
|
||||
</el-card>
|
||||
|
||||
<el-card shadow="never" class="mt20">
|
||||
<table-tool label="咨询师列表">
|
||||
<el-button type="primary" size="small" @click="onAdd">
|
||||
<i class="ti-plus"></i>
|
||||
新增咨询师
|
||||
</el-button>
|
||||
</table-tool>
|
||||
<el-table :data="tableData" @sort-change="pageOrder" :size="tableSize" row-key="id">
|
||||
<el-table-column label="序号" type="index" :index="indexMethod" width="60"></el-table-column>
|
||||
<el-table-column
|
||||
:label="column.label"
|
||||
:prop="column.prop"
|
||||
:key="column.prop"
|
||||
:width="column.width"
|
||||
:sortable="column.sortable"
|
||||
align="center"
|
||||
header-align="center"
|
||||
show-overflow-tooltip
|
||||
v-for="column in tableColumns"
|
||||
>
|
||||
<template v-slot="{ row }" v-if="column.prop === 'avatar'">
|
||||
<el-popover
|
||||
placement="top-start"
|
||||
width="100"
|
||||
trigger="hover">
|
||||
<el-image
|
||||
:src="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="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 label="操作" width="230">
|
||||
<template v-slot="{ row }">
|
||||
<el-button @click="onView(row)" size="mini" type="primary">查看</el-button>
|
||||
<el-button @click="onEdit(row)" size="mini" type="primary">编辑</el-button>
|
||||
<el-button @click="onDelete(row)" size="mini" type="danger">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--#include("/layouts/pagination.html"){}#-->
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<template #edit>
|
||||
<basic-form ref="basicFormRef" @refresh="refresh"></basic-form>
|
||||
</template>
|
||||
|
||||
<template #view>
|
||||
<info ref="infoRef"></info>
|
||||
</template>
|
||||
|
||||
</guava>
|
||||
|
||||
</div>
|
||||
<script nonce="${cspNonce!}">
|
||||
<!--#include('basicForm.js'){}#-->
|
||||
<!--#include('info.js'){}#-->
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
mixins: [initTableMixins],
|
||||
components: {
|
||||
"basic-form": basicForm,
|
||||
"info": info,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tableColumns: [
|
||||
{prop: 'loginName', label: '工号'},
|
||||
{prop: 'userName', label: '姓名'},
|
||||
{prop: 'sex', label: '性别'},
|
||||
{prop: 'unitName', label: '单位'},
|
||||
{prop: 'technicalTitle', label: '职称'},
|
||||
{prop: 'mobile', label: '联系电话'},
|
||||
{prop: 'avatar', label: '头像'}
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
refresh() {
|
||||
this.doSearch()
|
||||
this.$refs.guava.index()
|
||||
},
|
||||
onView(row) {
|
||||
this.$refs.guava.view(() => {
|
||||
this.$refs.infoRef.onOpen(row)
|
||||
})
|
||||
},
|
||||
onAdd() {
|
||||
this.$refs.guava.edit(() => {
|
||||
this.$refs.basicFormRef.onOpen()
|
||||
})
|
||||
},
|
||||
onEdit(row) {
|
||||
this.$refs.guava.edit(() => {
|
||||
this.$refs.basicFormRef.onOpen(row)
|
||||
})
|
||||
},
|
||||
onDelete(row) {
|
||||
this.$confirm("您确定要删除吗, 是否继续?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/legal/doctorManage/onDelete", { id: row.id }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$message.success(res.msg)
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
pageData() {
|
||||
this.$axios.post(loc() + "/pageData", this.pageForm).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.tableData = res.data.list
|
||||
this.pageForm.totalCount = res.data.totalCount
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
async created() {
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,51 @@
|
||||
const info = {
|
||||
template: /*language=HTML*/ `
|
||||
<div>
|
||||
<el-descriptions :column="2" border class="table_fixed">
|
||||
<el-descriptions-item label="姓名">
|
||||
{{viewData.userName}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="性别">
|
||||
{{viewData.sex}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="职称">
|
||||
{{viewData.technicalTitle}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="单位">
|
||||
{{viewData.unitName}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="联系方式" :span="2">
|
||||
{{viewData.mobile}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="特长" :span="2">
|
||||
{{viewData.specialty}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="简介" :span="2">
|
||||
{{viewData.introduce}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="头像" :span="2">
|
||||
<img :src="viewData.avatar"
|
||||
style="height: 100px;width: auto" v-if="viewData.avatar">
|
||||
<span v-else>暂无</span>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
`,
|
||||
data() {
|
||||
return {
|
||||
viewData: {},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onOpen(row) {
|
||||
this.viewData = clone(row)
|
||||
},
|
||||
},
|
||||
style: /*language=CSS*/ `
|
||||
.el-descriptions-item__label {
|
||||
width: 200px;
|
||||
min-width: 200px;
|
||||
max-width: 200px;
|
||||
}
|
||||
`
|
||||
}
|
||||
@@ -0,0 +1,122 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<search @search="doSearch">
|
||||
<search-item label="年度">
|
||||
<el-date-picker
|
||||
placeholder="请选择年度"
|
||||
type="year"
|
||||
@change="doSearch"
|
||||
style="width: 100%"
|
||||
v-model="pageForm.year"
|
||||
value-format="yyyy"
|
||||
></el-date-picker>
|
||||
</search-item>
|
||||
</search>
|
||||
</el-card>
|
||||
|
||||
<el-card shadow="never" class="mt20">
|
||||
<table-tool label="预约记录"></table-tool>
|
||||
<el-table :data="tableData" @sort-change="pageOrder" :size="tableSize">
|
||||
<el-table-column label="序号" type="index" :index="indexMethod" width="60"></el-table-column>
|
||||
<el-table-column
|
||||
:label="column.label"
|
||||
:prop="column.prop"
|
||||
:key="column.prop"
|
||||
:width="column.width"
|
||||
:sortable="column.sortable"
|
||||
align="center"
|
||||
header-align="center"
|
||||
show-overflow-tooltip
|
||||
v-for="column in tableColumns"
|
||||
>
|
||||
<template v-slot="{ row }" v-if="column.prop === 'appointmentTime'">
|
||||
{{ row.startTime + ' 至 ' + row.endTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="230">
|
||||
<template v-slot="{ row }">
|
||||
<el-button @click="onView(row)" size="mini" type="primary">查看</el-button>
|
||||
<el-button v-if="$moment().unix() < $moment(row.startTime).unix()"
|
||||
@click="onDelete(row)" size="mini" type="danger">取消</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--#include("/layouts/pagination.html"){}#-->
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<template #view>
|
||||
<info ref="infoRef"></info>
|
||||
</template>
|
||||
|
||||
</guava>
|
||||
|
||||
</div>
|
||||
<script nonce="${cspNonce!}">
|
||||
<!--#include('info.js'){}#-->
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
mixins: [initTableMixins],
|
||||
components: {
|
||||
"info": info,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tableColumns: [
|
||||
{prop: 'appointmentTime', label: '预约时间', width: '350'},
|
||||
{prop: 'appointmentUserName', label: '姓名'},
|
||||
{prop: 'appointmentLoginName', label: '工号'},
|
||||
{prop: 'appointmentUnitName', label: '单位'},
|
||||
{prop: 'doctorUserName', label: '咨询师'},
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onView(row) {
|
||||
this.$refs.guava.view(() => {
|
||||
this.$refs.infoRef.onOpen(row)
|
||||
})
|
||||
},
|
||||
onDelete(row) {
|
||||
this.$confirm("您确定要删除吗？", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/legal/list/delete", { id: row.id }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$message.success(res.msg)
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
pageData() {
|
||||
this.$axios.post(loc() + "/pageData", this.pageForm).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.tableData = res.data.list
|
||||
this.pageForm.totalCount = res.data.totalCount
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
async created() {
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,70 @@
|
||||
const info = {
|
||||
template: /*language=HTML*/ `
|
||||
<div>
|
||||
<div class="left-span-label">预约时间段</div>
|
||||
<el-descriptions :column="2" border class="table_fixed">
|
||||
<el-descriptions-item label="开始时间">
|
||||
{{ viewData.startTime }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="结束时间">
|
||||
{{ viewData.endTime }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<div class="left-span-label">预约人信息</div>
|
||||
<el-descriptions v-if="viewData.userId" :column="2" border class="table_fixed">
|
||||
<el-descriptions-item label="姓名">
|
||||
{{ viewData.appointmentUserName }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="工号">
|
||||
{{ viewData.appointmentLoginName }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="单位">
|
||||
{{ viewData.appointmentUnitName }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="联系方式">
|
||||
{{ viewData.appointmentMobile }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="预约咨询方式" :span="2">
|
||||
<dict-tag :options="dict.type.LEGAL_ASK_TYPE"
|
||||
:value="viewData.askTypeValue"></dict-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="预约人备注" :span="2">
|
||||
{{ viewData.remark }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<el-empty v-else description="暂无人预约"></el-empty>
|
||||
<div class="left-span-label">咨询师信息</div>
|
||||
<el-descriptions :column="2" border class="table_fixed">
|
||||
<el-descriptions-item label="姓名">
|
||||
{{ viewData.doctorUserName }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="工号">
|
||||
{{ viewData.doctorUnitName }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="联系方式">
|
||||
{{ viewData.doctorMobile }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="职称">
|
||||
{{ viewData.doctorJobTitle }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="个人简介" :span="2">
|
||||
{{ viewData.doctorIntroduce }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
`,
|
||||
dicts:["LEGAL_ASK_TYPE"],
|
||||
data() {
|
||||
return {
|
||||
viewData: {},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onOpen(row) {
|
||||
this.viewData = clone(row)
|
||||
},
|
||||
},
|
||||
style: /*language=CSS*/ `
|
||||
|
||||
`
|
||||
}
|
||||
@@ -0,0 +1,70 @@
|
||||
const basicForm = {
|
||||
template: /*language=HTML*/ `
|
||||
<div>
|
||||
<el-form :model="formData" ref="formRef" :rules="formRules" label-width="110px" label-position="left">
|
||||
<el-form-item label="咨询人姓名">
|
||||
<el-input :value="$store.state.user.username" readonly></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="咨询人工号">
|
||||
<el-input :value="$store.state.user.loginname" readonly></el-input>
|
||||
</el-form-item>
|
||||
<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 class="mt10" justify="end" type="flex">
|
||||
<el-button @click="$emit('refresh')">取消</el-button>
|
||||
<el-button @click="onSubmit" type="primary">提交</el-button>
|
||||
</el-row>
|
||||
</div>
|
||||
`,
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
formData: {},
|
||||
formRules: {
|
||||
postTitle: [{required: true, message: '请输入咨询主题', trigger: ['change', 'blur']}],
|
||||
postContent: [{required: true, message: '请输入咨询内容', trigger: ['change', 'blur']}],
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onOpen(row) {
|
||||
if(row && row.id) {
|
||||
this.formData = clone(row)
|
||||
}
|
||||
},
|
||||
onSubmit() {
|
||||
this.$refs.formRef.validate((valid) => {
|
||||
if (valid) {
|
||||
this.$confirm("您确定要提交吗？", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(async () => {
|
||||
const resp = await this.$axios.post("/platform/legal/onlinePost/submit", this.formData)
|
||||
if (resp.code === 0) {
|
||||
this.$message.success(resp.msg)
|
||||
this.$emit('refresh')
|
||||
} else {
|
||||
this.$message.warning(resp.msg)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
style: /*language=CSS*/ `
|
||||
|
||||
`
|
||||
}
|
||||
@@ -0,0 +1,160 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<search @search="doSearch">
|
||||
<search-item label="年度">
|
||||
<el-date-picker
|
||||
placeholder="请选择年度"
|
||||
type="year"
|
||||
@change="doSearch"
|
||||
style="width: 100%"
|
||||
v-model="pageForm.year"
|
||||
value-format="yyyy"
|
||||
></el-date-picker>
|
||||
</search-item>
|
||||
<search-item label="是否回复">
|
||||
<el-select v-model="pageForm.isReply" style="width: 100%" @change="doSearch">
|
||||
<el-option :value="null" label="全部"></el-option>
|
||||
<el-option :value="true" label="已回复"></el-option>
|
||||
<el-option :value="false" label="未回复"></el-option>
|
||||
</el-select>
|
||||
</search-item>
|
||||
</search>
|
||||
</el-card>
|
||||
|
||||
<el-card shadow="never" class="mt20">
|
||||
<table-tool label="咨询记录">
|
||||
<el-button type="primary" size="small" @click="onAdd">
|
||||
<i class="ti-plus"></i>
|
||||
我要咨询
|
||||
</el-button>
|
||||
</table-tool>
|
||||
<el-table :data="tableData" @sort-change="pageOrder" :size="tableSize" row-key="id">
|
||||
<el-table-column label="序号" type="index" :index="indexMethod" width="60"></el-table-column>
|
||||
<el-table-column
|
||||
:label="column.label"
|
||||
:prop="column.prop"
|
||||
:key="column.prop"
|
||||
:width="column.width"
|
||||
:sortable="column.sortable"
|
||||
align="center"
|
||||
header-align="center"
|
||||
show-overflow-tooltip
|
||||
v-for="column in tableColumns"
|
||||
>
|
||||
<template v-slot="{ row }" v-if="column.prop === 'isReply'">
|
||||
<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 label="操作" width="230">
|
||||
<template v-slot="{ row }">
|
||||
<el-button @click="onView(row)" size="mini" type="primary">查看</el-button>
|
||||
<el-button @click="onEdit(row)" size="mini" type="primary">编辑</el-button>
|
||||
<el-button v-if="!row.isReply" @click="onDelete(row)" size="mini" type="danger">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--#include("/layouts/pagination.html"){}#-->
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<template #edit>
|
||||
<basic-form ref="basicFormRef" @refresh="refresh"></basic-form>
|
||||
</template>
|
||||
|
||||
<template #view>
|
||||
<info ref="infoRef"></info>
|
||||
</template>
|
||||
|
||||
</guava>
|
||||
|
||||
</div>
|
||||
<script nonce="${cspNonce!}">
|
||||
<!--#include('basicForm.js'){}#-->
|
||||
<!--#include('info.js'){}#-->
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
mixins: [initTableMixins],
|
||||
components: {
|
||||
"basic-form": basicForm,
|
||||
"info": info,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tableColumns: [
|
||||
{prop: 'loginName', label: '工号'},
|
||||
{prop: 'userName', label: '姓名'},
|
||||
{prop: 'postTitle', label: '标题'},
|
||||
{prop: 'postingTime', label: '咨询时间'},
|
||||
{prop: 'isReply', label: '回复情况'}
|
||||
],
|
||||
pageForm: {
|
||||
year: new Date().getFullYear() + '',
|
||||
isReply: null,
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
refresh() {
|
||||
this.doSearch()
|
||||
this.$refs.guava.index()
|
||||
},
|
||||
onView(row) {
|
||||
this.$refs.guava.view(() => {
|
||||
const url = '/platform/legal/onlinePost/fetchOne'
|
||||
this.$refs.infoRef.onOpen(row, url)
|
||||
})
|
||||
},
|
||||
onAdd() {
|
||||
this.$refs.guava.edit(() => {
|
||||
this.$refs.basicFormRef.onOpen()
|
||||
})
|
||||
},
|
||||
onEdit(row) {
|
||||
this.$refs.guava.edit(() => {
|
||||
this.$refs.basicFormRef.onOpen(row)
|
||||
})
|
||||
},
|
||||
onDelete(row) {
|
||||
this.$confirm("您确定要删除吗？", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/legal/onlinePost/delete", { id: row.id }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$message.success(res.msg)
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
pageData() {
|
||||
this.$axios.post(loc() + "/pageData", this.pageForm).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.tableData = res.data.list
|
||||
this.pageForm.totalCount = res.data.totalCount
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
async created() {
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,73 @@
|
||||
const info = {
|
||||
template: /*language=HTML*/ `
|
||||
<div>
|
||||
<el-descriptions :column="2" border class="table_fixed">
|
||||
<el-descriptions-item label="咨询人">
|
||||
{{ viewData.userName }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="咨询时间">
|
||||
{{ viewData.postingTime }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="咨询主题" :span="2">
|
||||
{{ viewData.postTitle }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="主要内容" :span="2">
|
||||
{{ viewData.postContent }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="回复信息" :span="2">
|
||||
<el-timeline v-if="viewData.replyList && viewData.replyList.length > 0">
|
||||
<el-timeline-item
|
||||
v-for="(item, index) in viewData.replyList"
|
||||
:key="index"
|
||||
size="large"
|
||||
type="primary"
|
||||
:timestamp="item.replyTime">
|
||||
<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>
|
||||
<span>{{ item.userName }}</span>
|
||||
</div>
|
||||
<div>回复内容：{{ item.replyContent }}</div>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
<span v-else>暂无人回复</span>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
`,
|
||||
data() {
|
||||
return {
|
||||
viewData: {},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onOpen(row, url) {
|
||||
this.$axios.post(url, { id: row.id })
|
||||
.then((resp) => {
|
||||
this.viewData = resp.data
|
||||
})
|
||||
},
|
||||
},
|
||||
style: /*language=CSS*/ `
|
||||
/deep/ .el-timeline-item {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
/deep/ .el-timeline-item__wrapper {
|
||||
padding-left: 28px;
|
||||
top: -3px;
|
||||
}
|
||||
/deep/ .el-timeline-item__tail {
|
||||
left: 4px;
|
||||
}
|
||||
/deep/ .user-face{
|
||||
display: flex;
|
||||
}
|
||||
`
|
||||
}
|
||||
@@ -0,0 +1,69 @@
|
||||
const basicForm = {
|
||||
template: /*language=HTML*/ `
|
||||
<div>
|
||||
<el-form :model="formData" ref="formRef" :rules="formRules" label-width="110px" label-position="left">
|
||||
<div class="left-span-label">基本情况</div>
|
||||
<el-descriptions :column="2" border class="table_fixed">
|
||||
<el-descriptions-item label="咨询人">
|
||||
{{ viewData.posterUserName }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="咨询时间">
|
||||
{{ viewData.postingTime }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="咨询主题" :span="2">
|
||||
{{ viewData.postTitle }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="主要内容" :span="2">
|
||||
{{ viewData.postContent }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<div class="left-span-label">我来回复</div>
|
||||
<el-form-item label="回复内容" prop="replyContent">
|
||||
<el-input type="textarea" rows="3" v-model="formData.replyContent" placeholder="请输入回复内容"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row class="mt10" justify="end" type="flex">
|
||||
<el-button @click="$emit('refresh')">取消</el-button>
|
||||
<el-button @click="onSubmit" type="primary">提交</el-button>
|
||||
</el-row>
|
||||
</div>
|
||||
`,
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
formData: {},
|
||||
formRules: {
|
||||
replyContent: [{required: true, message: '请输入回复内容', trigger: ['change', 'blur']}],
|
||||
},
|
||||
viewData: {},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onOpen(row) {
|
||||
this.viewData = clone({ ...row })
|
||||
this.$set(this.formData, 'postId', row.id)
|
||||
},
|
||||
onSubmit() {
|
||||
this.$refs.formRef.validate((valid) => {
|
||||
if (valid) {
|
||||
this.$confirm("您确定要提交吗？", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(async () => {
|
||||
const resp = await this.$axios.post("/platform/legal/onlineReply/submit", this.formData)
|
||||
if (resp.code === 0) {
|
||||
this.$message.success(resp.msg)
|
||||
this.$emit('refresh')
|
||||
} else {
|
||||
this.$message.warning(resp.msg)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
style: /*language=CSS*/ `
|
||||
|
||||
`
|
||||
}
|
||||
@@ -0,0 +1,132 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<search @search="doSearch">
|
||||
<search-item label="年度">
|
||||
<el-date-picker
|
||||
placeholder="请选择年度"
|
||||
type="year"
|
||||
@change="doSearch"
|
||||
style="width: 100%"
|
||||
v-model="pageForm.year"
|
||||
value-format="yyyy"
|
||||
></el-date-picker>
|
||||
</search-item>
|
||||
<search-item label="是否回复">
|
||||
<el-select v-model="pageForm.isReply" style="width: 100%" @change="doSearch">
|
||||
<el-option :value="null" label="全部"></el-option>
|
||||
<el-option :value="true" label="已回复"></el-option>
|
||||
<el-option :value="false" label="未回复"></el-option>
|
||||
</el-select>
|
||||
</search-item>
|
||||
</search>
|
||||
</el-card>
|
||||
|
||||
<el-card shadow="never" class="mt20">
|
||||
<table-tool label="咨询列表"></table-tool>
|
||||
<el-table :data="tableData" @sort-change="pageOrder" :size="tableSize" row-key="id">
|
||||
<el-table-column label="序号" type="index" :index="indexMethod" width="60"></el-table-column>
|
||||
<el-table-column
|
||||
:label="column.label"
|
||||
:prop="column.prop"
|
||||
:key="column.prop"
|
||||
:width="column.width"
|
||||
:sortable="column.sortable"
|
||||
align="center"
|
||||
header-align="center"
|
||||
show-overflow-tooltip
|
||||
v-for="column in tableColumns"
|
||||
>
|
||||
<template v-slot="{ row }" v-if="column.prop === 'replyCount'">
|
||||
<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 label="操作" width="230">
|
||||
<template v-slot="{ row }">
|
||||
<el-button @click="onView(row)" size="mini" type="primary">查看</el-button>
|
||||
<el-button @click="onReply(row)" size="mini" type="primary">回复</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--#include("/layouts/pagination.html"){}#-->
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<template #edit>
|
||||
<basic-form ref="basicFormRef" @refresh="refresh"></basic-form>
|
||||
</template>
|
||||
|
||||
<template #view>
|
||||
<info ref="infoRef"></info>
|
||||
</template>
|
||||
|
||||
</guava>
|
||||
|
||||
</div>
|
||||
<script nonce="${cspNonce!}">
|
||||
<!--#include('basicForm.js'){}#-->
|
||||
<!--#include('../onlinePost/info.js'){}#-->
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
mixins: [initTableMixins],
|
||||
components: {
|
||||
"basic-form": basicForm,
|
||||
"info": info,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tableColumns: [
|
||||
{prop: 'posterUserName', label: '姓名'},
|
||||
{prop: 'postTitle', label: '标题'},
|
||||
{prop: 'postingTime', label: '咨询时间'},
|
||||
{prop: 'replyCount', label: '回复情况'}
|
||||
],
|
||||
pageForm: {
|
||||
year: new Date().getFullYear() + '',
|
||||
isReply: null,
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
refresh() {
|
||||
this.doSearch()
|
||||
this.$refs.guava.index()
|
||||
},
|
||||
onView(row) {
|
||||
this.$refs.guava.view(() => {
|
||||
const url = '/platform/legal/onlineReply/fetchOne'
|
||||
this.$refs.infoRef.onOpen(row, url)
|
||||
})
|
||||
},
|
||||
onReply(row) {
|
||||
this.$refs.guava.edit(() => {
|
||||
this.$refs.basicFormRef.onOpen(row)
|
||||
})
|
||||
},
|
||||
pageData() {
|
||||
this.$axios.post(loc() + "/pageData", this.pageForm).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.tableData = res.data.list
|
||||
this.pageForm.totalCount = res.data.totalCount
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
async created() {
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,256 @@
|
||||
<!--#
|
||||
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 {
|
||||
font-size: 14px;
|
||||
margin-bottom: 10px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.top-col-member-number {
|
||||
font-size: 30px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.top-col-chart {
|
||||
height: 80px;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.center-col {
|
||||
background-color: white;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.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>
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<search @search="doSearch">
|
||||
<search-item label="年度">
|
||||
<el-date-picker
|
||||
placeholder="请选择年度"
|
||||
type="year"
|
||||
@change="doSearch"
|
||||
style="width: 100%"
|
||||
v-model="pageForm.year"
|
||||
value-format="yyyy"
|
||||
></el-date-picker>
|
||||
</search-item>
|
||||
</search>
|
||||
</el-card>
|
||||
|
||||
<el-card shadow="never" class="mt20">
|
||||
<el-row type="flex" 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">
|
||||
{{numAreaMap?.total || 0}}
|
||||
<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">
|
||||
{{numAreaMap?.successNum || 0}}
|
||||
<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">
|
||||
{{numAreaMap?.doctorCount || 0}}
|
||||
<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">
|
||||
{{numAreaMap?.serviceTeacherCount || 0}}
|
||||
<span style="font-size: 14px"> 人</span>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
|
||||
<el-card shadow="never" class="mt20">
|
||||
<table-tool :label="tableLabel"></table-tool>
|
||||
<el-table :data="tableData" @sort-change="pageOrder" :size="tableSize">
|
||||
<el-table-column label="序号" type="index" width="60"></el-table-column>
|
||||
<el-table-column
|
||||
:label="column.label"
|
||||
:prop="column.prop"
|
||||
:key="column.prop"
|
||||
:width="column.width"
|
||||
:sortable="column.sortable"
|
||||
align="center"
|
||||
header-align="center"
|
||||
show-overflow-tooltip
|
||||
v-for="column in tableColumns"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="tableIndex === 1" label="操作" width="100">
|
||||
<template v-slot="{ row }">
|
||||
<el-button @click="onView(row)" size="mini" type="primary">查看</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
</guava>
|
||||
|
||||
<el-dialog :visible.sync="infoDialogVisible"
|
||||
width="60%" title="服务教师列表"
|
||||
:close-on-click-modal="false"
|
||||
append-to-body>
|
||||
<el-table :data="infoTableData">
|
||||
<el-table-column label="序号" type="index" width="60"></el-table-column>
|
||||
<el-table-column
|
||||
:label="column.label"
|
||||
:prop="column.prop"
|
||||
:key="column.prop"
|
||||
:width="column.width"
|
||||
:sortable="column.sortable"
|
||||
align="center"
|
||||
header-align="center"
|
||||
show-overflow-tooltip
|
||||
v-for="column in infoTableColumns"
|
||||
>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="infoDialogVisible = false" type="primary">确定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
<script nonce="${cspNonce!}">
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
mixins: [initTableMixins],
|
||||
data() {
|
||||
return {
|
||||
infoDialogVisible: false,
|
||||
tableLabel: '按咨询师统计',
|
||||
tableColumns: [],
|
||||
infoTableColumns: [],
|
||||
doctorTableColumns: [
|
||||
{prop: 'doctorUserName', label: '咨询师'},
|
||||
{prop: 'sex', label: '性别'},
|
||||
{prop: 'jobTitle', label: '职称'},
|
||||
{prop: 'serviceNum', label: '服务次数'},
|
||||
],
|
||||
teacherTableColumns: [
|
||||
{prop: 'userName', label: '教师'},
|
||||
{prop: 'unitName', label: '所属单位'},
|
||||
{prop: 'unionName', label: '所属工会'},
|
||||
{prop: 'startTime', label: '开始时间'},
|
||||
{prop: 'endTime', label: '结束时间'},
|
||||
{prop: 'doctorUserName', label: '咨询师'},
|
||||
],
|
||||
numAreaMap: {},
|
||||
tableIndex: 1,
|
||||
infoTableData: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
doSearch() {
|
||||
this.queryCount()
|
||||
this.tableChange()
|
||||
},
|
||||
onView(row) {
|
||||
this.infoTableColumns = this.teacherTableColumns
|
||||
this.$axios.post(loc() + "/pageData", {
|
||||
year: this.pageForm.year,
|
||||
tableIndex: 2,
|
||||
doctorUser: row.userId
|
||||
}).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.infoTableData = res.data
|
||||
this.infoDialogVisible = true
|
||||
}
|
||||
})
|
||||
},
|
||||
tableChange() {
|
||||
this.pageForm.tableIndex = this.tableIndex
|
||||
this.$axios.post(loc() + "/pageData", this.pageForm).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.tableData = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
queryCount() {
|
||||
this.$axios.post(loc() + "/queryCount", this.pageForm).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.numAreaMap = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
async created() {
|
||||
this.tableColumns = this.doctorTableColumns
|
||||
this.queryCount()
|
||||
this.tableChange()
|
||||
},
|
||||
watch: {
|
||||
tableIndex(val) {
|
||||
this.tableColumns = val === 1 ? this.doctorTableColumns : this.teacherTableColumns
|
||||
}
|
||||
},
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,62 @@
|
||||
const basicForm = {
|
||||
template: /*language=HTML*/ `
|
||||
<div>
|
||||
<el-form :model="formData" ref="formRef" :rules="formRules" label-width="110px" label-position="left">
|
||||
<el-form-item prop="title" label="标题">
|
||||
<el-input type="text" v-model="formData.title" maxlength="50"
|
||||
placeholder="请填写标题"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="url" label="链接">
|
||||
<el-input type="text" v-model="formData.url" maxlength="50"
|
||||
placeholder="请填写链接"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="bz" label="备注">
|
||||
<el-input type="textarea" v-model="formData.bz"
|
||||
placeholder="请填写备注"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row class="mt10" justify="end" type="flex">
|
||||
<el-button @click="$emit('refresh')">取消</el-button>
|
||||
<el-button @click="onSubmit" type="primary">提交</el-button>
|
||||
</el-row>
|
||||
</div>
|
||||
`,
|
||||
data() {
|
||||
return {
|
||||
formData: {},
|
||||
formRules: {
|
||||
title: [{required: true, message: '必填', trigger: ['change', 'blur']}],
|
||||
url: [{required: true, message: '必填', trigger: ['change', 'blur']}],
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onOpen(row) {
|
||||
if (row && row.id) {
|
||||
this.formData = clone(row)
|
||||
}
|
||||
},
|
||||
onSubmit() {
|
||||
this.$refs.formRef.validate((valid) => {
|
||||
if (valid) {
|
||||
this.$confirm("您确定要提交吗？", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(async () => {
|
||||
const resp = await this.$axios.post("/platform/legal/study/onSubmit", this.formData)
|
||||
if (resp.code === 0) {
|
||||
this.$message.success(resp.msg)
|
||||
this.$emit('refresh')
|
||||
} else {
|
||||
this.$message.warning(resp.msg)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
style: /*language=CSS*/ `
|
||||
|
||||
`
|
||||
}
|
||||
@@ -0,0 +1,135 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<search @search="doSearch">
|
||||
<search-item label="标题/链接：">
|
||||
<el-input placeholder="请输入标题或链接" v-model="pageForm.searchKeyword" clearable @keyup.enter.native="doSearch"></el-input>
|
||||
</search-item>
|
||||
</search>
|
||||
</el-card>
|
||||
|
||||
<el-card shadow="never" class="mt20">
|
||||
<table-tool label="资料列表">
|
||||
<el-button v-if="$auth.hasRole('SYSADMIN') || $auth.hasRole('SCHOOL_UNION_ADMIN')"
|
||||
type="primary" size="small" @click="onAdd">
|
||||
<i class="ti-plus"></i>
|
||||
新增资料
|
||||
</el-button>
|
||||
</table-tool>
|
||||
<el-table :data="tableData" @sort-change="pageOrder" :size="tableSize" row-key="id">
|
||||
<el-table-column label="序号" type="index" :index="indexMethod" width="60"></el-table-column>
|
||||
<el-table-column
|
||||
:label="column.label"
|
||||
:prop="column.prop"
|
||||
:key="column.prop"
|
||||
:width="column.width"
|
||||
:sortable="column.sortable"
|
||||
align="center"
|
||||
header-align="center"
|
||||
show-overflow-tooltip
|
||||
v-for="column in tableColumns"
|
||||
>
|
||||
<template v-slot="{ row }" v-if="column.prop === 'url'">
|
||||
<el-link type="primary" @click="onView(row)">{{ row.url }}</el-link>
|
||||
</template>
|
||||
<template v-slot="{ row }" v-else-if="column.prop === 'createdAt'">
|
||||
{{ $moment(row.createdAt).format('YYYY-MM-DD') }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="230">
|
||||
<template v-slot="{ row }">
|
||||
<el-button @click="onView(row)" size="mini" type="primary">查看</el-button>
|
||||
<el-button @click="onEdit(row)" size="mini" type="primary">编辑</el-button>
|
||||
<el-button @click="onDelete(row)" size="mini" type="danger">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--#include("/layouts/pagination.html"){}#-->
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<template #edit>
|
||||
<basic-form ref="basicFormRef" @refresh="refresh"></basic-form>
|
||||
</template>
|
||||
|
||||
</guava>
|
||||
|
||||
</div>
|
||||
<script nonce="${cspNonce!}">
|
||||
<!--#include('basicForm.js'){}#-->
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
mixins: [initTableMixins],
|
||||
components: {
|
||||
"basic-form": basicForm,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tableColumns: [
|
||||
{prop: 'title', label: '标题'},
|
||||
{prop: 'url', label: '链接'},
|
||||
{prop: 'username', label: '创建人'},
|
||||
{prop: 'createdAt', label: '创建时间'},
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
refresh() {
|
||||
this.doSearch()
|
||||
this.$refs.guava.index()
|
||||
},
|
||||
onView(row) {
|
||||
window.open(row.url)
|
||||
},
|
||||
onAdd() {
|
||||
this.$refs.guava.edit(() => {
|
||||
this.$refs.basicFormRef.onOpen()
|
||||
})
|
||||
},
|
||||
onEdit(row) {
|
||||
this.$refs.guava.edit(() => {
|
||||
this.$refs.basicFormRef.onOpen(row)
|
||||
})
|
||||
},
|
||||
onDelete(row) {
|
||||
this.$confirm("您确定要删除吗, 是否继续?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/legal/study/onDelete", { id: row.id }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$message.success(res.msg)
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
pageData() {
|
||||
this.$axios.post(loc() + "/pageData", this.pageForm).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.tableData = res.data.list
|
||||
this.pageForm.totalCount = res.data.totalCount
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
async created() {
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
Reference in New Issue
Block a user