DBSD_ZJPT/jeecgboot-vue3/src/views/bl/xxhbjwxtjxrw/XxhbjwxtjxrwList3.vue

495 lines
17 KiB
Vue
Raw Normal View History

2024-09-12 21:02:51 +08:00
<template>
<div class="p-2">
<div v-if="sfxk == 0">
<div style="text-align: center">
<div style="color: red; font-weight: 700; font-size: 20; margin-top: 200px">您还没有选课请先选择课程</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 ref="formRef" @keyup.enter.native="searchQuery2" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-row :gutter="24">
<a-col :lg="6">
<a-form-item name="xn">
<template #label><span title="学年">学年</span></template>
<j-dict-select-tag placeholder="请选择学年" v-model:value="queryParam2.xn" :dictCode="`v_xn,xn,xn`" allow-clear />
</a-form-item>
</a-col>
<a-col :lg="6">
<a-form-item name="xqmc">
<template #label><span title="学期">学期</span></template>
<j-dict-select-tag placeholder="请选择学期" v-model:value="queryParam2.xqmc" dictCode="cjxq" allow-clear />
</a-form-item>
</a-col>
<a-col :lg="6">
<a-form-item name="kkyxmc">
<template #label><span 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="所属专业">所属专业</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="任课教师">任课教师</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="职称">职称</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 :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 #bodyCell="{ column, record }">
<template v-if="column.dataIndex === 'action'">
<a @click="handleQueren(record)">确认</a>
</template>
</template>
</a-table>
<a-table :columns="columns2" :data-source="checkData" :pagination="false">
<template #bodyCell="{ column, record }">
<template v-if="column.dataIndex === 'action'">
<a @click="handleDel(record)">删除</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="init"></XxhbjwxtxsmdList4>
</div>
<!-- 选课后的列表 -->
<div v-if="sfxk == 999">
<!--查询区域-->
<div class="jeecg-basic-table-form-container">
<a-form ref="formRef" @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-row :gutter="24">
<!-- <a-col :span="24" style="text-align: right;margin-bottom: 20px;">
模板下载
<a-popover placement="topRight" type="primary">
<template #content>
<a-button type="primary" style="margin-left: 10px;margin-top: 10px" @click="textDown('a1','课堂教学评价表')">课堂教学评价表</a-button>
<a-button type="primary" style="margin-left: 10px;margin-top: 10px" @click="textDown('a2','试卷评价表')">试卷评价表</a-button>
<a-button type="primary" style="margin-left: 10px;margin-top: 10px" @click="textDown('a3','本科毕业论文(设计)评价表')">本科毕业论文设计评价表</a-button>
</template>
<template #title>
<span>专家用评价表</span>
</template>
<a-button>专家用评价表</a-button>
</a-popover>
</a-col> -->
<a-col :lg="6">
<a-form-item name="xn">
<template #label><span title="学年">学年</span></template>
<j-dict-select-tag placeholder="请选择学年" v-model:value="queryParam.xn" :dictCode="`v_xn,xn,xn`" allow-clear />
</a-form-item>
</a-col>
<a-col :lg="6">
<a-form-item name="xqmc">
<template #label><span title="学期">学期</span></template>
<j-dict-select-tag placeholder="请选择学期" v-model:value="queryParam.xqmc" dictCode="cjxq" allow-clear />
</a-form-item>
</a-col>
<a-col :lg="6">
<a-form-item name="kkyxmc">
<template #label><span title="开课单位名称">开课单位名称</span></template>
<j-dict-select-tag
placeholder="请选择开课单位名称"
v-model:value="queryParam.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="所属专业">所属专业</span></template>
<j-dict-select-tag
placeholder="请选择所属专业"
v-model:value="queryParam.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="任课教师">任课教师</span></template>
<j-input placeholder="请输入任课教师" v-model:value="queryParam.teaxm" allow-clear></j-input>
</a-form-item>
</a-col>
<a-col :lg="6">
<a-form-item name="zhicheng">
<template #label><span title="职称">职称</span></template>
<j-dict-select-tag
placeholder="请选择职称"
v-model:value="queryParam.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="课程名称">课程名称</span></template>
<j-input placeholder="请输入课程名称" v-model:value="queryParam.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="searchQuery">查询</a-button>
<a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset" style="margin-left: 8px">重置</a-button>
<a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls" style="margin-left: 8px"> 导出</a-button>
<a-button type="primary" preIcon="ant-design:export-outlined" @click="handleXuanke" style="margin-left: 8px"> 选课</a-button>
</a-col>
</a-row>
</a-form>
</div>
<!--引用表格-->
<BasicTable @register="registerTable">
<!--操作栏-->
<template #action="{ record }">
<TableAction :actions="getTableAction(record)" />
</template>
<template #cjd="{ record }">
<a @click="handleCjd(record)">查看</a>
</template>
<template #khpjcl="{ record }">
<a>查看</a>
</template>
<template #xsyscl="{ record }">
<a>查看</a>
</template>
</BasicTable>
</div>
<!-- 表单区域 -->
<XxhbjwxtjxrwModal ref="registerModal" @success="handleSuccess"></XxhbjwxtjxrwModal>
</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, deleteOne, 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';
const formRef = 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 userStore = useUserStore();
const emit = defineEmits(['callback']);
const sfxk = ref<number>(0);
const checkData = ref<any>([]);
const dataList = ref<any>([]);
import { Pagination } from 'ant-design-vue';
const APagination = Pagination;
const { createMessage } = useMessage();
//注册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: 6,
xl: 6,
xxl: 6,
});
const wrapperCol = reactive({
xs: 24,
sm: 18,
});
const paginationProp = ref<any>({
total: 1,
current: 1,
pageSize: 10,
pageNo: 1,
});
//成绩单
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 handleXuanke() {
sfxk.value = 1;
searchQuery2();
}
function handleXsysclxq(record) {
console.log('👨handleXsysclxq', record);
sfxk.value = 5;
xsysclXqFormModal.value.init(record);
}
//返回首页
function handleFanhui() {
init();
}
//选课确认
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);
}
//选课删除
function handleDel(record) {
checkData.value = checkData.value.filter((item) => item.kcrwdm !== record.kcrwdm);
}
//翻页方法
async function onPageChange(record) {
console.log('👬', record);
paginationProp.value.current = record.current;
await searchQuery2();
}
//下载本地文件
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标签
}
//选课提交
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 getTableAction(record) {
return [
{
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;
defHttp.get({ url: '/xxhbjwxtjxrw/xxhbjwxtjxrw/list', params: { pageNo: paginationProp.value.current, ...queryParam2.value } }).then((res) => {
dataList.value = res.records;
paginationProp.value.total = res.total;
paginationProp.value.current = res.pageNo;
});
}
/**
* 重置
*/
function searchReset() {
formRef.value.resetFields();
selectedRowKeys.value = [];
//刷新数据
reload();
}
function init() {
//获取是否有选课信息
defHttp.get({ url: '/zjXkxx/zjXkxx/list', params: { pageSize: -1 } }).then((res) => {
console.log('🧛', res);
if (res.records.length == 0) {
sfxk.value = 0;
checkData.value = [];
} else {
sfxk.value = 999;
checkData.value = res.records;
paginationProp.value.total = res.records.total;
paginationProp.value.current = res.records.pages;
}
});
}
// 自动请求并暴露内部方法
onMounted(() => {
init();
});
</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%;
}
}
</style>