DBSD_ZJPT/jeecgboot-vue3/src/views/bl/xxhbjwxtjxrw/XzkckhclList copy.vue

686 lines
23 KiB
Vue
Raw Normal View History

2025-03-06 10:05:03 +08:00
<template>
<div class="p-2">
<div v-if="sfxk == 0">
<div style="text-align: center">
<img src="../../../assets/images/Course-selection.png" style="margin-top:130px; width:600px" />
<div style="color:#606266; font-weight: 700; font-size: 20px; margin-top:20px">您还没有选课请先选择课程</div>
<a-button type="primary" style="margin-left: 10px; margin-top: 10px" @click="handleXuanke">选课</a-button>
</div>
</div>
<!-- 选课信息 -->
<div v-if="sfxk == 1">
<!-- <div class="jeecg-basic-table-form-container" >
<a-form class="query-criteria">
<a-button type="primary" style="margin-left: 10px;margin-bottom: 15px; " @click="handleFanhui">查看材料</a-button>
</a-form>
</div> -->
<BasicTable @register="registerTable" :rowSelection="rowSelection" >
<!--插槽:table标题-->
<template #tableTitle>
<span class="seleciton-line">1</span> <span class="selection-title">已选课程</span>
-{{selectedRowKeys}}-
<a-dropdown v-if="selectedRowKeys.length > 0">
<template #overlay>
<a-menu>
<a-menu-item key="1" @click="batchHandleDelete">
<Icon icon="ant-design:delete-outlined"></Icon>
删除
</a-menu-item>
</a-menu>
</template>
<a-button >批量操作
<Icon icon="mdi:chevron-down"></Icon>
</a-button>
</a-dropdown>
</template>
<!--操作栏-->
<template #action="{ record }">
<TableAction :actions="getTableAction(record)"/>
</template>
<template v-slot:bodyCell="{ column, record, index, text }">
</template>
</BasicTable>
<!-- <a-table :columns="columns2" :data-source="checkData"
v-model:current="paginationYxkcProp.current"
key="id"
:total="paginationYxkcProp.total"
:pagination="paginationYxkcProp"
:row-selection="rowSelection"
@change="onPageYxkcChange"
@onSelect="handleTable2SelectRowChange"
>
<template #title><span class="seleciton-line">1</span> <span class="selection-title">已选课程</span></template>
<template #bodyCell="{ column, record }">
<template v-if="column.dataIndex === 'action'">
<a @click="handleView(record)">查看</a>
</template>
</template>
</a-table> -->
<div class="jeecg-basic-table-form-container" style="margin-top:10px;">
<a-form ref="formRef" @keyup.enter.native="searchQuery2" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol" class="query-criteria">
<a-row :gutter="24">
<a-col :lg="6">
<a-form-item name="zjxnxq">
<template #label><span title="学年学期" class="xn-title">学年学期</span></template>
<j-dict-select-tag placeholder="请选择学年学期" v-model:value="queryParam2.zjxnxq" :dictCode="`v_xqxn,xqxn,xqxn,true order by sort asc`" allow-clear />
</a-form-item>
</a-col>
<a-col :lg="6">
<a-form-item name="kkyxmc">
<template #label><span title="开课单位名称" class="xn-title">开课单位名称</span></template>
<j-dict-select-tag
placeholder="请选择开课单位名称"
v-model:value="queryParam2.kkyxmc"
:dictCode="`v_kkdw,kkyxmc,kkyxmc`"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :lg="6">
<a-form-item name="zhunaye">
<template #label><span title="所属专业" class="xn-title">所属专业</span></template>
<j-dict-select-tag
placeholder="请选择所属专业"
v-model:value="queryParam2.zhuanye"
:dictCode="`v_zhuanye,dept_name,dept_name`"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :lg="6">
<a-form-item name="kcmc">
<template #label><span title="任课教师" class="xn-title">任课教师</span></template>
<j-input placeholder="请输入任课教师" v-model:value="queryParam2.teaxm" allow-clear></j-input>
</a-form-item>
</a-col>
<a-col :lg="6">
<a-form-item name="zhicheng">
<template #label><span title="职称" class="xn-title">职称</span></template>
<j-dict-select-tag
placeholder="请选择职称"
v-model:value="queryParam2.zhicheng"
:dictCode="`v_zhicheng,zhicheng,zhicheng`"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :lg="6">
<a-form-item name="kcmc">
<template #label><span title="课程名称" class="xn-title">课程名称</span></template>
<j-input placeholder="请输入课程名称" v-model:value="queryParam2.kcmc" allow-clear></j-input>
</a-form-item>
</a-col>
<a-col :span="12" style="text-align: right">
<a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery2">查询</a-button>
</a-col>
</a-row>
</a-form>
</div>
<a-table
:columns="columns2"
:data-source="dataList"
v-model:current="paginationProp.current"
:total="paginationProp.total"
:pagination="paginationProp"
@change="onPageChange"
>
<template #title><span class="seleciton-line">1</span> <span class="selection-title">可选课程</span></template>
<template #bodyCell="{ column, record }">
<template v-if="column.dataIndex === 'action'">
<a @click="handleXUanze(record)" v-if="record.sfxk == '0'">选择</a>
<a disabled v-if="record.sfxk == '1'">已选择</a>
</template>
</template>
</a-table>
<!-- <div style="text-align: right">
<a-button type="primary" style="margin-left: 10px; margin-top: 10px" @click="handleSubmit">确认</a-button>
<a-button type="primary" style="margin-left: 10px; margin-top: 10px" @click="handleFanhui">返回</a-button>
</div> -->
</div>
<!-- 成绩单 -->
<!-- <div v-show="sfxk == 2">
<CjdForm ref="cjdFormModal" @callback="init"></CjdForm>
</div> -->
<!-- 考核评价材料 -->
<!-- <div v-show="sfxk == 3">
<XxhbjwxtscwjxxList ref="khpjclFormModal" @callback="init"></XxhbjwxtscwjxxList>
</div> -->
<!-- 学生原始材料 -->
<!-- <div v-show="sfxk == 4">
<XxhbjwxtxsmdList3 ref="xsysclFormModal" @callback="init" @handleXq="handleXsysclxq"></XxhbjwxtxsmdList3>
</div> -->
<!-- 学生原始材料-详情 -->
<!-- <div v-show="sfxk == 5">
<XxhbjwxtxsmdList4 ref="xsysclXqFormModal" @callback="handleXsyscl"></XxhbjwxtxsmdList4>
</div> -->
<!-- 学生列表查看 -->
<div v-show="sfxk == 6">
<div class="jeecg-basic-table-form-container">
<a-form ref="formRef" class="query-criteria">
<a-row :gutter="24">
<a-col :span="24" style="margin-bottom: 10px;">
<!-- <div >
<a-breadcrumb>
<a-breadcrumb-item><a class="mbxtitle" @click="handleFanhui">课程考核材料</a></a-breadcrumb-item>
<a-breadcrumb-item><a class="mbxtitle" @click="handleFanhui">已选课程</a></a-breadcrumb-item>
<a-breadcrumb-item><a class="mbxtitle" @click="handleFanhui" v-if="jxrwInfo.value">{{jxrwInfo?.value?.kcmc}}</a></a-breadcrumb-item>
<a-breadcrumb-item><a class="mbxtitle" @click="handleFanhui">学生原始材料</a></a-breadcrumb-item>
<a-breadcrumb-item><span class="mbxtitle">详情</span></a-breadcrumb-item>
</a-breadcrumb>
</div> -->
<a-button type="primary" @click="handleFanhui">返回</a-button>
</a-col>
</a-row>
</a-form>
</div>
<div class="jeecg-basic-table-form-container">
<a-form ref="formRef" @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol" class="query-criteria">
<a-row :gutter="24" v-if="jxrwInfo?.value">
<a-col :span="12"><span class="seleciton-line">1</span> <span class="selection-title">课程考核材料详情 </span> </a-col>
<a-col :gutter="24">
<div style="text-align: center; font-size:24px; font-weight: 700; line-height: 50px" v-if="jxrwInfo?.value">
2025-03-21 16:17:06 +08:00
{{ jxrwInfo?.value.xnxqmc}}{{ jxrwInfo?.value.kcmc }}
2025-03-06 10:05:03 +08:00
</div>
<div v-if="jxrwInfo.value">
<div style="padding-left:16px;font-size:16px; font-weight: 700">概要信息</div>
<a-row style="line-height: 30px">
<a-col :xl="8" :sm="12" :md="8">
<span class="header-title" style="margin-left: 15px">开课单位</span> <span class="header-title">{{ jxrwInfo?.value.kkyxmc }}</span>
</a-col>
<a-col :xl="8" :sm="12" :md="8">
<span class="header-title" style="margin-left: 15px">课程类别</span> <span class="header-title">{{ jxrwInfo?.value.kclb }}</span>
</a-col>
<a-col :xl="8" :sm="12" :md="8">
<span class="header-title" style="margin-left: 15px">课程名称</span> <span class="header-title">{{ jxrwInfo?.value.kcmc }}</span>
</a-col>
<a-col :xl="8" :sm="12" :md="8">
<span class="header-title" style="margin-left: 15px">课程负责人</span> <span class="header-title">{{ jxrwInfo?.value.teaxm }}</span>
</a-col>
<a-col :xl="8" :sm="12" :md="8">
<span class="header-title" style="margin-left: 15px">选课人数</span> <span class="header-title">{{ jxrwInfo?.value.jxbrs }}</span>
</a-col>
</a-row>
</div>
</a-col>
</a-row>
</a-form>
</div>
<a-tabs v-model:activeKey="activeKey" type="card" @change="onChangeTab" style="background-color: white;">
<a-tab-pane key="1" tab="学生成绩">
<XscjList ref="cjdFormModal" @callback="init"></XscjList>
</a-tab-pane>
<a-tab-pane key="2" tab="考核评价材料" :forceRender="true">
<KhpjclList ref="khpjclFormModal" @callback="init"></KhpjclList>
</a-tab-pane>
<a-tab-pane key="3" tab="学生原始材料" :forceRender="true">
<div v-show="sfxk2 != 5">
<XsysclList ref="xsysclFormModal" @callback="init" @handleXq="handleXsysclxq"></XsysclList>
</div>
<div v-show="sfxk2 == 5">
<XsysclxqList ref="xsysclXqFormModal" @callback="handleXsyscl2"></XsysclxqList>
</div>
</a-tab-pane>
<a-tab-pane key="4" tab="智慧教学信息" :forceRender="true">
<div v-show="zhjxxx == 1">
<Xxhbfxcjb0016List ref="Xxhbfxcjb0016Modal" @callback="handleZhjxzx" ></Xxhbfxcjb0016List>
</div>
<div v-show="zhjxxx == 2">
<div style="text-align: right;margin-right: 20px;"><a-button type="primary" @click="zhjxxx =1">返回</a-button></div>
<Xxhbfxcjmxb0015List ref="Xxhbfxcjmxb0015Modal"></Xxhbfxcjmxb0015List>
</div>
</a-tab-pane>
</a-tabs>
</div>
<!-- 表单区域 -->
<XxhbjwxtjxrwModal ref="registerModal" @success="handleSuccess"></XxhbjwxtjxrwModal class="table-style">
</div>
</template>
<script lang="ts" name="xxhbjwxtjxrw-xxhbjwxtjxrw" setup>
import { ref, reactive, onMounted, computed } from 'vue';
import { BasicTable, useTable, TableAction } from '/@/components/Table';
import { useListPage } from '/@/hooks/system/useListPage';
import { columns, columns2, columns3, superQuerySchema } from './Xxhbjwxtjxrw.data';
import { zjList, list, deleteXkxxOne, batchDelete, getImportUrl, getExportUrl } from './Xxhbjwxtjxrw.api';
import { downloadFile } from '/@/utils/common/renderUtils';
import XxhbjwxtjxrwModal from './components/XxhbjwxtjxrwModal.vue';
import { useUserStore } from '/@/store/modules/user';
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import JInput from '/@/components/Form/src/jeecg/components/JInput.vue';
import { defHttp } from '/@/utils/http/axios';
import { useMessage } from '/@/hooks/web/useMessage';
import CjdForm from './components/CjdForm.vue';
import XxhbjwxtscwjxxList from '/@/views/bl/xxhbjwxtscwjxx/XxhbjwxtscwjxxList.vue';
import XxhbjwxtxsmdList3 from '/@/views/bl/xxhbjwxtxsmd/XxhbjwxtxsmdList3.vue';
import XxhbjwxtxsmdList4 from '/@/views/bl/xxhbjwxtxsmd/XxhbjwxtxsmdList4.vue';
import XscjList from './components/XscjList.vue';
import KhpjclList from '/@/views/bl/xxhbjwxtscwjxx/KhpjclList.vue';
import XsysclList from '/@/views/bl/xxhbjwxtxsmd/XsysclList.vue';
import XsysclxqList from '/@/views/bl/xxhbjwxtxsmd/XsysclxqList.vue';
import Xxhbfxcjb0016List from '/@/views/bl/xxhbfxcj/Xxhbfxcjb0016List.vue';
import Xxhbfxcjmxb0015List from '/@/views/bl/xxhbfxcj/Xxhbfxcjmxb0015List.vue';
const formRef = ref();
const formRef3 = ref();
const cjdFormModal = ref();
const khpjclFormModal = ref();
const xsysclFormModal = ref();
const xsysclXqFormModal = ref();
const queryParam = reactive<any>({});
const queryParam2 = ref<any>({});
const toggleSearchStatus = ref<boolean>(false);
const registerModal = ref();
const Xxhbfxcjb0016Modal = ref();
const Xxhbfxcjmxb0015Modal = ref();
const userStore = useUserStore();
const emit = defineEmits(['callback']);
const sfxk = ref<number>(0);
const sfxk2 = ref<number>(0);
const zhjxxx = ref<number>(1);
const checkData = ref<any>([]);
const dataList = ref<any>([]);
import { Pagination } from 'ant-design-vue';
const jxrwInfo = reactive<any>({});
const APagination = Pagination;
const { createMessage } = useMessage();
const activeKey = ref('1');
//注册table数据
const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
tableProps: {
api: zjList,
columns: columns3,
canResize: false,
useSearchForm: false,
// actionColumn: {
// width: 320,
// fixed: 'right',
// },
beforeFetch: async (params) => {
return Object.assign(params, queryParam);
},
},
exportConfig: {
name: '教务系统教学任务',
url: getExportUrl,
params: queryParam,
},
importConfig: {
url: getImportUrl,
success: handleSuccess,
},
});
const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] =tableContext;
const labelCol = reactive({
xs: 24,
sm: 8,
xl: 8,
xxl: 8,
});
const wrapperCol = reactive({
xs: 24,
sm: 16,
});
const paginationProp = ref<any>({
total: 1,
current: 1,
pageSize: 10,
pageNo: 1,
});
const paginationYxkcProp = ref<any>({
total: 1,
current: 1,
pageSize: 10,
pageNo: 1,
});
function handleTable2SelectRowChange(event) {
console.log('--------rowchange----->',event);
}
/**
* 批量删除事件
*/
async function batchHandleDelete() {
// await batchDelete({ ids: selectedRowKeys.value }, handleSuccess);
}
//成绩单
function handleCjd(record) {
sfxk.value = 2;
cjdFormModal.value.init(record);
}
//考核评价材料
function handleKhpjcl(record) {
sfxk.value = 3;
khpjclFormModal.value.init(record);
}
//学生原始材料
function handleXsyscl(record) {
sfxk.value = 4;
xsysclFormModal.value.init(record);
}
//学生原始材料
function handleXsyscl2(record) {
sfxk2.value = 0;
}
//选课
function handleXuanke() {
sfxk.value = 1;
searchQuery2();
}
function handleXsysclxq(record) {
console.log('👨handleXsysclxq', record);
sfxk2.value = 5;
xsysclXqFormModal.value.init(record);
}
//返回首页
function handleFanhui() {
init2();
}
//选课确认
function handleQueren(record) {
console.log('😺', record);
var aaa = checkData.value.includes(record);
if (aaa) {
createMessage.warn('不能重复选择数据!');
return;
}
console.log('😇aaaa', aaa);
checkData.value.push(record);
}
//选课删除
async function handleDel(record) {
await deleteXkxxOne({ id: record.id }, xtsuccess);
}
//智慧教学中兴详情
function handleZhjxzx(record){
console.log("🚀 ~ handleZhjxzx ~ record:", record)
zhjxxx.value = 2;
Xxhbfxcjmxb0015Modal.value.init(record);
}
function xtsuccess() {
//获取是否有选课信息
defHttp.get({ url: '/zjXkxx/zjXkxx/list', params: { pageNo: paginationYxkcProp.value.current,pageSize:paginationYxkcProp.value.pageSize } }).then((res) => {
console.log('🧛', res);
checkData.value = res.records;
if(res.current>res.pages){
paginationYxkcProp.value.current =res.pages
xtsuccess()
}else{
paginationYxkcProp.value.current = res.current;
}
paginationYxkcProp.value.total = res.total;
});
searchQuery2();
}
//翻页方法
async function onPageChange(record) {
console.log('👬', record);
paginationProp.value.current = record.current;
paginationProp.value.pageSize = record.pageSize;
console.log("🚀 ~ onPageChange ~ paginationProp.value.current:", paginationProp.value)
await searchQuery2();
}
//翻页方法
async function onPageYxkcChange(record) {
paginationYxkcProp.value.current = record.current;
paginationYxkcProp.value.pageSize = record.pageSize;
await init();
}
//下载本地文件
function textDown(type, downame) {
var a = document.createElement('a'); //创建一个<a></a>标签
a.href = '/download/' + type + '.docx';
//给a标签的href属性值加上地址注意这里是绝对路径不用加 点.
a.download = downame + '.docx';
//设置下载文件文件名,这里加上.xlsx指定文件类型pdf文件就指定.fpd即可
a.style.display = 'none'; // 障眼法藏起来a标签
document.body.appendChild(a);
// 将a标签追加到文档对象中
a.click(); //模拟点击了a标签会触发a标签的href的读取浏览器就会自动下载了
a.remove();
// 一次性的用完就删除a标签
}
//选课提交
async function handleXUanze(record) {
record.id = null;
console.log('😰record----------', record);
await defHttp
.post({
url: '/zjXkxx/zjXkxx/add',
params: record,
})
.then((res) => {
console.log('🤛', res);
xtsuccess();
});
}
//选课提交
function handleSubmit() {
var list = checkData.value;
if (list.length == 0) {
createMessage.warn('请选择数据!');
}
defHttp
.post({
url: '/zjXkxx/zjXkxx/addBatch',
data: list,
})
.then((res) => {
console.log('🤛', res);
init();
});
}
/**
* 详情
*/
function handleDetail(record: Recordable) {
emit('callback', record);
}
/**
* 成功回调
*/
function handleSuccess() {
(selectedRowKeys.value = []) && reload();
}
/**
* 查看
*/
function handleView(record) {
jxrwInfo.value = record;
cjdFormModal.value.init(jxrwInfo.value); //成绩单
// khpjclFormModal.value.init(record); //考核评价材料
// xsysclFormModal.value.init(record); //学生原始材料
sfxk.value = 6;
sfxk2.value = 0;
activeKey.value = '1';
}
function onChangeTab(tab) {
console.log('🎒', tab);
if(tab==2){
khpjclFormModal.value.init(jxrwInfo.value); //考核评价材料
}else if(tab==3){
xsysclFormModal.value.init(jxrwInfo.value); //学生原始材料
}else if(tab == 4){
zhjxxx.value = 1;
Xxhbfxcjb0016Modal.value.init(jxrwInfo.value);
}
}
/**
* 操作栏
*/
function getTableAction(record) {
return [
{
label: '查看',
onClick: handleView.bind(null, record),
},
// {
// label: '学生成绩',
// onClick: handleCjd.bind(null, record),
// },
// {
// label: '考核评价材料',
// onClick: handleKhpjcl.bind(null, record),
// },
// {
// label: '学生原始材料',
// onClick: handleXsyscl.bind(null, record),
// },
];
}
/**
* 查询
*/
function searchQuery() {
reload();
}
/**
* 查询
*/
function searchQuery2() {
queryParam2.value.pageNo = paginationProp.value.current;
console.log("🚀 ~ searchQuery2 ~ paginationProp:", paginationProp)
queryParam2.value.fileShztmc = '审核通过';
console.log("🚀 ~ searchQuery2 ~ queryParam2:", queryParam2)
defHttp.get({ url: '/xxhbjwxtjxrw/xxhbjwxtjxrw/list', params: { pageNo: paginationProp.value.current,pageSize:paginationProp.value.pageSize, ...queryParam2.value } }).then((res) => {
dataList.value = res.records;
paginationProp.value.total = res.total;
// paginationProp.value.current = res.pageNo;
});
}
/**
* 重置
*/
function searchReset() {
formRef3.value.resetFields();
selectedRowKeys.value = [];
//刷新数据
reload();
}
function init() {
//获取是否有选课信息
defHttp.get({ url: '/zjXkxx/zjXkxx/list', params: { pageNo: paginationYxkcProp.value.current,pageSize:paginationYxkcProp.value.pageSize } }).then((res) => {
sfxk.value = 999;
checkData.value = res.records;
paginationYxkcProp.value.total = res.total;
paginationYxkcProp.value.current = res.current;
});
}
function init2() {
//获取是否有选课信息
defHttp.get({ url: '/zjXkxx/zjXkxx/list', params: { pageNo: paginationYxkcProp.value.current,pageSize:paginationYxkcProp.value.pageSize } }).then((res) => {
console.log('🧛', res);
if (res.records.length == 0) {
sfxk.value = 0;
checkData.value = [];
} else {
sfxk.value = 1;
checkData.value = res.records;
paginationYxkcProp.value.total = res.total;
paginationYxkcProp.value.current = res.current;
searchQuery2();
}
});
}
// 自动请求并暴露内部方法
onMounted(() => {
init2();
});
</script>
<style lang="less" scoped>
.jeecg-basic-table-form-container {
padding: 0;
.table-page-search-submitButtons {
display: block;
margin-bottom: 24px;
white-space: nowrap;
}
.query-group-cust {
min-width: 100px !important;
}
.query-group-split-cust {
width: 30px;
display: inline-block;
text-align: center;
}
.ant-form-item:not(.ant-form-item-with-help) {
margin-bottom: 16px;
height: 32px;
}
:deep(.ant-picker),
:deep(.ant-input-number) {
width: 100%;
}
}
.query-criteria {
padding-top: 22px;
border: 1px solid #eaeef6;
border-radius: 4px;
}
.query-criteria:hover {
border: 1px solid #c5d8ff;
box-shadow: 2px 2px 10px 2px #e8ecf4;
border-radius: 4px;
}
.table-style {
padding: 10px;
background: #fff;
border: 1px solid #eaeef6;
border-radius: 4px;
}
.table-style:hover {
border: 1px solid #e8ecf4;
box-shadow: 2px 2px 10px 2px #e8ecf4;
border-radius: 4px;
}
.xn-title {
font-size: 16px;
font-weight: 700;
}
.selection-title {
font-size: 18px;
font-weight: 700;
padding-left: 10px;
}
.seleciton-line {
background: #1890ff;
border-radius: 10px;
color: #1890ff;
}
.mbxtitle {
font-size: 22px;
line-height: 22px;
}
</style>