添加上传考核材料功能

This commit is contained in:
yangjun 2024-12-12 14:54:54 +08:00
parent 334a9c1347
commit 5e5907f877
13 changed files with 1099 additions and 209 deletions

View File

@ -146,7 +146,7 @@ const zuoye: AppRouteModule = {
{
path: 'dqkcKhcl',
name: 'dqkcKhcl',
component: () => import('/@/views/zy/zyInfo/ZyInfoKhclList.vue'),
component: () => import('/@/views/zy/zyInfo/KhclMainList.vue'),
meta: {
title: '考核材料',
},

View File

@ -1,15 +1,10 @@
<template>
<div>
<!-- <a-divider type="vertical" />
<j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="importXls">导入试题</j-upload-button>
<a-divider type="vertical" />
<a-button type="primary" @click="downloadByUrl({url:'/downPath/stdrmb.xls',target: '_self',fileName:'试题导入模板.xls'})" class="mar-right20"><Icon icon="ant-design:file-add-outlined" />下载试题模板</a-button> -->
<!--查询区域-->
<div class="jeecg-basic-table-form-container">
<a-form @keyup.enter.native="reload" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-row :gutter="24">
<a-col :lg="24">
<!-- <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="importXls">导入试题</j-upload-button> -->
<a-button type="primary" @click="importOpen = true">导入试题</a-button>
<a-button type="primary" @click="addOpen = true" style="margin-left: 20px">手动添加</a-button>
</a-col>
@ -567,8 +562,7 @@ const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
canResize: false,
useSearchForm: false,
actionColumn: {
width: 240,
fixed: 'right',
width: 320,
},
beforeFetch: (params) => {
(params.column = 'id'), (params.order = 'desc'); //
@ -891,12 +885,23 @@ function handleSuccess() {
(selectedRowKeys.value = []) && reload();
}
/**
* 删除事件
*/
async function handleDelete(record) {
await deleteOne({ id: record.id }, handleSuccess);
}
/**
* 删除事件
*/
async function handleDelete(record) {
await deleteOne({ id: record.id }, handleSuccess);
}
/**
* 移出题库
*/
function handleYctk(record){
console.log("🚀 ~ handleYctk ~ record:", record)
defHttp.post({url:'/wjxWjxxTmlb/wjxWjxxTmlb/yctk',params:{wjTitle:record.wjTitle,createBy:record.createBy}}).then(res=>{
console.log('res--->',res);
reload();
})
}
/**
* 操作栏
*/
@ -921,6 +926,10 @@ function getTableAction(record) {
onClick: handleDelete.bind(null, record),
ifShow: (record.mainId == '' || record.mainId == null),
},
{
label: '移出题库',
onClick: handleYctk.bind(null, record),
},
{
label: '修改',
onClick: handleEdit2.bind(null, record),

View File

@ -22,22 +22,26 @@ export const columns: BasicColumn[] = [
}
return rt;
},
width:100,
},
{
title: '问题标题',
align:"center",
dataIndex: 'wjTitle',
slots: { customRender: 'wjTitleaction' },
width:400,
},
{
title: '问题分值',
align:"center",
dataIndex: 'wjScore'
dataIndex: 'wjScore',
width:100,
},
{
title: '是否公有',
align:"center",
dataIndex: 'wjSytype_dictText'
dataIndex: 'wjSytype_dictText',
width:100,
},
];
export const wjdccolumns: BasicColumn[] = [

View File

@ -0,0 +1,42 @@
<template>
<div style="background-color: white;padding: 10px;margin-top: 10px;">
<a-tabs v-model:activeKey="activeKey">
<a-tab-pane key="1" tab="作业考核材料">
<ZyInfoKhclList></ZyInfoKhclList>
</a-tab-pane>
<a-tab-pane key="2" tab="测验考核材料">
<WjxKhclList></WjxKhclList>
</a-tab-pane>
</a-tabs>
</div>
</template>
<script lang="ts" name="zyInfo-zyInfo" setup>
import { ref, reactive } from 'vue';
import ZyInfoKhclList from '/@/views/zy/zyInfo/ZyInfoKhclList.vue'
import WjxKhclList from '/@/views/zy/zyInfo/WjxKhclList.vue'
const activeKey= ref('1');
</script>
<style lang="less" scoped>
.jeecg-basic-table-form-container {
.table-page-search-submitButtons {
display: block;
margin-bottom: 24px;
white-space: nowrap;
}
.query-group-cust{
width: calc(50% - 15px);
min-width: 100px !important;
}
.query-group-split-cust{
width: 30px;
display: inline-block;
text-align: center
}
}
</style>

View File

@ -0,0 +1,174 @@
<template>
<div>
<!--引用表格-->
<BasicTable @register="registerTable" :rowSelection="rowSelection">
<!--插槽:table标题-->
<template #tableTitle>
<a-button type="primary" preIcon="ant-design:export-outlined" @click="batchHandleKhcl" style="margin-left: 8px">上传考核材料</a-button>
</template>
<!--操作栏-->
<template #action="{ record }">
<TableAction :actions="getTableAction(record)" />
</template>
<!--字段回显插槽-->
<template #htmlSlot="{text}">
<template v-if="text">
<a-popover >
<template #content>
<div v-html="text"></div>
</template>
<Icon icon="ant-design:search-outlined" :size="20" />
</a-popover>
</template>
<template v-else></template>
</template>
<!--省市区字段回显插槽-->
<!--<template #pcaSlot="{text}">
{{ getAreaTextByCode(text) }}
</template>-->
<template #fileSlot="{text}">
<span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
<a-button v-else :ghost="true" type="primary" preIcon="ant-design:download-outlined" size="small" @click="downloadFile(text)">下载</a-button>
</template>
</BasicTable>
<!-- 表单区域 -->
<ZyKhclModal ref="registerModal" @success="handleSuccess"></ZyKhclModal>
</div>
</template>
<script lang="ts" name="zyInfo-zyInfo" setup>
import { ref, reactive,unref } from 'vue';
import { BasicTable, useTable, TableAction } from '/@/components/Table';
import { useListPage } from '/@/hooks/system/useListPage';
import { columnsWjxKhcl } from './ZyInfo.data';
import { khclList, getImportUrl, getExportUrl } from './ZyInfo.api';
import { downloadFile } from '/@/utils/common/renderUtils';
import ZyKhclModal from './ZyKhclModal.vue'
import { useMessage } from '/@/hooks/web/useMessage';
import { defHttp } from '/@/utils/http/axios';
import { useRouter } from 'vue-router';
const { currentRoute } = useRouter();
const { query } = unref(currentRoute);
const { rwbh,xqxn,type,teano } = query;//
const queryParam = ref<any>({qpublish:'2',rwbh});
const toggleSearchStatus = ref<boolean>(false);
const { createConfirm, createMessage } = useMessage();
const registerModal = ref();
//table
const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
tableProps: {
title: 'zy_info',
api: khclList,
columns:columnsWjxKhcl,
canResize:false,
useSearchForm: false,
// showActionColumn: false,
actionColumn: {
width: 120,
fixed: 'right',
},
beforeFetch: (params) => {
params.column = '',params.order = '';//
return Object.assign(params, queryParam.value);
},
},
exportConfig: {
name: "zy_info",
url: getExportUrl,
},
importConfig: {
url: getImportUrl,
success: handleSuccess
},
});
const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext;
const labelCol = reactive({
xs: { span: 24 },
sm: { span: 7 },
});
const wrapperCol = reactive({
xs: { span: 24 },
sm: { span: 16 },
});
/**
* 详情
*/
function handleDetail(record: Recordable) {
registerModal.value.disableSubmit = true;
registerModal.value.edit(record);
}
/**
* 成功回调
*/
function handleSuccess() {
(selectedRowKeys.value = []) && reload();
}
/**
* 操作栏
*/
function getTableAction(record) {
return [
{
label: '上传',
onClick: batchDtkhclsc.bind(null, record),
ifShow: () => {
return record.sfsckhcl === '0';
},
},
{
label: '详情',
onClick: handleDetail.bind(null, record),
},
];
}
//
function batchHandleKhcl() {
if (selectedRowKeys.value.length == 0) {
createMessage.warn('请勾选要上传的作业数据!');
return;
}
console.log("🚀 ~ batchHandleKhcl ~ selectedRowKeys.value:", selectedRowKeys.value)
// batchZyinfoKhcl({ ids: selectedRowKeys.value }, reload);
// defHttp.post({url:'/zyInfoStudent/zyInfoStudent/uploadSckhcl',params:{id:selectedRowKeys.value.join(',')}}).then(res=>{})
defHttp.post({url:'/wjxWjxx/wjxWjxx/uploadSckhcl',data:{id:selectedRowKeys.value.join(',')}}).then(res=>{
reload();
})
createMessage.success("系统上传中,请等待")
}
//
function batchDtkhclsc(record) {
console.log("🚀 ~ batchHandleKhcl ~ record:", record)
defHttp.post({url:'/wjxWjxx/wjxWjxx/uploadSckhcl',data:{id:record.id}}).then(res=>{
reload();
})
createMessage.success("系统上传中,请等待")
}
</script>
<style lang="less" scoped>
.jeecg-basic-table-form-container {
.table-page-search-submitButtons {
display: block;
margin-bottom: 24px;
white-space: nowrap;
}
.query-group-cust{
width: calc(50% - 15px);
min-width: 100px !important;
}
.query-group-split-cust{
width: 30px;
display: inline-block;
text-align: center
}
}
</style>

View File

@ -6,6 +6,7 @@ const { createConfirm } = useMessage();
enum Api {
list = '/zyInfo/zyInfo/list',
listKhcl = '/zyInfo/zyInfo/listKhcl',
khclList = '/wjxWjxx/wjxWjxx/khclList',
listOther = '/zyInfo/zyInfo/listOther',
save='/zyInfo/zyInfo/add',
edit='/zyInfo/zyInfo/edit',
@ -33,6 +34,7 @@ export const getImportUrl = Api.importExcel;
export const list = (params) => defHttp.get({ url: Api.list, params });
export const listOther = (params) => defHttp.get({ url: Api.listOther, params });
export const listKhcl = (params) => defHttp.get({ url: Api.listKhcl, params });
export const khclList = (params) => defHttp.get({ url: Api.khclList, params });
/**
*

View File

@ -145,57 +145,148 @@ export const columns3: BasicColumn[] = [
//列表数据
export const columnsKhcl: BasicColumn[] = [
{
title: '作业名称',
align: "center",
dataIndex: 'title'
},
{
title: '是否上传考核材料',
align: "center",
dataIndex: 'sfsckhcl_dictText'
},
{
title: '上传考核材料时间',
align: "center",
dataIndex: 'sfsckhclTime',
customRender:({text}) =>{
return !text?"":(text.length>10?text.substr(0,10):text);
},
},
{
title: '是否全部完成',
align: "center",
dataIndex: 'zyStatus',
customRender:({text}) =>{
var rt = "未完成";
if(text=='2'){
rt = "已完成";
}
return rt;
},
},
{
title: '学年学期',
align: "center",
dataIndex: 'xnxq'
},
{
title: '作业开始时间',
title: '考核名称',
align: "center",
dataIndex: 'startTime',
customRender:({text}) =>{
return !text?"":(text.length>10?text.substr(0,10):text);
dataIndex: 'zyLeixing',
customRender:({text,record}) =>{
var clmc = "";
if(text == '0'){
clmc = "课程作业";
}else if(text == '1'){
clmc = "期末考试";
}
clmc = clmc+record.sort;
return clmc;
},
},
{
title: '作业结束时间',
title: '作业名称',
align: "center",
dataIndex: 'title'
},
{
title: '评分依据/标准',
align: "center",
dataIndex: 'pfbz',
slots: {customRender:'htmlSlot'}
},
{
title: '空白试卷或试卷描述',
align: "center",
dataIndex: 'content',
slots: {customRender:'htmlSlot'}
},
{
title: '考核材料份数',
align: "center",
dataIndex: 'xkxs'
},
{
title: '考核完成',
align: "center",
dataIndex: 'endTime',
customRender:({text}) =>{
return !text?"":(text.length>10?text.substr(0,10):text);
},
},
{
title: '状态',
align: "center",
dataIndex: 'sfsckhcl_dictText'
},
// {
// title: '是否全部完成',
// align: "center",
// dataIndex: 'zyStatus',
// customRender:({text}) =>{
// var rt = "未完成";
// if(text=='2'){
// rt = "已完成";
// }
// return rt;
// },
// },
// {
// title: '上传考核材料时间',
// align: "center",
// dataIndex: 'sfsckhclTime',
// customRender:({text}) =>{
// return !text?"":(text.length>10?text.substr(0,10):text);
// },
// },
// {
// title: '作业开始时间',
// align: "center",
// dataIndex: 'startTime',
// customRender:({text}) =>{
// return !text?"":(text.length>10?text.substr(0,10):text);
// },
// },
];
//列表数据
export const columnsWjxKhcl: BasicColumn[] = [
{
title: '学年学期',
align: "center",
dataIndex: 'xqxn'
},
{
title: '考核名称',
align: "center",
dataIndex: 'atype',
customRender:({text,record}) =>{
var clmc = "";
if(text == '6'){
clmc = "课堂测验";
}else if(text == '1'){
clmc = "课堂问卷";
}
clmc = clmc+record.sort;
return clmc;
},
},
{
title: '测验名称',
align: "center",
dataIndex: 'title'
},
// {
// title: '评分依据/标准',
// align: "center",
// dataIndex: 'pfbz',
// slots: {customRender:'htmlSlot'}
// },
{
title: '空白试卷或试卷描述',
align: "center",
dataIndex: 'content',
slots: {customRender:'htmlSlot'}
},
{
title: '考核材料份数',
align: "center",
dataIndex: 'xkrs'
},
{
title: '考核完成',
align: "center",
dataIndex: 'endTime',
customRender:({text}) =>{
return !text?"":(text.length>10?text.substr(0,10):text);
},
},
{
title: '状态',
align: "center",
dataIndex: 'sfsckhcl_dictText'
},
];

View File

@ -1,37 +1,28 @@
<template>
<div>
<!--查询区域-->
<div class="jeecg-basic-table-form-container">
<a-form @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-row :gutter="24">
<a-col :lg="8">
<a-form-item label="学年学期">
<j-dict-select-tag ref="xqDictTag" placeholder="请选择学年学期" v-model:value="queryParam.xqxn" dictCode="kc_xqxn_history,title,title,true order by start_time desc"/>
</a-form-item>
</a-col>
<a-col :xl="6" :lg="7" :md="8" :sm="24">
<span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
<a-col :lg="6">
<a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
</a-col>
</span>
</a-col>
</a-row>
</a-form>
</div>
<!--引用表格-->
<BasicTable @register="registerTable" :rowSelection="rowSelection">
<!--插槽:table标题-->
<template #tableTitle>
<a-button type="primary" preIcon="ant-design:export-outlined" @click="batchHandleKhcl" style="margin-left: 8px">上传考核材料</a-button>
<span style="color:red;font-weight: 700;">温馨提示未完成评阅的作业无法上传如需上传请完成全部评阅</span>
</template>
<!--操作栏-->
<template #action="{ record }">
<TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/>
<TableAction :actions="getTableAction(record)" />
</template>
<!--字段回显插槽-->
<template #htmlSlot="{text}">
<div v-html="text"></div>
<template v-if="text">
<a-popover >
<template #content>
<div v-html="text"></div>
</template>
<Icon icon="ant-design:search-outlined" :size="20" />
</a-popover>
</template>
<template v-else></template>
</template>
<!--省市区字段回显插槽-->
<!--<template #pcaSlot="{text}">
@ -43,23 +34,26 @@
</template>
</BasicTable>
<!-- 表单区域 -->
<ZyInfoModal ref="registerModal" @success="handleSuccess"></ZyInfoModal>
<ZyKhclModal ref="registerModal" @success="handleSuccess"></ZyKhclModal>
</div>
</template>
<script lang="ts" name="zyInfo-zyInfo" setup>
import { ref, reactive } from 'vue';
import { ref, reactive,unref } from 'vue';
import { BasicTable, useTable, TableAction } from '/@/components/Table';
import { useListPage } from '/@/hooks/system/useListPage';
import { columnsKhcl } from './ZyInfo.data';
import { listKhcl, deleteOne, batchDelete, getImportUrl, getExportUrl } from './ZyInfo.api';
import { downloadFile } from '/@/utils/common/renderUtils';
import ZyInfoModal from './components/ZyInfoModal.vue'
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import ZyKhclModal from './ZyKhclModal.vue'
import { useMessage } from '/@/hooks/web/useMessage';
import { defHttp } from '/@/utils/http/axios';
import { useRouter } from 'vue-router';
const queryParam = ref<any>({zyStatus:'1,2'});
const { currentRoute } = useRouter();
const { query } = unref(currentRoute);
const { rwbh,xqxn,type,teano } = query;//
const queryParam = ref<any>({zyStatus:'2',rwbh});
const toggleSearchStatus = ref<boolean>(false);
const { createConfirm, createMessage } = useMessage();
const registerModal = ref();
@ -71,7 +65,7 @@ import { defHttp } from '/@/utils/http/axios';
columns:columnsKhcl,
canResize:false,
useSearchForm: false,
showActionColumn: false,
// showActionColumn: false,
actionColumn: {
width: 120,
fixed: 'right',
@ -100,21 +94,6 @@ import { defHttp } from '/@/utils/http/axios';
sm: { span: 16 },
});
/**
* 新增事件
*/
function handleAdd() {
registerModal.value.disableSubmit = false;
registerModal.value.add();
}
/**
* 编辑事件
*/
function handleEdit(record: Recordable) {
registerModal.value.disableSubmit = false;
registerModal.value.edit(record);
}
/**
* 详情
@ -124,19 +103,6 @@ import { defHttp } from '/@/utils/http/axios';
registerModal.value.edit(record);
}
/**
* 删除事件
*/
async function handleDelete(record) {
await deleteOne({ id: record.id }, handleSuccess);
}
/**
* 批量删除事件
*/
async function batchHandleDelete() {
await batchDelete({ ids: selectedRowKeys.value }, handleSuccess);
}
/**
* 成功回调
@ -151,60 +117,44 @@ import { defHttp } from '/@/utils/http/axios';
function getTableAction(record) {
return [
{
label: '编辑',
onClick: handleEdit.bind(null, record),
label: '上传',
onClick: batchDtkhclsc.bind(null, record),
ifShow: () => {
return record.sfsckhcl === '0';
},
},
{
label: '详情',
onClick: handleDetail.bind(null, record),
},
];
}
/**
* 下拉操作栏
*/
function getDropDownAction(record) {
return [
{
label: '详情',
onClick: handleDetail.bind(null, record),
}, {
label: '删除',
popConfirm: {
title: '是否确认删除',
confirm: handleDelete.bind(null, record),
}
}
]
}
//
function batchHandleKhcl() {
if (selectedRowKeys.value.length == 0) {
createMessage.warn('请勾选要上传的作业数据!');
return;
}
console.log("🚀 ~ batchHandleKhcl ~ selectedRowKeys.value:", selectedRowKeys.value)
// batchZyinfoKhcl({ ids: selectedRowKeys.value }, reload);
// defHttp.post({url:'/zyInfoStudent/zyInfoStudent/uploadSckhcl',params:{id:selectedRowKeys.value.join(',')}}).then(res=>{})
defHttp.post({url:'/zyInfoStudent/zyInfoStudent/uploadSckhcl',data:{id:selectedRowKeys.value.join(',')}}).then(res=>{
reload();
})
createMessage.success("系统上传中,请等待")
}
/**
* 查询
*/
function searchQuery() {
reload();
if (selectedRowKeys.value.length == 0) {
createMessage.warn('请勾选要上传的作业数据!');
return;
}
console.log("🚀 ~ batchHandleKhcl ~ selectedRowKeys.value:", selectedRowKeys.value)
// batchZyinfoKhcl({ ids: selectedRowKeys.value }, reload);
// defHttp.post({url:'/zyInfoStudent/zyInfoStudent/uploadSckhcl',params:{id:selectedRowKeys.value.join(',')}}).then(res=>{})
defHttp.post({url:'/zyInfoStudent/zyInfoStudent/uploadSckhcl',data:{id:selectedRowKeys.value.join(',')}}).then(res=>{
reload();
})
createMessage.success("系统上传中,请等待")
}
/**
* 重置
*/
function searchReset() {
queryParam.value = {};
selectedRowKeys.value = [];
//
reload();
//
function batchDtkhclsc(record) {
console.log("🚀 ~ batchHandleKhcl ~ record:", record)
defHttp.post({url:'/zyInfoStudent/zyInfoStudent/uploadSckhcl',data:{id:record.id}}).then(res=>{
reload();
})
createMessage.success("系统上传中,请等待")
}

View File

@ -0,0 +1,482 @@
<template>
<div style="background: #fafafa; height: calc(100vh - 225px); overflow-y: auto; margin: 10px 0; padding: 8px 0 0 0">
<div style="overflow-y: auto">
<a-row>
<a-col :span="24" style="overflow: hidden">
<!--查询区域-->
<div class="sear-distance">
<a-form @keyup.enter.native="searchQueryZyxq" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-row :gutter="24">
<a-col :lg="7">
<a-form-item label="学生姓名">
<j-input placeholder="请输入学生姓名" v-model:value="queryParam.studentName"></j-input>
</a-form-item>
</a-col>
<a-col :lg="7">
<a-form-item label="学生学号">
<j-input placeholder="请输入学生学号" v-model:value="queryParam.createBy"></j-input>
</a-form-item>
</a-col>
<a-col :lg="7">
<a-form-item label="作业状态">
<a-select v-model:value="queryType" style="width: 100%">
<a-select-option value="">全部</a-select-option>
<a-select-option value="1">待提交</a-select-option>
<a-select-option value="2">已提交</a-select-option>
<a-select-option value="5">待评阅</a-select-option>
<a-select-option value="4">已评阅</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :span="3">
<a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQueryZyxq">查询</a-button>
</a-col>
</a-row>
</a-form>
</div>
<!--引用表格-->
<BasicTable @register="registerTable">
<template #action="{ record }">
<TableAction :actions="getTableAction(record)" />
</template>
<template #zgcclaction="{ record }">
<div v-if="record.alltgl">
<span v-if="record.filePath">
<template v-if="record.zgccl && record.zgccl != '0'">
<span v-if="parseFloat(record.zgccl) <= parseFloat(record.alltgl)" title="通过" style="color: #36b395; cursor: pointer" >
{{ record.zgccl }}
</span>
<span v-else title="未通过" style="color: red" >{{ record.zgccl }}</span>
</template>
<template v-else>查重中</template>
</span>
<span v-else> </span>
</div>
<div v-else>
<span></span>
</div>
</template>
<template #scoreaction="{ record }">
{{ record.score }}
</template>
<template #xshpfsaction="{ record }">
{{ record.xshpfs }}
</template>
<template #htmlSlot="{ text }">
<div v-html="text"></div>
</template>
</BasicTable>
</a-col>
</a-row>
</div>
<a-modal v-model:visible="imgvisible" title="图片预览" width="800px" :cancelText="`关闭`" :okButtonProps="{ class: { 'jee-hidden': true } }">
<div style="padding: 10px 20px">
<a-button type="primary" @click="rotateImage">顺时针旋转</a-button>
<a-button type="primary" @click="rotateImage2" style="margin-left: 20px">逆时针旋转</a-button>
</div>
<div class="image-container">
<img :src="ylimgurl" :style="{ transform: 'rotate(' + rotationAngle + 'deg)' }" class="rotated-image" />
</div>
</a-modal>
</div>
</template>
<script lang="ts" name="zyInfo-zyInfo" setup>
import { ref, reactive, defineExpose, unref } from 'vue';
import { BasicTable, TableAction } from '/@/components/Table';
import { useMessage } from '/@/hooks/web/useMessage';
import { JInput } from '/@/components/Form';
import { useListPage } from '/@/hooks/system/useListPage';
import { newKhclColumns } from '/@/views/zy/zyInfoStudent/ZyInfoStudent.data';
import { getList2, getExportUrl } from '/@/views/zy/zyInfoStudent/ZyInfoStudent.api';
import { downloadFile } from '/@/utils/common/renderUtils';
import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
import { useGlobSetting } from '/@/hooks/setting';
const globSetting = useGlobSetting();
const baseApiUrl = globSetting.domainUrl;
const { createConfirm, createMessage } = useMessage();
const queryParam = ref<any>({});
const imgvisible = ref<boolean>(false);
const queryType = ref<string>('');
const ylimgurl = ref<any>('');
const rotationAngle = ref(0);
//table
const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
tableProps: {
api: getList2,
columns: newKhclColumns,
canResize: false,
useSearchForm: false,
immediate: false,
pagination: {
current: 1,
pageSize: 10,
},
actionColumn: {
width: '200px',
fixed: 'right',
},
showTableSetting: true,
defSort: {
field: 'name',
order: 'ascend',
},
beforeFetch: (params) => {
// params.column = 'publishTime',params.order = 'desc';//
return Object.assign(params, queryParam.value);
},
},
exportConfig: {
name: '学生作业信息',
url: getExportUrl,
params: () => {
return Object.assign({}, queryParam.value);
},
},
});
const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] =
tableContext;
//
function rotateImage() {
rotationAngle.value += 90; // 90
}
//
function rotateImage2() {
rotationAngle.value -= 90; // 90
}
/**
* 作业详情查询
*/
function searchQueryZyxq() {
selectedRowKeys.value = [];
queryParam.value.queryType = queryType.value;
reload();
}
//
function handleDown(text) {
downloadFile(text);
}
//
function yulanFile(record) {
console.log('🙇‍♀️', record);
if (record.pdfPath) {
var url2 = getFileAccessHttpUrl(record.pdfPath);
let url = baseApiUrl + '/generic/web/viewer.html?file=' + encodeURIComponent(url2);
window.open(url, '_blank');
} else {
const parts = record.filePath.split('.');
const filetype = parts[parts.length - 1];
if (filetype == 'jpg' || filetype == 'png' || filetype == 'jpeg' || filetype == 'xls' || filetype == 'xlsx' || filetype == 'text') {
imgvisible.value = true;
var url2 = getFileAccessHttpUrl(record.filePath);
console.log('👀', url2);
ylimgurl.value = url2;
} else if (filetype == 'doc' || filetype == 'docx' || filetype == 'pdf') {
var url2 = getFileAccessHttpUrl(record.pdfPath);
let url = baseApiUrl + '/generic/web/viewer.html?file=' + encodeURIComponent(url2);
window.open(url, '_blank');
} else {
createMessage.error('当前作业不支持预览,请下载后查阅!');
}
}
}
/**
* 操作栏
*/
function getTableAction(record) {
if (record.filePath) {
let list = [
{
label: '下载',
onClick: handleDown.bind(null, record.filePath),
},
{
label: '预览',
onClick: yulanFile.bind(null, record),
},
];
return list;
} else {
let list = [];
return list;
}
}
const labelCol = reactive({
xs: { span: 24 },
sm: { span: 4 },
});
const wrapperCol = reactive({
xs: { span: 24 },
sm: { span: 16 },
});
function edit(record){
console.log("🚀 ~ edit ~ record:", record)
queryParam.value.ywid = record.id;
queryParam.value.rwbh = record.rwbh;
searchQueryZyxq()
}
defineExpose({
edit,
});
</script>
<style lang="less" scoped>
.title {
margin-left: 20px;
font-size: 16px;
font-weight: bold;
}
.title2 {
font-size: 16px;
font-weight: bold;
}
.ant-divider-horizontal {
display: flex;
clear: both;
width: 100%;
min-width: 100%;
margin: 3px 0 5px;
}
.tishi {
width: 100%;
font-size: 12px;
color: #fd8f02;
margin-top: -4px;
background: #fffbf2;
text-align: center;
padding: 6px 0;
}
.cardClass {
min-height: 200px;
}
.sznrClass {
line-height: 40px;
text-align: center;
}
.ant-card {
box-sizing: border-box;
margin: 0;
padding: 0;
color: rgb(0 0 0);
font-size: 14px;
font-variant: tabular-nums;
line-height: 1.5715;
list-style: none;
font-feature-settings: tnum;
position: relative;
border-radius: 5px;
border: 1px solid #f0f0f0;
background: #f7f7f7;
}
.ant-card:hover {
box-sizing: border-box;
box-shadow: 2px 2px 10px 1px #d4d4d4;
}
.ant-card-head {
min-height: 48px;
margin-bottom: -1px;
padding: 0 24px;
color: rgba(0, 0, 0, 0.85);
font-weight: 500;
font-size: 16px;
background: transparent;
border-bottom: 1px solid #dadada;
border-radius: 2px 2px 0 0;
}
.ellipsis {
overflow: hidden; /* 确保超出容器的内容被裁剪 */
white-space: nowrap; /* 确保文本在一行内显示 */
text-overflow: ellipsis; /* 超出部分显示省略号 */
}
.ellip-title {
display: flex;
justify-content: space-between;
align-items: flex-end;
margin-top: -10px;
}
.elli-title {
font-size: 16px;
font-weight: bold;
}
.ellip-word {
font-size: 12px;
color: #666666;
margin-right: 10px;
}
.ellip-word2 {
font-size: 12px;
color: #333;
font-weight: bold;
}
.zuanqu:hover {
cursor: pointer;
color: #18a689;
background: #eff6f4;
}
.data-suggest {
display: flex;
flex-direction: column;
text-align: center;
width: 25%;
margin-right: 5px;
padding: 8px 3px;
border-radius: 5px;
background: #f7f7f7;
margin-top: 10px;
}
.data-suggest span:nth-child(1) {
font-size: 16px;
font-weight: bold;
}
.data-suggest span:nth-child(2) {
font-size: 12px;
}
.work-img {
width: 100%;
display: flex;
justify-content: center;
margin-top: 80px;
margin-bottom: 30px;
}
.work-img-img {
width: 180px;
height: 139px;
}
.buttonClass {
background: #1ab394;
font-weight: 600;
color: #fff;
border-radius: 3px;
border: none;
}
.mar-right20 {
margin-right: 14px;
}
.button-zhta {
color: #666666;
cursor: pointer;
}
.button-zhta:hover {
cursor: pointer;
color: #18a689;
}
.sear-distance {
padding: 0 10px;
}
.ant-form-item {
box-sizing: border-box;
margin: 10px 0;
padding: 0;
color: rgba(0, 0, 0, 0.85);
font-size: 14px;
font-variant: tabular-nums;
line-height: 1.5715;
list-style: none;
font-feature-settings: tnum;
/* margin-bottom: 24px; */
vertical-align: top;
}
.bled-countenance {
color: #666;
}
.bled-countenance2 {
color: #999999;
font-size: 12px;
}
.region {
margin: 6px 12px;
padding-bottom: 20px;
background: #fff;
border-radius: 5px;
border: 1px solid #e6e6e6;
}
.region:hover {
margin: 6px 12px;
padding-bottom: 20px;
background: #fff;
border-radius: 5px;
border: 1px solid #e6e6e6;
box-shadow: 2px 2px 10px 1px #d4d4d4;
}
.region-title {
font-size: 16px;
color: #333;
height: 50px;
line-height: 50px;
border-bottom: 1px solid #e1e4eb;
margin-bottom: 20px;
display: flex;
}
.region-title-headline {
display: block;
width: 5px;
height: 16px;
background: #18a689;
border-radius: 6px;
margin-top: 18px;
margin-right: 20px;
}
.module-bg {
background: #fff;
border-radius: 6px;
border: 1px solid #e6e6e6;
}
.home-status {
color: #1ab394;
}
.home-status:hover {
color: #333;
}
.card-label {
background: #81cbbc;
border-radius: 4px;
color: #fff;
padding: 2px 6px;
}
.card-label2 {
background: #84c4fa;
border-radius: 4px;
color: #fff;
padding: 2px 6px;
}
.card-label3 {
background: #fabe84;
border-radius: 4px;
color: #fff;
padding: 2px 6px;
}
.zbClass {
margin-left: 15px;
}
.image-container {
padding: 10px;
width: 100%; /* 设置容器宽度 */
height: auto; /* 设置容器高度 */
overflow: hidden; /* 隐藏溢出的部分 */
display: flex;
align-items: center;
justify-content: center;
}
.rotated-image {
max-width: 100%; /* 最大宽度为容器宽度 */
max-height: 100%; /* 最大高度为容器高度 */
object-fit: contain; /* 保持图片内容不失真 */
transform: rotate(90deg); /* 假设图片已经旋转90度 */
}
</style>

View File

@ -0,0 +1,75 @@
<template>
<a-modal :title="title" style="top:0;" :width="width" :visible="visible" @ok="handleOk" :okButtonProps="{ class: { 'jee-hidden': disableSubmit } }" @cancel="handleCancel" cancelText="关闭">
<ZyKhclForm ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false"></ZyKhclForm>
</a-modal>
</template>
<script lang="ts" setup>
import { ref, nextTick, defineExpose } from 'vue';
import ZyKhclForm from './ZyKhclForm.vue'
const title = ref<string>('');
const width = ref<string>('80%');
const visible = ref<boolean>(false);
const disableSubmit = ref<boolean>(false);
const registerForm = ref();
const emit = defineEmits(['register', 'success']);
/**
* 新增
*/
function add() {
title.value = '新增';
visible.value = true;
nextTick(() => {
registerForm.value.add();
});
}
/**
* 编辑
* @param record
*/
function edit(record) {
title.value = disableSubmit.value ? '详情' : '编辑';
visible.value = true;
nextTick(() => {
registerForm.value.edit(record);
});
}
/**
* 确定按钮点击事件
*/
function handleOk() {
registerForm.value.submitForm();
}
/**
* form保存回调事件
*/
function submitCallback() {
handleCancel();
emit('success');
}
/**
* 取消按钮回调事件
*/
function handleCancel() {
visible.value = false;
}
defineExpose({
add,
edit,
disableSubmit,
});
</script>
<style>
/**隐藏样式-modal确定按钮 */
.jee-hidden {
display: none !important;
}
</style>

View File

@ -296,49 +296,49 @@ function edit(record) {
handleKcnr(formData.kcnr);
// const parts = record.stuFilePath.split('.');
// const filetype = parts[parts.length - 1];
// console.log(`🚀 ~ nextTick ~ filetype:`, filetype)
// let wpsType = "w";
// if(filetype=='doc' || filetype=='docx'){
// showType.value = '1';
// wpsType = "w";
// }else if(filetype=='pdf'){
// showType.value = '1';
// wpsType = "f";
// }else if(filetype=='ppt' || filetype=='pptx' ){
// showType.value = '1';
// wpsType = "p";
// }else if(filetype=='xls' || filetype=='xlsx' ){
// showType.value = '1';
// wpsType = "s";
// }
const parts = record.stuFilePath.split('.');
const filetype = parts[parts.length - 1];
console.log(`🚀 ~ nextTick ~ filetype:`, filetype)
let wpsType = "w";
if(filetype=='doc' || filetype=='docx'){
showType.value = '1';
wpsType = "w";
}else if(filetype=='pdf'){
showType.value = '1';
wpsType = "f";
}else if(filetype=='ppt' || filetype=='pptx' ){
showType.value = '1';
wpsType = "p";
}else if(filetype=='xls' || filetype=='xlsx' ){
showType.value = '1';
wpsType = "s";
}
// if(showType.value == '1'){
// const element = document.getElementById('wpsiframeid');
// //
// element.innerHTML = '';
// const jssdk = WebOfficeSDK.init({
// officeType: wpsType,
// appId: 'SX20241118WSUGQN',
// fileId: formData.stuId,
// mount:document.querySelector('.wps-iframe'),
// commonOptions: {
// isShowDocMap: false, //
// isShowTopArea: false, //
// isShowHeader: false, //
// isBrowserViewFullscreen: true, //
// isIframeViewFullscreen: true, // iframe
// acceptVisualViewportResizeEvent: true // WebOffice VisualViewport
// },
// wordOptions: {
// isShowDocMap: false, //
// isBestScale: true, //
// isShowBottomStatusBar: false, //
// }
// //token: getToken()
// })
// }
if(showType.value == '1'){
const element = document.getElementById('wpsiframeid');
//
element.innerHTML = '';
const jssdk = WebOfficeSDK.init({
officeType: wpsType,
appId: 'SX20241118WSUGQN',
fileId: formData.stuId,
mount:document.querySelector('.wps-iframe'),
commonOptions: {
isShowDocMap: false, //
isShowTopArea: false, //
isShowHeader: false, //
isBrowserViewFullscreen: true, //
isIframeViewFullscreen: true, // iframe
acceptVisualViewportResizeEvent: true // WebOffice VisualViewport
},
wordOptions: {
isShowDocMap: false, //
isBestScale: true, //
isShowBottomStatusBar: false, //
}
//token: getToken()
})
}
});
}

View File

@ -167,6 +167,28 @@ export const newcolumns: BasicColumn[] = [
// },
];
//列表数据
export const newKhclColumns: BasicColumn[] = [
{
title: '学生姓名',
align: "center",
dataIndex: 'studentName',
},
{
title: '学生学号',
align: "center",
dataIndex: 'createBy',
},
{
title: '最终得分',
align: "center",
dataIndex: 'zzdf',
},
];
//列表数据
export const columnsStu: BasicColumn[] = [
{

View File

@ -3,10 +3,10 @@
<a-form ref="formRef" class="antd-modal-form" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-row>
<a-col :span="12">
<div v-if="showType=='1'">
<iframe id="pdfPreviewIframe" :src="ylurl" frameborder="0" width="100%" height="550px" scrolling="auto"></iframe>
<div v-show="showType=='1'">
<div class="wps-iframe" id="wpsiframeid" style="width:100%;height: 500px;"></div>
</div>
<div v-else-if="showType=='2'">
<div v-if="showType=='2'">
<div style="padding: 10px 20px;">
<a-button type="primary" @click="rotateImage">顺时针旋转</a-button>
<a-button type="primary" @click="rotateImage2" style="margin-left: 20px;">逆时针旋转</a-button>
@ -16,7 +16,7 @@
<img :src="ylurl" :style="{ transform: 'rotate(' + rotationAngle + 'deg)' }" class="rotated-image"/>
</div>
</div>
<div v-else-if="showType=='3'">
<div v-if="showType=='3'">
<div class="video-container">
<video
ref="videoPlayer"
@ -29,9 +29,9 @@
</video>
</div>
</div>
<div v-else>
<!-- <div v-else>
<a-button type="primary">下载文件</a-button>
</div>
</div> -->
</a-col>
<a-col :span="12">
<a-row>
@ -86,6 +86,7 @@
import { useGlobSetting } from '/@/hooks/setting';
import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
import { getToken } from '/@/utils/auth';
import WebOfficeSDK from './wpsApi/web-office-sdk-solution-v2.0.7.es'
const props = defineProps({
formDisabled: { type: Boolean, default: false },
@ -105,7 +106,7 @@ import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 5 } });
const wrapperCol = ref<any>({ xs: { span: 24 }, sm: { span: 16 } });
const confirmLoading = ref<boolean>(false);
const showType = ref<string>('0');
const showType = ref<string>('1');
const ylurl = ref<string>('');
const rotationAngle = ref(0);
const zyInfo = ref<any>({});
@ -118,6 +119,7 @@ const videoOpen = ref<boolean>(false);
const autoplay = ref(false)
const loop = ref(false);
const videoUrl = ref<String>('');
const jssdkInfo = ref<any>({});
//
@ -182,6 +184,7 @@ function rotateImage2() {
* 编辑
*/
function edit(record) {
showType.value = '1';
formData.pyContent = ''
nextTick(() => {
resetFields();
@ -193,33 +196,69 @@ function rotateImage2() {
const parts = record.filePath.split('.');
const filetype = parts[parts.length - 1];
console.log(`🚀 ~ nextTick ~ filetype:`, filetype)
var file = getFileAccessHttpUrl(record.filePath);
ylurl.value = file;
// var file = getFileAccessHttpUrl(record.filePath);
// ylurl.value = file;
let wpsType = "w";
if(filetype=='jpg' || filetype=='png' || filetype=='jpeg' || filetype=='xls' || filetype=='xlsx' || filetype=='text' ){
showType.value = '2';
}else if(filetype=='doc' || filetype=='docx' || filetype=='pdf'){
var file = getFileAccessHttpUrl(record.filePath);
ylurl.value = file;
}else if(filetype=='doc' || filetype=='docx'){
showType.value = '1';
var file2 = getFileAccessHttpUrl(record.pdfPath);
let url2 = baseApiUrl + '/generic/web/viewer.html?file=' + encodeURIComponent(file2);
ylurl.value = url2;
wpsType = "w";
}else if(filetype=='pdf'){
showType.value = '1';
wpsType = "f";
}else if(filetype=='ppt' || filetype=='pptx' ){
showType.value = '1';
wpsType = "p";
}else if(filetype=='xls' || filetype=='xlsx' ){
showType.value = '1';
wpsType = "s";
}else if(filetype=='mp4'|| filetype=='avi'|| filetype=='mp3'|| filetype=='wav'){
showType.value = '3';
let url = getFileAccessHttpUrl(record.filePath);
console.log('视频预览-----》',url);
// videoOpen.value = true;
videoUrl.value = url;
}else{
showType.value = '0';
}
//
Object.assign(formData, record);
// formData.id = '1858776554910433282';
console.log("🚀 ~ nextTick ~ formData.id:", formData.id)
if(showType.value == '1'){//
const element = document.getElementById('wpsiframeid');
//
element.innerHTML = '';
const jssdk = WebOfficeSDK.init({
officeType: wpsType,
appId: 'SX20241118WSUGQN',
fileId: formData.id,
mount:document.querySelector('.wps-iframe'),
commonOptions: {
isShowDocMap: false, //
// isShowTopArea: false, //
// isShowHeader: false, //
isBrowserViewFullscreen: true, //
isIframeViewFullscreen: true, // iframe
acceptVisualViewportResizeEvent: true // WebOffice VisualViewport
},
wordOptions: {
isShowDocMap: false, //
isBestScale: true, //
isShowBottomStatusBar: false, //
}
//token: getToken()
})
}
});
}
// --------------------------------------------------------
const playVideo = () => {
videoPlayer.value.play();