|
|
|
@ -1,6 +1,6 @@ |
|
|
|
<template> |
|
|
|
<div class="site-setting-wrap min-flex-right"> |
|
|
|
<div class="pagePadding"> |
|
|
|
<div class="site-setting-wrap min-flex-right"> |
|
|
|
<div class="pagePadding main-wrap"> |
|
|
|
<p class="pageTitle bold">新增套餐</p> |
|
|
|
<div class="siteMessage flex-common" id="siteMessage2"> |
|
|
|
<p class="littleTitle mb32">套餐信息</p> |
|
|
|
@ -30,13 +30,13 @@ |
|
|
|
<el-checkbox @change="handleSelectAllChange1" v-model="selectAll" |
|
|
|
:indeterminate="isIndeterminate">全选</el-checkbox> |
|
|
|
</div> |
|
|
|
<span class="totalCount">共{{ treatMentList.length }}条，已选{{ selectedCount }}条</span> |
|
|
|
<span class="totalCount">共{{ projectList.length }}条，已选{{ selectedCount }}条</span> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="flex-between mb32 mt32"> |
|
|
|
<div class="tabProject flex"> |
|
|
|
<div :class="['tab-item ', projectSearchId == item.id ? 'active' : '']" |
|
|
|
v-for="item in projectTagData" :key="item.name">{{ item.name }}</div> |
|
|
|
v-for="item in Object.values(projectTagData)" :key="item.name">{{ item.name }}</div> |
|
|
|
</div> |
|
|
|
<div class="right flex"> |
|
|
|
<GuipFormItem label="搜索项目"> |
|
|
|
@ -47,22 +47,35 @@ |
|
|
|
</GuipFormItem> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<GuipTable :tableData="treatMentList" style="width: 100%" ref="multipleTable" |
|
|
|
<GuipTable :tableData="sortedProjectList" style="width: 100%" ref="multipleTable" |
|
|
|
@selection-change="handleSelectionChange" :loading="loading"> |
|
|
|
<el-table-column type="selection" label="选择" width="150"></el-table-column> |
|
|
|
<el-table-column prop="name" label="项目名称" min-width="150"></el-table-column> |
|
|
|
<el-table-column label="次数" min-width="150px"> |
|
|
|
<el-table-column label="次数" min-width="150px" prop="num"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<GuipInput width="120px" v-model="scope.row.nums" @change="changeNums(scope.row)" /> |
|
|
|
<GuipInput width="90%" v-if="package_id && scope.row.num" v-model="scope.row.num" |
|
|
|
@change="changeNums(scope.row)" /> |
|
|
|
<GuipInput width="90%" v-else v-model="scope.row.unit_num" |
|
|
|
@change="changeNums(scope.row)" /> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="price" label="项目价格" min-width="150"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<GuipInput width="90%" v-model="scope.row.price" @change="changePrice(scope.row)" /> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="classify_id" label="分类" min-width="150"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<GuipSelect width="90%" v-model="scope.row.classify_id" |
|
|
|
@change="changeClassify(scope.row)" prop="classify_id" :options="projectTagData" |
|
|
|
valueKey="id" labelKey="name" /> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="price" label="项目价格" min-width="150"></el-table-column> |
|
|
|
<el-table-column prop="group" label="分类" min-width="150"></el-table-column> |
|
|
|
</GuipTable> |
|
|
|
<el-pagination background @size-change='handleSizeChange' @current-change='handleCurrentChange' |
|
|
|
<!-- <el-pagination background @size-change='handleSizeChange' @current-change='handleCurrentChange' |
|
|
|
:current-page="currentPage" :page-size=pageSize layout="prev, pager, next,jumper" |
|
|
|
:total="treatMentList.length"> |
|
|
|
</el-pagination> |
|
|
|
</el-pagination> --> |
|
|
|
</el-form> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -73,8 +86,8 @@ |
|
|
|
</GuipButton> |
|
|
|
</div> |
|
|
|
<GuipDialog :dialogVisible="dialogVisible" :title="'新增套餐确认'" :show-close-button="true" width="599px" |
|
|
|
:show-cancel-button="true" @confirm="handleConfirm" @cancel="handleCancel" |
|
|
|
@close="handleClose" confirmText="确定新增"> |
|
|
|
:show-cancel-button="true" @confirm="handleConfirm" @cancel="handleCancel" @close="handleClose" |
|
|
|
confirmText="确定新增"> |
|
|
|
<div class="flex content"> |
|
|
|
<span>套餐名称：</span> |
|
|
|
<span>{{ siteForm.name }}套餐</span> |
|
|
|
@ -100,6 +113,7 @@ import GuipTable from '@/components/GuipTable.vue'; |
|
|
|
import GuipDialog from '@/components/GuipDialog.vue'; |
|
|
|
import GuipInput from '@/components/GuipInput.vue'; |
|
|
|
import GuipButton from '@/components/GuipButton.vue'; |
|
|
|
import GuipSelect from '@/components/GuipSelect.vue'; |
|
|
|
export default { |
|
|
|
// 站点设置 |
|
|
|
name: '', |
|
|
|
@ -109,12 +123,13 @@ export default { |
|
|
|
GuipInput, |
|
|
|
GuipDialog, |
|
|
|
GuipButton, |
|
|
|
GuipSelect, |
|
|
|
GuipTable |
|
|
|
|
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
dialogVisible: true, |
|
|
|
dialogVisible: false, |
|
|
|
selectAll: false, |
|
|
|
selectedCount: 0, |
|
|
|
currentPage: 1, |
|
|
|
@ -123,96 +138,152 @@ export default { |
|
|
|
projectSearchName: '', |
|
|
|
projectSearchId: '0', |
|
|
|
loading: false, |
|
|
|
treatMentList: [ |
|
|
|
{ |
|
|
|
name: '针灸1', |
|
|
|
nums: 1, |
|
|
|
checked: true, |
|
|
|
group: '针灸1', |
|
|
|
price: 9939, |
|
|
|
id: '11' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '针灸2', |
|
|
|
nums: 1, |
|
|
|
checked: false, |
|
|
|
group: '针灸1', |
|
|
|
price: 199, |
|
|
|
id: '12' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '针灸1', |
|
|
|
nums: 1, |
|
|
|
checked: true, |
|
|
|
group: '针灸1', |
|
|
|
price: 9939, |
|
|
|
id: '111' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '针灸2', |
|
|
|
nums: 1, |
|
|
|
checked: false, |
|
|
|
group: '针灸1', |
|
|
|
price: 199, |
|
|
|
id: '122' |
|
|
|
}, |
|
|
|
], |
|
|
|
treatMentList: [],//疗程套餐项目 |
|
|
|
projectList: [],//项目列表 |
|
|
|
// { |
|
|
|
// 27:{ |
|
|
|
// classify_name:"针类", |
|
|
|
// create_time:"2025-05-29 17:09:43", |
|
|
|
// id:"1", |
|
|
|
// name:"针刺", |
|
|
|
// num:"2", |
|
|
|
// pid:"1", |
|
|
|
// price:"200.00", |
|
|
|
// project_id:"27", |
|
|
|
// sort:"1", |
|
|
|
// status:"1", |
|
|
|
// } |
|
|
|
// }, |
|
|
|
selectedRows: [], |
|
|
|
siteForm: { |
|
|
|
name: '青春永驻套餐', |
|
|
|
price: '99999' |
|
|
|
create_time: "2025-05-29 17:08:29", |
|
|
|
depart_id: "1", |
|
|
|
doctor_id: "1", |
|
|
|
id: "1", |
|
|
|
name: "调理套餐", |
|
|
|
price: "1500.00", |
|
|
|
status: "1" |
|
|
|
}, |
|
|
|
siteFormrules: { |
|
|
|
name: [ |
|
|
|
{ required: true, message: '请输入站点简称', trigger: 'blur' } |
|
|
|
{ required: true, message: '请输入套餐名称', trigger: 'blur' } |
|
|
|
], |
|
|
|
price: [ |
|
|
|
{ required: true, message: '请输入站点简称', trigger: 'blur' } |
|
|
|
{ required: true, message: '请输入套餐价格', trigger: 'blur' } |
|
|
|
], |
|
|
|
}, |
|
|
|
projectTagData: [ |
|
|
|
{ |
|
|
|
name: '针灸1', |
|
|
|
id: '1' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '针灸2', |
|
|
|
id: '11' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '针灸3', |
|
|
|
id: '12' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '针灸4', |
|
|
|
id: '13' |
|
|
|
}, |
|
|
|
], |
|
|
|
projectTagData: [], |
|
|
|
package_id: '', |
|
|
|
doctor_id: '', |
|
|
|
depart_id: '', |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
computed: { |
|
|
|
...mapState(['pageTitle']) // 从Vuex映射showSidebar状态到组件的计算属性中 |
|
|
|
...mapState(['pageTitle']), |
|
|
|
sortedProjectList() { |
|
|
|
return [...this.projectList].sort((a, b) => { |
|
|
|
// 有sort属性的排在前面 |
|
|
|
if (a.sort && !b.sort) return -1; |
|
|
|
if (!a.sort && b.sort) return 1; |
|
|
|
// 如果都有sort属性，按sort值排序 |
|
|
|
if (a.sort && b.sort) return a.sort - b.sort; |
|
|
|
// 都没有sort属性，保持原顺序 |
|
|
|
return 0; |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
const { package_id, doctor_id, depart_id } = this.$route.query; // 获取 doctorId 参数 |
|
|
|
this.package_id = package_id; |
|
|
|
this.depart_id = depart_id; |
|
|
|
this.doctor_id = doctor_id; |
|
|
|
store.commit('SET_PAGETITLE', '基本设置'); |
|
|
|
// 编辑的时候默认选中 |
|
|
|
this.$nextTick(() => { |
|
|
|
if (this.treatMentList.length >= 2) { |
|
|
|
const defaultSelected = this.treatMentList.filter(item => item.checked === true); |
|
|
|
defaultSelected.forEach(row => { |
|
|
|
this.$refs.multipleTable.$refs.guiptable.toggleRowSelection(row, true); |
|
|
|
}); |
|
|
|
this.selectedRows = defaultSelected; |
|
|
|
this.updateSelectionState(); |
|
|
|
} |
|
|
|
}); |
|
|
|
// 编辑 |
|
|
|
if (package_id) { |
|
|
|
this.getInitData() |
|
|
|
return |
|
|
|
} |
|
|
|
this.fetchProjectData(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
inputBlur(val){ |
|
|
|
|
|
|
|
// |
|
|
|
getInitData() { |
|
|
|
this.$http('POST', '/api/admin/get_project_package_info', { |
|
|
|
depart_id: this.depart_id, |
|
|
|
doctor_id: this.doctor_id, |
|
|
|
package_id: this.package_id |
|
|
|
}).then(response => { |
|
|
|
if (response.code == 0) { |
|
|
|
this.siteForm = { ...response.data } |
|
|
|
if (response.data?.project_list) { |
|
|
|
this.treatMentList = Object.values(response.data.project_list) |
|
|
|
this.fetchProjectData() |
|
|
|
} |
|
|
|
} |
|
|
|
}).catch(error => { |
|
|
|
console.error(error, 'error') |
|
|
|
}) |
|
|
|
}, |
|
|
|
fetchProjectData() { |
|
|
|
this.$http('POST', '/api/admin/get_project_list', { |
|
|
|
depart_id: this.depart_id, |
|
|
|
doctor_id: this.doctor_id |
|
|
|
}).then(response => { |
|
|
|
if (response.code == 0) { |
|
|
|
this.projectTagData = response.data.classify;//项目分类 |
|
|
|
this.projectList = Object.values(response.data.list).map(item => { |
|
|
|
return { |
|
|
|
...item, |
|
|
|
checked: false |
|
|
|
} |
|
|
|
});//项目列表 |
|
|
|
|
|
|
|
if (this.package_id) {//编辑状态 |
|
|
|
this.treatMentList.forEach(item => { |
|
|
|
this.projectList.forEach(item1 => { |
|
|
|
if (item.project_id == item1.id) { |
|
|
|
item1.checked = true; |
|
|
|
item1.num = item.num; |
|
|
|
item1.sort = item.sort; |
|
|
|
// 编辑的时候初始默认选中 |
|
|
|
this.$nextTick(() => { |
|
|
|
this.$refs.multipleTable.$refs.guiptable.toggleRowSelection(item1, true); |
|
|
|
this.selectedRows.push(item1) |
|
|
|
this.updateSelectionState(); |
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
}) |
|
|
|
}) |
|
|
|
// this.$nextTick(() => { |
|
|
|
// if (this.projectList.length >= 2) { |
|
|
|
// const defaultSelected = this.projectList.filter(item => item.checked === true); |
|
|
|
// defaultSelected.forEach(row => { |
|
|
|
// this.$refs.multipleTable.$refs.guiptable.toggleRowSelection(row, true); |
|
|
|
// }); |
|
|
|
// this.selectedRows = defaultSelected; |
|
|
|
// this.updateSelectionState(); |
|
|
|
// } |
|
|
|
// }); |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
}).catch(error => { |
|
|
|
console.error(error, 'error') |
|
|
|
}) |
|
|
|
}, |
|
|
|
changeChecked() { |
|
|
|
|
|
|
|
}, |
|
|
|
inputBlur(val) { |
|
|
|
// 搜索项目 |
|
|
|
this.$http('POST', '/supernew/ajax_get_type_batch_list', { |
|
|
|
projectSearchId:this.projectSearchId, |
|
|
|
search:this.projectSearchName |
|
|
|
projectSearchId: this.projectSearchId, |
|
|
|
search: this.projectSearchName |
|
|
|
}).then(response => { |
|
|
|
if (response.code == 0) { |
|
|
|
this.dialogVisible = false; |
|
|
|
@ -221,10 +292,10 @@ export default { |
|
|
|
}).catch(error => { |
|
|
|
console.error(error, 'error') |
|
|
|
}) |
|
|
|
console.log(val,'----搜索'); |
|
|
|
console.log(val, '----搜索'); |
|
|
|
}, |
|
|
|
updateSelectionState() { |
|
|
|
const allSelected = this.selectedRows.length === this.treatMentList.length; |
|
|
|
const allSelected = this.selectedRows.length === this.projectList.length; |
|
|
|
const noneSelected = this.selectedRows.length === 0; |
|
|
|
this.selectAll = allSelected; |
|
|
|
this.isIndeterminate = !noneSelected && !allSelected; |
|
|
|
@ -239,7 +310,7 @@ export default { |
|
|
|
handleSelectAllChange1(val) { |
|
|
|
if (val) { |
|
|
|
// 只选中未选中的行 |
|
|
|
const unselectedRows = this.treatMentList.filter( |
|
|
|
const unselectedRows = this.projectList.filter( |
|
|
|
row => !this.selectedRows1.includes(row) |
|
|
|
); |
|
|
|
unselectedRows.forEach(row => { |
|
|
|
@ -252,8 +323,60 @@ export default { |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
// 只有在原本套餐内的直接修改有效/ 否则无效； |
|
|
|
// 选中项目，进行保存套餐的时候，修改的项目信息才会有效； |
|
|
|
// 修改某一项就将此项默认成为选中 |
|
|
|
// 修改次数 |
|
|
|
changeNums(row) { |
|
|
|
console.log(row.nums, '====row.nums'); |
|
|
|
if (row.sort) { |
|
|
|
this.editorProjectInfo({ num: row.num, project_id: row.id }) |
|
|
|
} else { |
|
|
|
this.changeSelectStatus(row) |
|
|
|
} |
|
|
|
}, |
|
|
|
// 修改分类 |
|
|
|
changeClassify(row) { |
|
|
|
if (row.sort) { |
|
|
|
this.editorProjectInfo({ classify_id: row.classify_id, project_id: row.id }) |
|
|
|
} else { |
|
|
|
this.changeSelectStatus(row) |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
// 修改价格 |
|
|
|
changePrice(row) { |
|
|
|
if (row.sort) { |
|
|
|
this.editorProjectInfo({ price: row.price, project_id: row.id }) |
|
|
|
} else { |
|
|
|
this.changeSelectStatus(row) |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
changeSelectStatus(row) { |
|
|
|
this.$refs.multipleTable.$refs.guiptable.toggleRowSelection(row, true); |
|
|
|
row.checked = true |
|
|
|
// 确保行被添加到 selectedRows 中 |
|
|
|
if (!this.selectedRows.includes(row)) { |
|
|
|
this.selectedRows.push(row); |
|
|
|
} |
|
|
|
// 更新选择状态 |
|
|
|
this.updateSelectionState(); |
|
|
|
}, |
|
|
|
// 修改项目信息 |
|
|
|
editorProjectInfo(props) { |
|
|
|
// |
|
|
|
this.$http('POST', '/api/admin/edit_project', { |
|
|
|
...props, |
|
|
|
depart_id: this.depart_id, |
|
|
|
doctor_id: this.doctor_id, |
|
|
|
}).then(response => { |
|
|
|
if (response.code == 0) { |
|
|
|
this.$Message.success('修改成功') |
|
|
|
this.getInitData() |
|
|
|
} |
|
|
|
}).catch(error => { |
|
|
|
console.error(error, 'error') |
|
|
|
}) |
|
|
|
}, |
|
|
|
handleClose() { |
|
|
|
this.handleCancel() |
|
|
|
@ -282,7 +405,7 @@ export default { |
|
|
|
console.log(this.$refs.multipleTable, 'multipleTable-'); |
|
|
|
if (val) { |
|
|
|
// 只选中未选中的行 |
|
|
|
const unselectedRows = this.treatMentList.filter( |
|
|
|
const unselectedRows = this.projectList.filter( |
|
|
|
row => !this.selectedRows.includes(row) |
|
|
|
); |
|
|
|
unselectedRows.forEach(row => { |
|
|
|
@ -372,7 +495,10 @@ export default { |
|
|
|
}); |
|
|
|
}, |
|
|
|
cancelClick() { |
|
|
|
this.$router.push('/hosInformation') |
|
|
|
this.$router.push({ |
|
|
|
name: '医院信息', |
|
|
|
query: { doctor_id: this.doctor_id,depart_id:this.depart_id } |
|
|
|
}) |
|
|
|
}, |
|
|
|
confirmClick() { |
|
|
|
this.dialogVisible = true; |
|
|
|
@ -381,13 +507,14 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
<style lang="scss"> |
|
|
|
<style lang="scss" scoped> |
|
|
|
.siteMessage { |
|
|
|
border-radius: 4px; |
|
|
|
transition: all .5s; |
|
|
|
border: 1px solid transparent; |
|
|
|
} |
|
|
|
.content{ |
|
|
|
|
|
|
|
.content { |
|
|
|
margin-top: 16px; |
|
|
|
color: #626573; |
|
|
|
letter-spacing: 0.08em; |
|
|
|
@ -476,6 +603,13 @@ export default { |
|
|
|
|
|
|
|
.site-setting-wrap { |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
|
|
|
|
.main-wrap { |
|
|
|
flex: 1; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
#siteMessage2 { |
|
|
|
|
zq
3 weeks ago