修改bug
This commit is contained in:
parent
ea5c0f5689
commit
2a4f3b5b07
2
.env
2
.env
|
|
@ -2,7 +2,7 @@
|
||||||
VITE_PORT = 3100
|
VITE_PORT = 3100
|
||||||
|
|
||||||
# 网站标题 //课程信息中心
|
# 网站标题 //课程信息中心
|
||||||
VITE_GLOB_APP_TITLE = 东师课程信息中心
|
VITE_GLOB_APP_TITLE = 智慧教学服务中心
|
||||||
|
|
||||||
# 简称，用于配置文件名字 不要出现空格、数字开头等特殊字符
|
# 简称，用于配置文件名字 不要出现空格、数字开头等特殊字符
|
||||||
VITE_GLOB_APP_SHORT_NAME = CourseInformationCenter
|
VITE_GLOB_APP_SHORT_NAME = CourseInformationCenter
|
||||||
|
|
|
||||||
|
|
@ -36,6 +36,7 @@
|
||||||
:filterOption="handleFilterOption"
|
:filterOption="handleFilterOption"
|
||||||
:getPopupContainer="getPopupContainer"
|
:getPopupContainer="getPopupContainer"
|
||||||
@change="handleChange"
|
@change="handleChange"
|
||||||
|
style="width:100%;"
|
||||||
>
|
>
|
||||||
<a-select-option v-if="showChooseOption" :value="null">请选择…</a-select-option>
|
<a-select-option v-if="showChooseOption" :value="null">请选择…</a-select-option>
|
||||||
<template v-for="item in dictOptions" :key="`${item.value}`">
|
<template v-for="item in dictOptions" :key="`${item.value}`">
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,93 @@
|
||||||
|
import {defHttp} from '/@/utils/http/axios';
|
||||||
|
import { useMessage } from "/@/hooks/web/useMessage";
|
||||||
|
|
||||||
|
const { createConfirm } = useMessage();
|
||||||
|
|
||||||
|
enum Api {
|
||||||
|
list = '/zyJxdgBanben/zyJxdgBanben/list',
|
||||||
|
save='/zyJxdgBanben/zyJxdgBanben/add',
|
||||||
|
edit='/zyJxdgBanben/zyJxdgBanben/edit',
|
||||||
|
save2='/zyJxdgTeacherMain/zyJxdgTeacherMain/addMap',
|
||||||
|
edit2='/zyJxdgTeacherMain/zyJxdgTeacherMain/editMap',
|
||||||
|
deleteOne = '/zyJxdgBanben/zyJxdgBanben/delete',
|
||||||
|
deleteBatch = '/zyJxdgBanben/zyJxdgBanben/deleteBatch',
|
||||||
|
importExcel = '/zyJxdgBanben/zyJxdgBanben/importExcel',
|
||||||
|
exportXls = '/zyJxdgBanben/zyJxdgBanben/exportXls',
|
||||||
|
queryDataById = '/zyJxdgBanben/zyJxdgBanben/queryById',
|
||||||
|
queryDataById2 = '/zyJxdgTeacherMain/zyJxdgTeacherMain/queryByRwbh',
|
||||||
|
queryZyJxdgMainListByMainId2 = '/zyJxdgTeacherMain/zyJxdgTeacherMain/queryByRwbhList',
|
||||||
|
zyJxdgMainList = '/zyJxdgBanben/zyJxdgBanben/queryZyJxdgMainByMainId',
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 导出api
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const getExportUrl = Api.exportXls;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 导入api
|
||||||
|
*/
|
||||||
|
export const getImportUrl = Api.importExcel;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查询子表数据
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const queryZyJxdgMainListByMainId = (id) => defHttp.get({url: Api.zyJxdgMainList, params:{ id }});
|
||||||
|
export const queryZyJxdgMainListByMainId2 = (rwbh,teacherNo) => defHttp.get({url: Api.queryZyJxdgMainListByMainId2, params:{ rwbh,teacherNo }});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 列表接口
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const list = (params) =>
|
||||||
|
defHttp.get({url: Api.list, params});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 删除单个
|
||||||
|
*/
|
||||||
|
export const deleteOne = (params,handleSuccess) => {
|
||||||
|
return defHttp.delete({url: Api.deleteOne, params}, {joinParamsToUrl: true}).then(() => {
|
||||||
|
handleSuccess();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 批量删除
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const batchDelete = (params, handleSuccess) => {
|
||||||
|
createConfirm({
|
||||||
|
iconType: 'warning',
|
||||||
|
title: '确认删除',
|
||||||
|
content: '是否删除选中数据',
|
||||||
|
okText: '确认',
|
||||||
|
cancelText: '取消',
|
||||||
|
onOk: () => {
|
||||||
|
return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
|
||||||
|
handleSuccess();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 保存或者更新
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const saveOrUpdate = (params, isUpdate) => {
|
||||||
|
let url = isUpdate ? Api.edit : Api.save;
|
||||||
|
return defHttp.post({url: url, params});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
export const saveOrUpdate2 = (params, isUpdate) => {
|
||||||
|
let url = isUpdate ? Api.edit2 : Api.save2;
|
||||||
|
return defHttp.post({url: url, params});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 根据id查询数据
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const queryDataById = (id) => defHttp.get({url: Api.queryDataById, params:{ id }});
|
||||||
|
export const queryDataById2 = (params) => defHttp.get({url: Api.queryDataById2, params});
|
||||||
|
|
||||||
|
|
@ -0,0 +1,78 @@
|
||||||
|
import {BasicColumn} from '/@/components/Table';
|
||||||
|
import {FormSchema} from '/@/components/Table';
|
||||||
|
import { rules} from '/@/utils/helper/validator';
|
||||||
|
import { render } from '/@/utils/common/renderUtils';
|
||||||
|
import {JVxeTypes,JVxeColumn} from '/@/components/jeecg/JVxeTable/types'
|
||||||
|
//列表数据
|
||||||
|
export const columns: BasicColumn[] = [
|
||||||
|
{
|
||||||
|
title: '版本',
|
||||||
|
align:"center",
|
||||||
|
dataIndex: 'title'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '课程类型',
|
||||||
|
align:"center",
|
||||||
|
dataIndex: 'twoTitle_dictText'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '是否使用',
|
||||||
|
align:"center",
|
||||||
|
dataIndex: 'sfsy_dictText'
|
||||||
|
},
|
||||||
|
];
|
||||||
|
//查询数据
|
||||||
|
export const searchFormSchema: FormSchema[] = [
|
||||||
|
];
|
||||||
|
//表单数据
|
||||||
|
export const formSchema: FormSchema[] = [
|
||||||
|
{
|
||||||
|
label: '版本',
|
||||||
|
field: 'title',
|
||||||
|
component: 'Input',
|
||||||
|
dynamicRules: ({model,schema}) => {
|
||||||
|
return [
|
||||||
|
{ required: true, message: '请输入版本!'},
|
||||||
|
];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '是否使用',
|
||||||
|
field: 'sfsy',
|
||||||
|
component: 'JDictSelectTag',
|
||||||
|
componentProps:{
|
||||||
|
dictCode:""
|
||||||
|
},
|
||||||
|
dynamicRules: ({model,schema}) => {
|
||||||
|
return [
|
||||||
|
{ required: true, message: '请输入是否使用!'},
|
||||||
|
];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
// TODO 主键隐藏字段，目前写死为ID
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
field: 'id',
|
||||||
|
component: 'Input',
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
];
|
||||||
|
//子表单数据
|
||||||
|
//子表表格配置
|
||||||
|
export const zyJxdgMainColumns: JVxeColumn[] = [
|
||||||
|
{
|
||||||
|
title: '名称',
|
||||||
|
key: 'title',
|
||||||
|
type: JVxeTypes.input,
|
||||||
|
width:"200px",
|
||||||
|
placeholder: '请输入${title}',
|
||||||
|
defaultValue:'',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '类型 (1普通文本 2多行文本 3富文本 4表单 表格)',
|
||||||
|
key: 'type',
|
||||||
|
type: JVxeTypes.select,
|
||||||
|
options:[],
|
||||||
|
dictCode:"",
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
@ -0,0 +1,244 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<!--查询区域-->
|
||||||
|
<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-row>
|
||||||
|
</a-form>
|
||||||
|
</div>
|
||||||
|
<!--引用表格-->
|
||||||
|
<BasicTable @register="registerTable">
|
||||||
|
<!--插槽:table标题-->
|
||||||
|
<template #tableTitle>
|
||||||
|
<a-button type="primary" @click="handleAdd" preIcon="ant-design:plus-outlined"> 新增</a-button>
|
||||||
|
<!-- <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
|
||||||
|
<j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
|
||||||
|
<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 #htmlSlot="{text}">
|
||||||
|
<div v-html="text"></div>
|
||||||
|
</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>
|
||||||
|
<!-- 表单区域 -->
|
||||||
|
<ZyJxdgBanbenModal @register="registerModal" @success="handleSuccess"></ZyJxdgBanbenModal>
|
||||||
|
<ZyJxdgBanbenDetailModal @register="ZyJxdgBanbenModalDetail"></ZyJxdgBanbenDetailModal>
|
||||||
|
<ZyJxdgBanbenEditModal @register="ZyJxdgBanbenModalEdit"></ZyJxdgBanbenEditModal>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" name="zyJxdgBanben-zyJxdgBanben" setup>
|
||||||
|
import {ref, reactive, computed, unref} from 'vue';
|
||||||
|
import {BasicTable, useTable, TableAction} from '/@/components/Table';
|
||||||
|
import { useListPage } from '/@/hooks/system/useListPage'
|
||||||
|
import {useModal} from '/@/components/Modal';
|
||||||
|
import ZyJxdgBanbenModal from './components/ZyJxdgBanbenModal.vue'
|
||||||
|
import ZyJxdgBanbenEditModal from '/@/views/kc/zyJxdgBanben/components/ZyJxdgBanbenEditModal.vue'
|
||||||
|
import ZyJxdgBanbenDetailModal from '/@/views/kc/zyJxdgBanben/components/ZyJxdgBanbenDetailModal.vue'
|
||||||
|
import {columns, searchFormSchema} from './ZyJxdgBanben.data';
|
||||||
|
import {list, deleteOne, batchDelete, getImportUrl,getExportUrl} from './ZyJxdgBanben.api';
|
||||||
|
import {downloadFile} from '/@/utils/common/renderUtils';
|
||||||
|
import { getAreaTextByCode } from '/@/components/Form/src/utils/Area';
|
||||||
|
|
||||||
|
const checkedKeys = ref<Array<string | number>>([]);
|
||||||
|
// const ZyJxdgBanbenModalDetail = ref();
|
||||||
|
//注册model
|
||||||
|
// const [ZyJxdgBanbenModalDetail, {openModal:handleView}] = useModal();
|
||||||
|
const [registerModal, {openModal}] = useModal();
|
||||||
|
const [ZyJxdgBanbenModalDetail, { openModal: openModal4 }] = useModal();
|
||||||
|
const [ZyJxdgBanbenModalEdit, { openModal: openModal3 }] = useModal();
|
||||||
|
// const [ZyJxdgBanbenModalDetail] = useModal();
|
||||||
|
// const [registerModal] = useModal();
|
||||||
|
//注册table数据
|
||||||
|
const { prefixCls,tableContext,onExportXls,onImportXls } = useListPage({
|
||||||
|
tableProps:{
|
||||||
|
title: '教学大纲版本配置',
|
||||||
|
api: list,
|
||||||
|
columns,
|
||||||
|
canResize:false,
|
||||||
|
useSearchForm: false,
|
||||||
|
actionColumn: {
|
||||||
|
width: 220,
|
||||||
|
fixed:'right'
|
||||||
|
},
|
||||||
|
beforeFetch: (params) => {
|
||||||
|
return Object.assign(params, queryParam.value);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
exportConfig: {
|
||||||
|
name:"教学大纲版本配置",
|
||||||
|
url: getExportUrl,
|
||||||
|
},
|
||||||
|
importConfig: {
|
||||||
|
url: getImportUrl,
|
||||||
|
success: handleSuccess
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 新增事件
|
||||||
|
*/
|
||||||
|
function handleAdd() {
|
||||||
|
openModal(true, {
|
||||||
|
isUpdate: false,
|
||||||
|
showFooter: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 编辑事件
|
||||||
|
*/
|
||||||
|
function handleEdit(record: Recordable) {
|
||||||
|
openModal(true, {
|
||||||
|
record,
|
||||||
|
isUpdate: true,
|
||||||
|
showFooter: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 详情
|
||||||
|
*/
|
||||||
|
function handleDetail(record: Recordable) {
|
||||||
|
openModal4(true, {
|
||||||
|
record,
|
||||||
|
isUpdate: true,
|
||||||
|
showFooter: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleTianxie(record) {
|
||||||
|
openModal3(true, {
|
||||||
|
record,
|
||||||
|
isUpdate: true,
|
||||||
|
showFooter: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 删除事件
|
||||||
|
*/
|
||||||
|
async function handleDelete(record) {
|
||||||
|
await deleteOne({id: record.id}, handleSuccess);
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 批量删除事件
|
||||||
|
*/
|
||||||
|
async function batchHandleDelete() {
|
||||||
|
await batchDelete({ids: selectedRowKeys.value},handleSuccess);
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 成功回调
|
||||||
|
*/
|
||||||
|
function handleSuccess() {
|
||||||
|
(selectedRowKeys.value = []) && reload();
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 操作栏
|
||||||
|
*/
|
||||||
|
function getTableAction(record){
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
label: '编辑',
|
||||||
|
onClick: handleEdit.bind(null, record),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '填写',
|
||||||
|
onClick: handleTianxie.bind(null, record),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '详情',
|
||||||
|
onClick: handleDetail.bind(null, record),
|
||||||
|
}, {
|
||||||
|
label: '删除',
|
||||||
|
popConfirm: {
|
||||||
|
title: '是否确认删除',
|
||||||
|
confirm: handleDelete.bind(null, record),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 下拉操作栏
|
||||||
|
*/
|
||||||
|
function getDropDownAction(record){
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
label: '详情',
|
||||||
|
onClick: handleDetail.bind(null, record),
|
||||||
|
}, {
|
||||||
|
label: '删除',
|
||||||
|
popConfirm: {
|
||||||
|
title: '是否确认删除',
|
||||||
|
confirm: handleDelete.bind(null, record),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/* ----------------------以下为原生查询需要添加的-------------------------- */
|
||||||
|
const queryParam = ref<any>({});
|
||||||
|
const toggleSearchStatus = ref<boolean>(false);
|
||||||
|
const labelCol = reactive({
|
||||||
|
xs: { span: 24 },
|
||||||
|
sm: { span: 7 },
|
||||||
|
});
|
||||||
|
const wrapperCol = reactive({
|
||||||
|
xs: { span: 24 },
|
||||||
|
sm: { span: 16 },
|
||||||
|
});
|
||||||
|
/**
|
||||||
|
* 重置
|
||||||
|
*/
|
||||||
|
function searchReset() {
|
||||||
|
queryParam.value = {};
|
||||||
|
selectedRowKeys.value = [];
|
||||||
|
//刷新数据
|
||||||
|
reload();
|
||||||
|
}
|
||||||
|
|
||||||
|
</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>
|
||||||
|
|
@ -0,0 +1,456 @@
|
||||||
|
<template>
|
||||||
|
<a-spin :spinning="loading">
|
||||||
|
<!-- <a-form v-bind="formItemLayout">
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="版本" v-bind="validateInfos.title">
|
||||||
|
{{ formData.title }}
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="课程类型" v-bind="validateInfos.twoTitle"> （{{ oldInfo.twoTitle_dictText }}） </a-form-item>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-form> -->
|
||||||
|
<!--
|
||||||
|
单行文本 1
|
||||||
|
多行文本 2
|
||||||
|
富文本 3
|
||||||
|
固定表单（基础信息） 4
|
||||||
|
关联表格 5
|
||||||
|
自增单行文本 6
|
||||||
|
自增富文本 7
|
||||||
|
自增多行文本 8
|
||||||
|
自增表格 9
|
||||||
|
-->
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="24" v-for="(item, index) in zyJxdgMainTable.dataSource" :key="index">
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="24">
|
||||||
|
<span class="title">{{ item.title }}</span>
|
||||||
|
</a-col>
|
||||||
|
<!-- 单行文本 1 -->
|
||||||
|
<a-col v-if="item.type === '1'" :span="24">
|
||||||
|
<a-input placeholder="请输入内容" v-model:value="item.content" style="width: 100%"></a-input>
|
||||||
|
</a-col>
|
||||||
|
<!-- 多行文本 2 -->
|
||||||
|
<a-col v-else-if="item.type === '2'" :span="24">
|
||||||
|
<a-textarea placeholder="请输入内容" v-model:value="item.content" style="width: 100%"></a-textarea>
|
||||||
|
</a-col>
|
||||||
|
<!-- 富文本 3 -->
|
||||||
|
<a-col v-else-if="item.type === '3'" :span="24">
|
||||||
|
<j-editor placeholder="请输入内容" v-model:value="item.content" :disabled="disabled" />
|
||||||
|
</a-col>
|
||||||
|
<!-- 固定表单（基础信息） 4 -->
|
||||||
|
<a-col v-else-if="item.type === '4'" v-model:value="item.content" :span="24">
|
||||||
|
<a-form v-bind="formItemLayout">
|
||||||
|
<a-row>
|
||||||
|
<a-col v-for="(item2, index2) in item.zyJxdgPzxxList" :key="index2" :span="12">
|
||||||
|
<a-form-item :label="item2.title"><a-input :placeholder="`请输入` + item2.title" v-model:value="item2.content" /></a-form-item>
|
||||||
|
<!-- {{ item2.title }}:<a-input placeholder="请输入内容" style="width:60%;"></a-input> -->
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-form>
|
||||||
|
</a-col>
|
||||||
|
<!-- 自增表格 5 -->
|
||||||
|
<a-col v-else-if="item.type === '5'" :span="24">
|
||||||
|
<a-table :columns="getTableColumns(item.zyJxdgPzxxList)" :dataSource="item.list" :pagination="false">
|
||||||
|
<template #bodyCell="{ column, record }">
|
||||||
|
<a-input placeholder="请输入内容" v-model:value="record[column.key]" style="width: 80%"></a-input>
|
||||||
|
<!-- <template v-if="column.key === 'name'">
|
||||||
|
</template> -->
|
||||||
|
</template>
|
||||||
|
</a-table>
|
||||||
|
</a-col>
|
||||||
|
<!-- 自增单行文本 6 -->
|
||||||
|
<a-col v-else-if="item.type === '6'" :span="24">
|
||||||
|
<a-row>
|
||||||
|
<a-col>
|
||||||
|
<a-button type="primary" @click="handleDhwb(item)">添加</a-button>
|
||||||
|
</a-col>
|
||||||
|
<a-col v-for="(item2, index2) in item.list" :key="index2">
|
||||||
|
<a-input placeholder="请输入内容" v-model:value="item2.title" style="width: 80%" @blur="handleGlxm(item)"></a-input>
|
||||||
|
<a-button type="danger" @click="handleDhwbDel(item, index2)">删除</a-button>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-col>
|
||||||
|
<!-- 自增富文本 7 -->
|
||||||
|
<a-col v-else-if="item.type === '7'" :span="24">
|
||||||
|
<a-row>
|
||||||
|
<a-col>
|
||||||
|
<a-button type="primary" @click="handleDhfwb(item)">添加</a-button>
|
||||||
|
</a-col>
|
||||||
|
<a-col v-for="(item2, index2) in item.list" :key="index2">
|
||||||
|
<j-editor placeholder="请输入内容" v-model:value="item2.title" :disabled="disabled" style="width: 500px; height: 200px" />
|
||||||
|
<a-button type="danger" @click="handleDhfwbDel(item, index2)">删除</a-button>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-col>
|
||||||
|
<!-- 自增多行文本 8 -->
|
||||||
|
<a-col v-else-if="item.type === '8'" :span="24">
|
||||||
|
<a-row>
|
||||||
|
<a-col>
|
||||||
|
<a-button type="primary" @click="handleDhwbArea(item)">添加</a-button>
|
||||||
|
</a-col>
|
||||||
|
<a-col v-for="(item2, index2) in item.list" :key="index2">
|
||||||
|
<a-textarea placeholder="请输入内容" v-model:value="item2.title" :disabled="disabled" />
|
||||||
|
<a-button type="danger" @click="handleDhwbAreaDel(item, index2)">删除</a-button>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-col>
|
||||||
|
|
||||||
|
<!-- 自增表格 9 -->
|
||||||
|
<a-col v-else-if="item.type === '9'" :span="24">
|
||||||
|
<div><a-button type="primary" @click="handleZzbg(item)">新增</a-button> </div>
|
||||||
|
<a-table :columns="getTableZzColumns(item.zyJxdgPzxxList)" :dataSource="item.list" :pagination="false">
|
||||||
|
<template #bodyCell="{ column, record }">
|
||||||
|
<template v-if="column.key === 'action'">
|
||||||
|
<a-button type="danger" @click="handleZzbgDel(item.list, record.sort)">删除</a-button>
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
<a-input placeholder="请输入内容" v-model:value="record[column.key]" style="width: 100%"></a-input>
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</a-table>
|
||||||
|
</a-col>
|
||||||
|
|
||||||
|
<a-col v-else> </a-col>
|
||||||
|
|
||||||
|
<a-col :span="24">
|
||||||
|
<span class="tishi">
|
||||||
|
{{ item.tsy }}
|
||||||
|
</span>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-spin>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent, ref, reactive, computed, toRaw, onMounted } from 'vue';
|
||||||
|
import { defHttp } from '/@/utils/http/axios';
|
||||||
|
import { useValidateAntFormAndTable } from '/@/hooks/system/useJvxeMethods';
|
||||||
|
import { queryZyJxdgMainListByMainId, queryZyJxdgMainListByMainId2, saveOrUpdate2,queryDataById2 } from '../ZyJxdgBanben.api';
|
||||||
|
import { JVxeTable } from '/@/components/jeecg/JVxeTable';
|
||||||
|
import { zyJxdgMainColumns } from '../ZyJxdgBanben.data';
|
||||||
|
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
|
||||||
|
import { Form } from 'ant-design-vue';
|
||||||
|
import JEditor from '/@/components/Form/src/jeecg/components/JEditor.vue';
|
||||||
|
|
||||||
|
const useForm = Form.useForm;
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
name: 'ZyJxdgBanbenForm',
|
||||||
|
components: {
|
||||||
|
JDictSelectTag,
|
||||||
|
JVxeTable,
|
||||||
|
JEditor,
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
formDisabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
formData: { type: Object, default: () => {} },
|
||||||
|
formBpm: { type: Boolean, default: true },
|
||||||
|
},
|
||||||
|
emits: ['success'],
|
||||||
|
setup(props, { emit }) {
|
||||||
|
const loading = ref(false);
|
||||||
|
const zyJxdgMainTableRef = ref();
|
||||||
|
const oldInfo = ref({});
|
||||||
|
const zyJxdgMainTable = reactive<Record<string, any>>({
|
||||||
|
loading: false,
|
||||||
|
columns: zyJxdgMainColumns,
|
||||||
|
dataSource: [],
|
||||||
|
});
|
||||||
|
const activeKey = ref('zyJxdgMain');
|
||||||
|
const formData = reactive<Record<string, any>>({
|
||||||
|
id: '',
|
||||||
|
title: '',
|
||||||
|
twoTitle: '',
|
||||||
|
sfsy: '',
|
||||||
|
});
|
||||||
|
|
||||||
|
//表单验证
|
||||||
|
const validatorRules = reactive({});
|
||||||
|
const { resetFields, validate, validateInfos } = useForm(formData, validatorRules, { immediate: true });
|
||||||
|
const dbData = {};
|
||||||
|
const formItemLayout = {
|
||||||
|
labelCol: { xs: { span: 24 }, sm: { span: 8 } },
|
||||||
|
wrapperCol: { xs: { span: 24 }, sm: { span: 13 } },
|
||||||
|
};
|
||||||
|
const columns = [];
|
||||||
|
|
||||||
|
// 表单禁用
|
||||||
|
const disabled = computed(() => {
|
||||||
|
if (props.formBpm === true) {
|
||||||
|
if (props.formData.disabled === false) {
|
||||||
|
return false;
|
||||||
|
} else {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return props.formDisabled;
|
||||||
|
});
|
||||||
|
|
||||||
|
function add() {
|
||||||
|
resetFields();
|
||||||
|
zyJxdgMainTable.dataSource = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
async function edit(row) {
|
||||||
|
oldInfo.value = row;
|
||||||
|
row.rwbh = '202320242000629';
|
||||||
|
row.teacherNo = '2002900106';
|
||||||
|
//主表数据
|
||||||
|
await queryMainData(row);
|
||||||
|
//子表数据
|
||||||
|
const zyJxdgMainDataList = await queryZyJxdgMainListByMainId2(row['rwbh'], row['teacherNo']);
|
||||||
|
console.log('💁♀️', zyJxdgMainDataList);
|
||||||
|
zyJxdgMainTable.dataSource = [...zyJxdgMainDataList];
|
||||||
|
}
|
||||||
|
|
||||||
|
async function queryMainData(record) {
|
||||||
|
const row = await queryDataById2(record);
|
||||||
|
Object.keys(row).map((k) => {
|
||||||
|
formData[k] = row[k];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const { getSubFormAndTableData, transformData } = useValidateAntFormAndTable(activeKey, {
|
||||||
|
zyJxdgMain: zyJxdgMainTableRef,
|
||||||
|
});
|
||||||
|
|
||||||
|
async function getFormData() {
|
||||||
|
await validate();
|
||||||
|
return transformData(toRaw(formData));
|
||||||
|
}
|
||||||
|
|
||||||
|
async function submitForm() {
|
||||||
|
const alllist = zyJxdgMainTable.dataSource;
|
||||||
|
console.log('✋', alllist);
|
||||||
|
|
||||||
|
var values = {
|
||||||
|
id: '',
|
||||||
|
rwbh: '',
|
||||||
|
banbenId: '',
|
||||||
|
teacherNo: '',
|
||||||
|
sffb: '',
|
||||||
|
list: alllist,
|
||||||
|
};
|
||||||
|
const mainData = await getFormData();
|
||||||
|
values = mainData;
|
||||||
|
values.list = alllist;
|
||||||
|
// const subData = zyJxdgMainTable.dataSource;
|
||||||
|
// const values = Object.assign({}, dbData, mainData);
|
||||||
|
// values.zyJxdgMainList = subData;
|
||||||
|
console.log('表单提交数据', values);
|
||||||
|
const isUpdate = values.id ? true : false;
|
||||||
|
await saveOrUpdate2(values, isUpdate);
|
||||||
|
//关闭弹窗
|
||||||
|
emit('success');
|
||||||
|
}
|
||||||
|
|
||||||
|
function setFieldsValue(values) {
|
||||||
|
if (values) {
|
||||||
|
Object.keys(values).map((k) => {
|
||||||
|
formData[k] = values[k];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 值改变事件触发-树控件回调
|
||||||
|
* @param key
|
||||||
|
* @param value
|
||||||
|
*/
|
||||||
|
function handleFormChange(key, value) {
|
||||||
|
formData[key] = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
//新增单行文本
|
||||||
|
function handleDhwb(item) {
|
||||||
|
item.list = item.list || [];
|
||||||
|
item.list.push({
|
||||||
|
title: '',
|
||||||
|
sort: item.list.length + 1,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//删除单行文本
|
||||||
|
function handleDhwbDel(item, index) {
|
||||||
|
item.list.splice(index, 1);
|
||||||
|
for (var i = 0; i < item.list.length; i++) {
|
||||||
|
item.list[i].sort = i;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//新增多行富文本
|
||||||
|
function handleDhfwb(item) {
|
||||||
|
item.list = item.list || [];
|
||||||
|
item.list.push({
|
||||||
|
title: '',
|
||||||
|
sort: item.list.length + 1,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//删除多行富文本
|
||||||
|
function handleDhfwbDel(item, index) {
|
||||||
|
item.list.splice(index, 1);
|
||||||
|
for (var i = 0; i < item.list.length; i++) {
|
||||||
|
item.list[i].sort = i;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//新增多行富文本
|
||||||
|
function handleDhwbArea(item) {
|
||||||
|
item.list = item.list || [];
|
||||||
|
item.list.push({
|
||||||
|
title: '',
|
||||||
|
sort: item.list.length + 1,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//删除多行富文本
|
||||||
|
function handleDhwbAreaDel(item, index) {
|
||||||
|
item.list.splice(index, 1);
|
||||||
|
for (var i = 0; i < item.list.length; i++) {
|
||||||
|
item.list[i].sort = i;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//新增自增表格
|
||||||
|
function handleZzbg(item) {
|
||||||
|
item.list = item.list || [];
|
||||||
|
item.list.push({
|
||||||
|
title: '',
|
||||||
|
sort: item.list.length,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//删除自增表格
|
||||||
|
function handleZzbgDel(list, record) {
|
||||||
|
console.log('😁', list, record);
|
||||||
|
list.splice(record, 1);
|
||||||
|
for (var i = 0; i < list.length; i++) {
|
||||||
|
list[i].sort = i;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//获取列表列表头
|
||||||
|
function getTableColumns(list) {
|
||||||
|
let columns = reactive<any>([]);
|
||||||
|
for (var i = 0; i < list.length; i++) {
|
||||||
|
var par = list[i];
|
||||||
|
var inePar = {
|
||||||
|
title: par.title,
|
||||||
|
dataIndex: par.id,
|
||||||
|
key: par.id,
|
||||||
|
};
|
||||||
|
columns.push(inePar);
|
||||||
|
}
|
||||||
|
return columns;
|
||||||
|
}
|
||||||
|
|
||||||
|
//获取自增列表列表头
|
||||||
|
function getTableZzColumns(list) {
|
||||||
|
let columns = reactive<any>([]);
|
||||||
|
for (var i = 0; i < list.length; i++) {
|
||||||
|
var par = list[i];
|
||||||
|
var inePar = {
|
||||||
|
title: par.title,
|
||||||
|
dataIndex: par.id,
|
||||||
|
key: par.id,
|
||||||
|
};
|
||||||
|
columns.push(inePar);
|
||||||
|
}
|
||||||
|
var inePar2 = {
|
||||||
|
title: '操作',
|
||||||
|
dataIndex: 'action',
|
||||||
|
key: 'action',
|
||||||
|
};
|
||||||
|
columns.push(inePar2);
|
||||||
|
return columns;
|
||||||
|
}
|
||||||
|
//关联项目计算方法
|
||||||
|
function handleGlxm(item) {
|
||||||
|
console.log('👩🍳', item);
|
||||||
|
var sfsglxm = item.sfsglxm;
|
||||||
|
if (sfsglxm == '1') {
|
||||||
|
//判断是否是关联项目
|
||||||
|
var list1 = item.list; //课程目标集合
|
||||||
|
if (list1 != null) {
|
||||||
|
//关联项目是否有值
|
||||||
|
var sort = item.sort; //第几个关联项目
|
||||||
|
var alllist = zyJxdgMainTable.dataSource; //获取全部的数据
|
||||||
|
for (var j = 0; j < alllist.length; j++) {
|
||||||
|
for (var i = 0; i < list1.length; i++) {
|
||||||
|
var item1 = list1[i];
|
||||||
|
var title = item1.title; //具体信息
|
||||||
|
var item2 = alllist[j]; //具体数据
|
||||||
|
item2.list = item2.list || [];
|
||||||
|
if (item2.guanlian == sort) {
|
||||||
|
//关联项目等于当前数据
|
||||||
|
if (i == 0) {
|
||||||
|
//判断第一回将原来的清空重新赋值
|
||||||
|
item2.list = [];
|
||||||
|
}
|
||||||
|
//判断当前项是否等于关联项
|
||||||
|
var item3 = item2.zyJxdgPzxxList;
|
||||||
|
if (item3 != null && item3.length > 0) {
|
||||||
|
item2.list.push({ [item3[0].id]: title });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
zyJxdgMainTableRef,
|
||||||
|
zyJxdgMainTable,
|
||||||
|
validatorRules,
|
||||||
|
validateInfos,
|
||||||
|
activeKey,
|
||||||
|
loading,
|
||||||
|
formData,
|
||||||
|
oldInfo,
|
||||||
|
setFieldsValue,
|
||||||
|
handleFormChange,
|
||||||
|
formItemLayout,
|
||||||
|
disabled,
|
||||||
|
getFormData,
|
||||||
|
submitForm,
|
||||||
|
add,
|
||||||
|
edit,
|
||||||
|
getTableColumns,
|
||||||
|
getTableZzColumns,
|
||||||
|
columns,
|
||||||
|
handleDhwb,
|
||||||
|
handleDhwbDel,
|
||||||
|
handleDhfwb,
|
||||||
|
handleDhfwbDel,
|
||||||
|
handleDhwbArea,
|
||||||
|
handleDhwbAreaDel,
|
||||||
|
handleGlxm,
|
||||||
|
handleZzbg,
|
||||||
|
handleZzbgDel,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<style scoped lang="less" >
|
||||||
|
.title {
|
||||||
|
margin-left: 20px;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.tishi {
|
||||||
|
width: 100%;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #fd8f02;
|
||||||
|
margin-top: -4px;
|
||||||
|
background: #fffbf2;
|
||||||
|
text-align: center;
|
||||||
|
padding: 6px 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,68 @@
|
||||||
|
<template>
|
||||||
|
<BasicModal v-bind="$attrs" @register="registerModal" :title="title" :width="800" @ok="handleSubmit">
|
||||||
|
<zy-jxdg-banben-form ref="formComponent" :formDisabled="formDisabled" :formBpm="false" @success="submitSuccess"></zy-jxdg-banben-form>
|
||||||
|
</BasicModal>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { ref, unref } from 'vue';
|
||||||
|
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||||
|
import ZyJxdgBanbenForm from './ZyJxdgBanbenDetailForm.vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "TestCgMainVxeModal",
|
||||||
|
components:{
|
||||||
|
BasicModal,
|
||||||
|
ZyJxdgBanbenForm
|
||||||
|
},
|
||||||
|
emits:['register','success'],
|
||||||
|
setup(_p, {emit}){
|
||||||
|
const formComponent = ref()
|
||||||
|
const isUpdate = ref(true);
|
||||||
|
const formDisabled = ref(false);
|
||||||
|
const title = ref('')
|
||||||
|
|
||||||
|
//表单赋值
|
||||||
|
const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
|
||||||
|
setModalProps({confirmLoading: false,showCancelBtn:data?.showFooter,showOkBtn:data?.showFooter});
|
||||||
|
isUpdate.value = !!data?.isUpdate;
|
||||||
|
title.value ='详情'
|
||||||
|
formDisabled.value = !data?.showFooter;
|
||||||
|
if (unref(isUpdate)) {
|
||||||
|
console.log('data', data)
|
||||||
|
formComponent.value.edit(data.record)
|
||||||
|
}else{
|
||||||
|
formComponent.value.add()
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
function handleSubmit() {
|
||||||
|
formComponent.value.submitForm();
|
||||||
|
}
|
||||||
|
|
||||||
|
function submitSuccess(){
|
||||||
|
emit('success');
|
||||||
|
closeModal();
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
registerModal,
|
||||||
|
title,
|
||||||
|
formComponent,
|
||||||
|
formDisabled,
|
||||||
|
handleSubmit,
|
||||||
|
submitSuccess
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
/** 时间和数字输入框样式 */
|
||||||
|
:deep(.ant-input-number){
|
||||||
|
width: 100%
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.ant-calendar-picker){
|
||||||
|
width: 100%
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,451 @@
|
||||||
|
<template>
|
||||||
|
<a-spin :spinning="loading">
|
||||||
|
<a-form v-bind="formItemLayout">
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="版本" v-bind="validateInfos.title">
|
||||||
|
{{ formData.title }}
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="课程类型" v-bind="validateInfos.twoTitle"> （{{ oldInfo.twoTitle_dictText }}） </a-form-item>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-form>
|
||||||
|
<!--
|
||||||
|
单行文本 1
|
||||||
|
多行文本 2
|
||||||
|
富文本 3
|
||||||
|
固定表单（基础信息） 4
|
||||||
|
关联表格 5
|
||||||
|
自增单行文本 6
|
||||||
|
自增富文本 7
|
||||||
|
自增多行文本 8
|
||||||
|
自增表格 9
|
||||||
|
-->
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="24" v-for="(item, index) in zyJxdgMainTable.dataSource" :key="index">
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="24">
|
||||||
|
<span class="title">{{ item.title }}</span>
|
||||||
|
</a-col>
|
||||||
|
<!-- 单行文本 1 -->
|
||||||
|
<a-col v-if="item.type === '1'" :span="24">
|
||||||
|
<a-input placeholder="请输入内容" v-model:value="item.content" style="width: 100%"></a-input>
|
||||||
|
</a-col>
|
||||||
|
<!-- 多行文本 2 -->
|
||||||
|
<a-col v-else-if="item.type === '2'" :span="24">
|
||||||
|
<a-textarea placeholder="请输入内容" v-model:value="item.content" style="width: 100%"></a-textarea>
|
||||||
|
</a-col>
|
||||||
|
<!-- 富文本 3 -->
|
||||||
|
<a-col v-else-if="item.type === '3'" :span="24">
|
||||||
|
<j-editor placeholder="请输入内容" v-model:value="item.content" :disabled="disabled" />
|
||||||
|
</a-col>
|
||||||
|
<!-- 固定表单（基础信息） 4 -->
|
||||||
|
<a-col v-else-if="item.type === '4'" v-model:value="item.content" :span="24">
|
||||||
|
<a-form v-bind="formItemLayout">
|
||||||
|
<a-row>
|
||||||
|
<a-col v-for="(item2, index2) in item.zyJxdgPzxxList" :key="index2" :span="12">
|
||||||
|
<a-form-item :label="item2.title"><a-input :placeholder="`请输入` + item2.title" v-model:value="item2.content"/></a-form-item>
|
||||||
|
<!-- {{ item2.title }}:<a-input placeholder="请输入内容" style="width:60%;"></a-input> -->
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-form>
|
||||||
|
</a-col>
|
||||||
|
<!-- 自增表格 5 -->
|
||||||
|
<a-col v-else-if="item.type === '5'" :span="24">
|
||||||
|
<a-table :columns="getTableColumns(item.zyJxdgPzxxList)" :dataSource="item.list" :pagination="false">
|
||||||
|
<template #bodyCell="{ column, record }">
|
||||||
|
<a-input placeholder="请输入内容" v-model:value="record[column.key]" style="width: 80%"></a-input>
|
||||||
|
<!-- <template v-if="column.key === 'name'">
|
||||||
|
</template> -->
|
||||||
|
</template>
|
||||||
|
</a-table>
|
||||||
|
</a-col>
|
||||||
|
<!-- 自增单行文本 6 -->
|
||||||
|
<a-col v-else-if="item.type === '6'" :span="24">
|
||||||
|
<a-row>
|
||||||
|
<a-col>
|
||||||
|
<a-button type="primary" @click="handleDhwb(item)">添加</a-button>
|
||||||
|
</a-col>
|
||||||
|
<a-col v-for="(item2, index2) in item.list" :key="index2">
|
||||||
|
<a-input placeholder="请输入内容" v-model:value="item2.title" style="width: 80%" @blur="handleGlxm(item)"></a-input>
|
||||||
|
<a-button type="danger" @click="handleDhwbDel(item, index2)">删除</a-button>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-col>
|
||||||
|
<!-- 自增富文本 7 -->
|
||||||
|
<a-col v-else-if="item.type === '7'" :span="24">
|
||||||
|
<a-row>
|
||||||
|
<a-col>
|
||||||
|
<a-button type="primary" @click="handleDhfwb(item)">添加</a-button>
|
||||||
|
</a-col>
|
||||||
|
<a-col v-for="(item2, index2) in item.list" :key="index2">
|
||||||
|
<j-editor placeholder="请输入内容" v-model:value="item2.title" :disabled="disabled" style="width: 500px; height: 200px" />
|
||||||
|
<a-button type="danger" @click="handleDhfwbDel(item, index2)">删除</a-button>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-col>
|
||||||
|
<!-- 自增多行文本 8 -->
|
||||||
|
<a-col v-else-if="item.type === '8'" :span="24">
|
||||||
|
<a-row>
|
||||||
|
<a-col>
|
||||||
|
<a-button type="primary" @click="handleDhwbArea(item)">添加</a-button>
|
||||||
|
</a-col>
|
||||||
|
<a-col v-for="(item2, index2) in item.list" :key="index2">
|
||||||
|
<a-textarea placeholder="请输入内容" v-model:value="item2.title" :disabled="disabled" />
|
||||||
|
<a-button type="danger" @click="handleDhwbAreaDel(item, index2)">删除</a-button>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-col>
|
||||||
|
|
||||||
|
<!-- 自增表格 9 -->
|
||||||
|
<a-col v-else-if="item.type === '9'" :span="24">
|
||||||
|
<div><a-button type="primary" @click="handleZzbg(item)">新增</a-button> </div>
|
||||||
|
<a-table :columns="getTableZzColumns(item.zyJxdgPzxxList)" :dataSource="item.list" :pagination="false">
|
||||||
|
<template #bodyCell="{ column, record }">
|
||||||
|
<template v-if="column.key === 'action'">
|
||||||
|
<a-button type="danger" @click="handleZzbgDel(item.list, record.sort)">删除</a-button>
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
<a-input placeholder="请输入内容" v-model:value="record[column.key]" style="width: 100%"></a-input>
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</a-table>
|
||||||
|
</a-col>
|
||||||
|
|
||||||
|
<a-col v-else> </a-col>
|
||||||
|
|
||||||
|
<a-col :span="24">
|
||||||
|
<span class="tishi">
|
||||||
|
{{ item.tsy }}
|
||||||
|
</span>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-spin>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent, ref, reactive, computed, toRaw, onMounted } from 'vue';
|
||||||
|
import { defHttp } from '/@/utils/http/axios';
|
||||||
|
import { useValidateAntFormAndTable } from '/@/hooks/system/useJvxeMethods';
|
||||||
|
import { queryZyJxdgMainListByMainId, queryDataById, saveOrUpdate2 } from '../ZyJxdgBanben.api';
|
||||||
|
import { JVxeTable } from '/@/components/jeecg/JVxeTable';
|
||||||
|
import { zyJxdgMainColumns } from '../ZyJxdgBanben.data';
|
||||||
|
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
|
||||||
|
import { Form } from 'ant-design-vue';
|
||||||
|
import JEditor from '/@/components/Form/src/jeecg/components/JEditor.vue';
|
||||||
|
|
||||||
|
const useForm = Form.useForm;
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
name: 'ZyJxdgBanbenForm',
|
||||||
|
components: {
|
||||||
|
JDictSelectTag,
|
||||||
|
JVxeTable,
|
||||||
|
JEditor,
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
formDisabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
formData: { type: Object, default: () => {} },
|
||||||
|
formBpm: { type: Boolean, default: true },
|
||||||
|
},
|
||||||
|
emits: ['success'],
|
||||||
|
setup(props, { emit }) {
|
||||||
|
const loading = ref(false);
|
||||||
|
const zyJxdgMainTableRef = ref();
|
||||||
|
const oldInfo = ref({});
|
||||||
|
const zyJxdgMainTable = reactive<Record<string, any>>({
|
||||||
|
loading: false,
|
||||||
|
columns: zyJxdgMainColumns,
|
||||||
|
dataSource: [],
|
||||||
|
});
|
||||||
|
const activeKey = ref('zyJxdgMain');
|
||||||
|
const formData = reactive<Record<string, any>>({
|
||||||
|
id: '',
|
||||||
|
title: '',
|
||||||
|
twoTitle: '',
|
||||||
|
sfsy: '',
|
||||||
|
});
|
||||||
|
|
||||||
|
//表单验证
|
||||||
|
const validatorRules = reactive({});
|
||||||
|
const { resetFields, validate, validateInfos } = useForm(formData, validatorRules, { immediate: true });
|
||||||
|
const dbData = {};
|
||||||
|
const formItemLayout = {
|
||||||
|
labelCol: { xs: { span: 24 }, sm: { span: 8 } },
|
||||||
|
wrapperCol: { xs: { span: 24 }, sm: { span: 13 } },
|
||||||
|
};
|
||||||
|
const columns = [];
|
||||||
|
|
||||||
|
// 表单禁用
|
||||||
|
const disabled = computed(() => {
|
||||||
|
if (props.formBpm === true) {
|
||||||
|
if (props.formData.disabled === false) {
|
||||||
|
return false;
|
||||||
|
} else {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return props.formDisabled;
|
||||||
|
});
|
||||||
|
|
||||||
|
function add() {
|
||||||
|
resetFields();
|
||||||
|
zyJxdgMainTable.dataSource = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
async function edit(row) {
|
||||||
|
oldInfo.value = row;
|
||||||
|
//主表数据
|
||||||
|
await queryMainData(row.id);
|
||||||
|
//子表数据
|
||||||
|
const zyJxdgMainDataList = await queryZyJxdgMainListByMainId(row['id']);
|
||||||
|
zyJxdgMainTable.dataSource = [...zyJxdgMainDataList];
|
||||||
|
}
|
||||||
|
|
||||||
|
async function queryMainData(id) {
|
||||||
|
const row = await queryDataById(id);
|
||||||
|
Object.keys(row).map((k) => {
|
||||||
|
formData[k] = row[k];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const { getSubFormAndTableData, transformData } = useValidateAntFormAndTable(activeKey, {
|
||||||
|
zyJxdgMain: zyJxdgMainTableRef,
|
||||||
|
});
|
||||||
|
|
||||||
|
async function getFormData() {
|
||||||
|
await validate();
|
||||||
|
return transformData(toRaw(formData));
|
||||||
|
}
|
||||||
|
|
||||||
|
async function submitForm() {
|
||||||
|
const alllist = zyJxdgMainTable.dataSource;
|
||||||
|
console.log('✋', alllist);
|
||||||
|
|
||||||
|
var values = {
|
||||||
|
id:'',
|
||||||
|
rwbh:'202320242000629',
|
||||||
|
banbenId:oldInfo.value.id,
|
||||||
|
teacherNo:'2002900106',
|
||||||
|
sffb:'0',
|
||||||
|
list:alllist,
|
||||||
|
}
|
||||||
|
// const mainData = await getFormData();
|
||||||
|
// const subData = zyJxdgMainTable.dataSource;
|
||||||
|
// const values = Object.assign({}, dbData, mainData);
|
||||||
|
// values.zyJxdgMainList = subData;
|
||||||
|
console.log('表单提交数据', values);
|
||||||
|
const isUpdate = values.id ? true : false;
|
||||||
|
await saveOrUpdate2(values, isUpdate);
|
||||||
|
//关闭弹窗
|
||||||
|
emit('success');
|
||||||
|
}
|
||||||
|
|
||||||
|
function setFieldsValue(values) {
|
||||||
|
if (values) {
|
||||||
|
Object.keys(values).map((k) => {
|
||||||
|
formData[k] = values[k];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 值改变事件触发-树控件回调
|
||||||
|
* @param key
|
||||||
|
* @param value
|
||||||
|
*/
|
||||||
|
function handleFormChange(key, value) {
|
||||||
|
formData[key] = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
//新增单行文本
|
||||||
|
function handleDhwb(item) {
|
||||||
|
item.list = item.list || [];
|
||||||
|
item.list.push({
|
||||||
|
title: '',
|
||||||
|
sort: item.list.length + 1,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//删除单行文本
|
||||||
|
function handleDhwbDel(item, index) {
|
||||||
|
item.list.splice(index, 1);
|
||||||
|
for (var i = 0; i < item.list.length; i++) {
|
||||||
|
item.list[i].sort = i;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//新增多行富文本
|
||||||
|
function handleDhfwb(item) {
|
||||||
|
item.list = item.list || [];
|
||||||
|
item.list.push({
|
||||||
|
title: '',
|
||||||
|
sort: item.list.length + 1,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//删除多行富文本
|
||||||
|
function handleDhfwbDel(item, index) {
|
||||||
|
item.list.splice(index, 1);
|
||||||
|
for (var i = 0; i < item.list.length; i++) {
|
||||||
|
item.list[i].sort = i;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//新增多行富文本
|
||||||
|
function handleDhwbArea(item) {
|
||||||
|
item.list = item.list || [];
|
||||||
|
item.list.push({
|
||||||
|
title: '',
|
||||||
|
sort: item.list.length + 1,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//删除多行富文本
|
||||||
|
function handleDhwbAreaDel(item, index) {
|
||||||
|
item.list.splice(index, 1);
|
||||||
|
for (var i = 0; i < item.list.length; i++) {
|
||||||
|
item.list[i].sort = i;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//新增自增表格
|
||||||
|
function handleZzbg(item) {
|
||||||
|
item.list = item.list || [];
|
||||||
|
item.list.push({
|
||||||
|
title: '',
|
||||||
|
sort: item.list.length,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//删除自增表格
|
||||||
|
function handleZzbgDel(list, record) {
|
||||||
|
console.log('😁', list, record);
|
||||||
|
list.splice(record, 1);
|
||||||
|
for (var i = 0; i < list.length; i++) {
|
||||||
|
list[i].sort = i;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//获取列表列表头
|
||||||
|
function getTableColumns(list) {
|
||||||
|
let columns = reactive<any>([]);
|
||||||
|
for (var i = 0; i < list.length; i++) {
|
||||||
|
var par = list[i];
|
||||||
|
var inePar = {
|
||||||
|
title: par.title,
|
||||||
|
dataIndex: par.id,
|
||||||
|
key: par.id,
|
||||||
|
};
|
||||||
|
columns.push(inePar);
|
||||||
|
}
|
||||||
|
return columns;
|
||||||
|
}
|
||||||
|
|
||||||
|
//获取自增列表列表头
|
||||||
|
function getTableZzColumns(list) {
|
||||||
|
let columns = reactive<any>([]);
|
||||||
|
for (var i = 0; i < list.length; i++) {
|
||||||
|
var par = list[i];
|
||||||
|
var inePar = {
|
||||||
|
title: par.title,
|
||||||
|
dataIndex: par.id,
|
||||||
|
key: par.id,
|
||||||
|
};
|
||||||
|
columns.push(inePar);
|
||||||
|
}
|
||||||
|
var inePar2 = {
|
||||||
|
title: '操作',
|
||||||
|
dataIndex: 'action',
|
||||||
|
key: 'action',
|
||||||
|
};
|
||||||
|
columns.push(inePar2);
|
||||||
|
return columns;
|
||||||
|
}
|
||||||
|
//关联项目计算方法
|
||||||
|
function handleGlxm(item) {
|
||||||
|
console.log('👩🍳', item);
|
||||||
|
var sfsglxm = item.sfsglxm;
|
||||||
|
if (sfsglxm == '1') {
|
||||||
|
//判断是否是关联项目
|
||||||
|
var list1 = item.list; //课程目标集合
|
||||||
|
if (list1 != null) {
|
||||||
|
//关联项目是否有值
|
||||||
|
var sort = item.sort; //第几个关联项目
|
||||||
|
var alllist = zyJxdgMainTable.dataSource; //获取全部的数据
|
||||||
|
for (var j = 0; j < alllist.length; j++) {
|
||||||
|
for (var i = 0; i < list1.length; i++) {
|
||||||
|
var item1 = list1[i];
|
||||||
|
var title = item1.title; //具体信息
|
||||||
|
var item2 = alllist[j]; //具体数据
|
||||||
|
item2.list = item2.list || [];
|
||||||
|
if (item2.guanlian == sort) {
|
||||||
|
//关联项目等于当前数据
|
||||||
|
if (i == 0) {
|
||||||
|
//判断第一回将原来的清空重新赋值
|
||||||
|
item2.list = [];
|
||||||
|
}
|
||||||
|
//判断当前项是否等于关联项
|
||||||
|
var item3 = item2.zyJxdgPzxxList;
|
||||||
|
if (item3 != null && item3.length > 0) {
|
||||||
|
item2.list.push({ [item3[0].id]: title });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
zyJxdgMainTableRef,
|
||||||
|
zyJxdgMainTable,
|
||||||
|
validatorRules,
|
||||||
|
validateInfos,
|
||||||
|
activeKey,
|
||||||
|
loading,
|
||||||
|
formData,
|
||||||
|
oldInfo,
|
||||||
|
setFieldsValue,
|
||||||
|
handleFormChange,
|
||||||
|
formItemLayout,
|
||||||
|
disabled,
|
||||||
|
getFormData,
|
||||||
|
submitForm,
|
||||||
|
add,
|
||||||
|
edit,
|
||||||
|
getTableColumns,
|
||||||
|
getTableZzColumns,
|
||||||
|
columns,
|
||||||
|
handleDhwb,
|
||||||
|
handleDhwbDel,
|
||||||
|
handleDhfwb,
|
||||||
|
handleDhfwbDel,
|
||||||
|
handleDhwbArea,
|
||||||
|
handleDhwbAreaDel,
|
||||||
|
handleGlxm,
|
||||||
|
handleZzbg,
|
||||||
|
handleZzbgDel,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<style scoped lang="less" >
|
||||||
|
.title {
|
||||||
|
margin-left: 20px;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.tishi {
|
||||||
|
width: 100%;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #fd8f02;
|
||||||
|
margin-top: -4px;
|
||||||
|
background: #fffbf2;
|
||||||
|
text-align: center;
|
||||||
|
padding: 6px 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,68 @@
|
||||||
|
<template>
|
||||||
|
<BasicModal v-bind="$attrs" @register="registerModal" :title="title" :width="800" @ok="handleSubmit">
|
||||||
|
<zy-jxdg-banben-form ref="formComponent" :formDisabled="formDisabled" :formBpm="false" @success="submitSuccess"></zy-jxdg-banben-form>
|
||||||
|
</BasicModal>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { ref, unref } from 'vue';
|
||||||
|
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||||
|
import ZyJxdgBanbenForm from './ZyJxdgBanbenEditForm.vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "TestCgMainVxeModal",
|
||||||
|
components:{
|
||||||
|
BasicModal,
|
||||||
|
ZyJxdgBanbenForm
|
||||||
|
},
|
||||||
|
emits:['register','success'],
|
||||||
|
setup(_p, {emit}){
|
||||||
|
const formComponent = ref()
|
||||||
|
const isUpdate = ref(true);
|
||||||
|
const formDisabled = ref(false);
|
||||||
|
const title = ref('')
|
||||||
|
|
||||||
|
//表单赋值
|
||||||
|
const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
|
||||||
|
setModalProps({confirmLoading: false,showCancelBtn:data?.showFooter,showOkBtn:data?.showFooter});
|
||||||
|
isUpdate.value = !!data?.isUpdate;
|
||||||
|
title.value = '填写'
|
||||||
|
formDisabled.value = !data?.showFooter;
|
||||||
|
if (unref(isUpdate)) {
|
||||||
|
console.log('data', data)
|
||||||
|
formComponent.value.edit(data.record)
|
||||||
|
}else{
|
||||||
|
formComponent.value.add()
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
function handleSubmit() {
|
||||||
|
formComponent.value.submitForm();
|
||||||
|
}
|
||||||
|
|
||||||
|
function submitSuccess(){
|
||||||
|
emit('success');
|
||||||
|
closeModal();
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
registerModal,
|
||||||
|
title,
|
||||||
|
formComponent,
|
||||||
|
formDisabled,
|
||||||
|
handleSubmit,
|
||||||
|
submitSuccess
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
/** 时间和数字输入框样式 */
|
||||||
|
:deep(.ant-input-number){
|
||||||
|
width: 100%
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.ant-calendar-picker){
|
||||||
|
width: 100%
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,277 @@
|
||||||
|
<template>
|
||||||
|
<a-spin :spinning="loading">
|
||||||
|
<a-form v-bind="formItemLayout">
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="版本" v-bind="validateInfos.title">
|
||||||
|
<a-input v-model:value="formData.title" placeholder="请输入版本" :disabled="disabled"></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="课程类型" v-bind="validateInfos.twoTitle">
|
||||||
|
<j-dict-select-tag type='list' v-model:value="formData.twoTitle" dictCode="kclx" placeholder="请选择课程类型" :disabled="disabled"/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="是否使用" v-bind="validateInfos.sfsy">
|
||||||
|
<j-dict-select-tag type='radio' v-model:value="formData.sfsy" dictCode="yn" placeholder="请选择是否使用" :disabled="disabled"/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-form>
|
||||||
|
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="24" style="text-align: right;">
|
||||||
|
<a-button type="primary" @click="handleOneType">新增项目</a-button>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24" v-for="(item,index) in zyJxdgMainTable.dataSource" :key="index">
|
||||||
|
<a-row style="margin:10px;">
|
||||||
|
<a-col :span="6">
|
||||||
|
<a-input v-model:value="item.title" placeholder="请输入标题" :disabled="disabled"/>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="6">
|
||||||
|
<j-dict-select-tag type='list' v-model:value="item.type" dictCode="jxdglx" placeholder="请选择填写类型" :disabled="disabled"/>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="6">
|
||||||
|
<a-select placeholder="请选择关联项目" v-model:value="item.guanlian" :disabled="disabled" style="width:200px;">
|
||||||
|
<a-select-option value="">请选择关联项目</a-select-option>
|
||||||
|
<a-select-option :value="peizhi.sort" v-for="(peizhi,index2) in zyJxdgMainTable.dataSource" :key="index2">{{peizhi.title}}</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="6">
|
||||||
|
<j-dict-select-tag type='list' v-model:value="item.sfsglxm" dictCode="yn" placeholder="请选择是否是关联项目" :disabled="disabled"/>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="18">
|
||||||
|
<a-input v-model:value="item.tsy" placeholder="请输入提示语" :disabled="disabled"/>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="6">
|
||||||
|
<a-button type="danger" @click="handleOneDel(item,index)">删除</a-button>
|
||||||
|
</a-col>
|
||||||
|
<!-- 单行文本 1
|
||||||
|
多行文本 2
|
||||||
|
富文本 3
|
||||||
|
表单 4
|
||||||
|
表格 5 -->
|
||||||
|
<a-col v-if="item.type==='4' || item.type==='5' || item.type==='9'">
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-button type="primary" @click="handleTwoType(item)">新增字段</a-button>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24" v-for="(twoItem,index2) in item.zyJxdgPzxxList" :key="index2">
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="18">
|
||||||
|
<a-input v-model:value="twoItem.title" placeholder="请输入选项" :disabled="disabled"/>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="6">
|
||||||
|
<a-button type="danger" @click="handleTwoDel(item,index2)">删除</a-button>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
|
||||||
|
<!-- 子表单区域 -->
|
||||||
|
<!-- <a-tabs v-model:activeKey="activeKey" animated>
|
||||||
|
<a-tab-pane tab="教学大纲配置信息" key="zyJxdgMain" :forceRender="true">
|
||||||
|
<j-vxe-table
|
||||||
|
:keep-source="true"
|
||||||
|
resizable
|
||||||
|
ref="zyJxdgMainTableRef"
|
||||||
|
:loading="zyJxdgMainTable.loading"
|
||||||
|
:columns="zyJxdgMainTable.columns"
|
||||||
|
:dataSource="zyJxdgMainTable.dataSource"
|
||||||
|
:height="340"
|
||||||
|
:disabled="disabled"
|
||||||
|
:rowNumber="true"
|
||||||
|
:rowSelection="true"
|
||||||
|
:toolbar="true"/>
|
||||||
|
</a-tab-pane>
|
||||||
|
</a-tabs> -->
|
||||||
|
</a-spin>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent, ref, reactive, computed, toRaw, onMounted } from 'vue';
|
||||||
|
import { defHttp } from '/@/utils/http/axios';
|
||||||
|
import { useValidateAntFormAndTable } from '/@/hooks/system/useJvxeMethods';
|
||||||
|
import { queryZyJxdgMainListByMainId, queryDataById, saveOrUpdate } from '../ZyJxdgBanben.api';
|
||||||
|
import { JVxeTable } from '/@/components/jeecg/JVxeTable';
|
||||||
|
import {zyJxdgMainColumns} from '../ZyJxdgBanben.data';
|
||||||
|
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
|
||||||
|
import { Form } from 'ant-design-vue';
|
||||||
|
const useForm = Form.useForm;
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
name: "ZyJxdgBanbenForm",
|
||||||
|
components:{
|
||||||
|
JDictSelectTag,
|
||||||
|
JVxeTable,
|
||||||
|
},
|
||||||
|
props:{
|
||||||
|
formDisabled:{
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
formData: { type: Object, default: ()=>{} },
|
||||||
|
formBpm: { type: Boolean, default: true }
|
||||||
|
},
|
||||||
|
emits:['success'],
|
||||||
|
setup(props, {emit}) {
|
||||||
|
const loading = ref(false);
|
||||||
|
const zyJxdgMainTableRef = ref();
|
||||||
|
const zyJxdgMainTable = reactive<Record<string, any>>({
|
||||||
|
loading: false,
|
||||||
|
columns: zyJxdgMainColumns,
|
||||||
|
dataSource: []
|
||||||
|
});
|
||||||
|
const activeKey = ref('zyJxdgMain');
|
||||||
|
const formData = reactive<Record<string, any>>({
|
||||||
|
id: '',
|
||||||
|
title: '',
|
||||||
|
twoTitle: '',
|
||||||
|
sfsy: '',
|
||||||
|
});
|
||||||
|
|
||||||
|
//表单验证
|
||||||
|
const validatorRules = reactive({
|
||||||
|
title: [{ required: true, message: '请输入版本!'},],
|
||||||
|
sfsy: [{ required: true, message: '请输入是否使用!'},],
|
||||||
|
twoTitle: [{ required: true, message: '请输入是否使用!'},],
|
||||||
|
});
|
||||||
|
const {resetFields, validate, validateInfos} = useForm(formData, validatorRules, {immediate: true});
|
||||||
|
const dbData = {};
|
||||||
|
const formItemLayout = {
|
||||||
|
labelCol: {xs: {span: 24}, sm: {span: 5}},
|
||||||
|
wrapperCol: {xs: {span: 24}, sm: {span: 16}},
|
||||||
|
};
|
||||||
|
|
||||||
|
// 表单禁用
|
||||||
|
const disabled = computed(()=>{
|
||||||
|
if(props.formBpm === true){
|
||||||
|
if(props.formData.disabled === false){
|
||||||
|
return false;
|
||||||
|
}else{
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return props.formDisabled;
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
function add() {
|
||||||
|
resetFields();
|
||||||
|
zyJxdgMainTable.dataSource = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
async function edit(row) {
|
||||||
|
//主表数据
|
||||||
|
await queryMainData(row.id);
|
||||||
|
//子表数据
|
||||||
|
const zyJxdgMainDataList = await queryZyJxdgMainListByMainId(row['id']);
|
||||||
|
zyJxdgMainTable.dataSource = [...zyJxdgMainDataList];
|
||||||
|
}
|
||||||
|
|
||||||
|
async function queryMainData(id) {
|
||||||
|
const row = await queryDataById(id);
|
||||||
|
Object.keys(row).map(k => {
|
||||||
|
formData[k] = row[k];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const {getSubFormAndTableData, transformData} = useValidateAntFormAndTable(activeKey, {
|
||||||
|
'zyJxdgMain': zyJxdgMainTableRef,
|
||||||
|
});
|
||||||
|
|
||||||
|
async function getFormData() {
|
||||||
|
await validate();
|
||||||
|
return transformData(toRaw(formData))
|
||||||
|
}
|
||||||
|
|
||||||
|
async function submitForm() {
|
||||||
|
const mainData = await getFormData();
|
||||||
|
const subData = zyJxdgMainTable.dataSource;
|
||||||
|
console.log('主表数据11111', subData)
|
||||||
|
const values = Object.assign({}, dbData, mainData);
|
||||||
|
console.log('主表数据22222222', subData.value)
|
||||||
|
console.log('主表数据22222222', subData.target)
|
||||||
|
values.zyJxdgMainList = subData;
|
||||||
|
console.log('表单提交数据', values)
|
||||||
|
const isUpdate = values.id ? true : false
|
||||||
|
await saveOrUpdate(values, isUpdate);
|
||||||
|
//关闭弹窗
|
||||||
|
emit('success');
|
||||||
|
}
|
||||||
|
|
||||||
|
function setFieldsValue(values) {
|
||||||
|
if(values){
|
||||||
|
Object.keys(values).map(k=>{
|
||||||
|
formData[k] = values[k];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 值改变事件触发-树控件回调
|
||||||
|
* @param key
|
||||||
|
* @param value
|
||||||
|
*/
|
||||||
|
function handleFormChange(key, value) {
|
||||||
|
formData[key] = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function handleOneType(){
|
||||||
|
|
||||||
|
zyJxdgMainTable.dataSource.push({
|
||||||
|
title: '',
|
||||||
|
type: '',
|
||||||
|
guanlian:'',
|
||||||
|
sort:zyJxdgMainTable.dataSource.length+1,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleOneDel(item,index){
|
||||||
|
zyJxdgMainTable.dataSource.splice(index,1);
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleTwoType(item){
|
||||||
|
item.zyJxdgPzxxList = item.zyJxdgPzxxList || [];
|
||||||
|
item.zyJxdgPzxxList.push({
|
||||||
|
title: '',
|
||||||
|
type: '',
|
||||||
|
sort:item.zyJxdgPzxxList.length+1,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
function handleTwoDel(item,index){
|
||||||
|
item.zyJxdgPzxxList.splice(index,1);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
return {
|
||||||
|
zyJxdgMainTableRef,
|
||||||
|
zyJxdgMainTable,
|
||||||
|
validatorRules,
|
||||||
|
validateInfos,
|
||||||
|
activeKey,
|
||||||
|
loading,
|
||||||
|
formData,
|
||||||
|
setFieldsValue,
|
||||||
|
handleFormChange,
|
||||||
|
formItemLayout,
|
||||||
|
disabled,
|
||||||
|
getFormData,
|
||||||
|
submitForm,
|
||||||
|
add,
|
||||||
|
edit,
|
||||||
|
handleOneType,
|
||||||
|
handleOneDel,
|
||||||
|
handleTwoType,
|
||||||
|
handleTwoDel,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,68 @@
|
||||||
|
<template>
|
||||||
|
<BasicModal v-bind="$attrs" @register="registerModal" :title="title" :width="800" @ok="handleSubmit">
|
||||||
|
<zy-jxdg-banben-form ref="formComponent" :formDisabled="formDisabled" :formBpm="false" @success="submitSuccess"></zy-jxdg-banben-form>
|
||||||
|
</BasicModal>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { ref, unref } from 'vue';
|
||||||
|
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||||
|
import ZyJxdgBanbenForm from './ZyJxdgBanbenForm.vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "TestCgMainVxeModal",
|
||||||
|
components:{
|
||||||
|
BasicModal,
|
||||||
|
ZyJxdgBanbenForm
|
||||||
|
},
|
||||||
|
emits:['register','success'],
|
||||||
|
setup(_p, {emit}){
|
||||||
|
const formComponent = ref()
|
||||||
|
const isUpdate = ref(true);
|
||||||
|
const formDisabled = ref(false);
|
||||||
|
const title = ref('')
|
||||||
|
|
||||||
|
//表单赋值
|
||||||
|
const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
|
||||||
|
setModalProps({confirmLoading: false,showCancelBtn:data?.showFooter,showOkBtn:data?.showFooter});
|
||||||
|
isUpdate.value = !!data?.isUpdate;
|
||||||
|
title.value = data?.isUpdate?'编辑':'新增'
|
||||||
|
formDisabled.value = !data?.showFooter;
|
||||||
|
if (unref(isUpdate)) {
|
||||||
|
console.log('data', data)
|
||||||
|
formComponent.value.edit(data.record)
|
||||||
|
}else{
|
||||||
|
formComponent.value.add()
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
function handleSubmit() {
|
||||||
|
formComponent.value.submitForm();
|
||||||
|
}
|
||||||
|
|
||||||
|
function submitSuccess(){
|
||||||
|
emit('success');
|
||||||
|
closeModal();
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
registerModal,
|
||||||
|
title,
|
||||||
|
formComponent,
|
||||||
|
formDisabled,
|
||||||
|
handleSubmit,
|
||||||
|
submitSuccess
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
/** 时间和数字输入框样式 */
|
||||||
|
:deep(.ant-input-number){
|
||||||
|
width: 100%
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.ant-calendar-picker){
|
||||||
|
width: 100%
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,81 @@
|
||||||
|
import {defHttp} from '/@/utils/http/axios';
|
||||||
|
import { useMessage } from "/@/hooks/web/useMessage";
|
||||||
|
|
||||||
|
const { createConfirm } = useMessage();
|
||||||
|
|
||||||
|
enum Api {
|
||||||
|
list = '/zyJxdgTeacherMain/zyJxdgTeacherMain/list',
|
||||||
|
save='/zyJxdgTeacherMain/zyJxdgTeacherMain/add',
|
||||||
|
edit='/zyJxdgTeacherMain/zyJxdgTeacherMain/edit',
|
||||||
|
deleteOne = '/zyJxdgTeacherMain/zyJxdgTeacherMain/delete',
|
||||||
|
deleteBatch = '/zyJxdgTeacherMain/zyJxdgTeacherMain/deleteBatch',
|
||||||
|
importExcel = '/zyJxdgTeacherMain/zyJxdgTeacherMain/importExcel',
|
||||||
|
exportXls = '/zyJxdgTeacherMain/zyJxdgTeacherMain/exportXls',
|
||||||
|
queryDataById = '/zyJxdgTeacherMain/zyJxdgTeacherMain/queryById',
|
||||||
|
zyJxdgTeacherCenterList = '/zyJxdgTeacherMain/zyJxdgTeacherMain/queryZyJxdgTeacherCenterByMainId',
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 导出api
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const getExportUrl = Api.exportXls;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 导入api
|
||||||
|
*/
|
||||||
|
export const getImportUrl = Api.importExcel;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查询子表数据
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const queryZyJxdgTeacherCenterListByMainId = (id) => defHttp.get({url: Api.zyJxdgTeacherCenterList, params:{ id }});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 列表接口
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const list = (params) =>
|
||||||
|
defHttp.get({url: Api.list, params});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 删除单个
|
||||||
|
*/
|
||||||
|
export const deleteOne = (params,handleSuccess) => {
|
||||||
|
return defHttp.delete({url: Api.deleteOne, params}, {joinParamsToUrl: true}).then(() => {
|
||||||
|
handleSuccess();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 批量删除
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const batchDelete = (params, handleSuccess) => {
|
||||||
|
createConfirm({
|
||||||
|
iconType: 'warning',
|
||||||
|
title: '确认删除',
|
||||||
|
content: '是否删除选中数据',
|
||||||
|
okText: '确认',
|
||||||
|
cancelText: '取消',
|
||||||
|
onOk: () => {
|
||||||
|
return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
|
||||||
|
handleSuccess();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 保存或者更新
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const saveOrUpdate = (params, isUpdate) => {
|
||||||
|
let url = isUpdate ? Api.edit : Api.save;
|
||||||
|
return defHttp.post({url: url, params});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 根据id查询数据
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const queryDataById = (id) => defHttp.get({url: Api.queryDataById, params:{ id }});
|
||||||
|
|
||||||
|
|
@ -0,0 +1,164 @@
|
||||||
|
import {BasicColumn} from '/@/components/Table';
|
||||||
|
import {FormSchema} from '/@/components/Table';
|
||||||
|
import { rules} from '/@/utils/helper/validator';
|
||||||
|
import { render } from '/@/utils/common/renderUtils';
|
||||||
|
import {JVxeTypes,JVxeColumn} from '/@/components/jeecg/JVxeTable/types'
|
||||||
|
//列表数据
|
||||||
|
export const columns: BasicColumn[] = [
|
||||||
|
{
|
||||||
|
title: '版本id',
|
||||||
|
align:"center",
|
||||||
|
dataIndex: 'banbenId_dictText'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '是否发布（0未发布 1已发布）',
|
||||||
|
align:"center",
|
||||||
|
dataIndex: 'sffb_dictText'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '任务编号',
|
||||||
|
align:"center",
|
||||||
|
dataIndex: 'rwbh'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '课程名称',
|
||||||
|
align:"center",
|
||||||
|
dataIndex: 'kcmc'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '开课单位',
|
||||||
|
align:"center",
|
||||||
|
dataIndex: 'kkdw'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '开课单位id',
|
||||||
|
align:"center",
|
||||||
|
dataIndex: 'kkdwid'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '选课人数',
|
||||||
|
align:"center",
|
||||||
|
dataIndex: 'xkrs'
|
||||||
|
},
|
||||||
|
];
|
||||||
|
//查询数据
|
||||||
|
export const searchFormSchema: FormSchema[] = [
|
||||||
|
];
|
||||||
|
//表单数据
|
||||||
|
export const formSchema: FormSchema[] = [
|
||||||
|
{
|
||||||
|
label: '版本id',
|
||||||
|
field: 'banbenId',
|
||||||
|
component: 'JDictSelectTag',
|
||||||
|
componentProps:{
|
||||||
|
dictCode:"zy_jxdg_banben,title,id"
|
||||||
|
},
|
||||||
|
dynamicRules: ({model,schema}) => {
|
||||||
|
return [
|
||||||
|
{ required: true, message: '请输入版本id!'},
|
||||||
|
];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '是否发布（0未发布 1已发布）',
|
||||||
|
field: 'sffb',
|
||||||
|
component: 'JDictSelectTag',
|
||||||
|
componentProps:{
|
||||||
|
dictCode:"yn"
|
||||||
|
},
|
||||||
|
dynamicRules: ({model,schema}) => {
|
||||||
|
return [
|
||||||
|
{ required: true, message: '请输入是否发布（0未发布 1已发布）!'},
|
||||||
|
];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '任务编号',
|
||||||
|
field: 'rwbh',
|
||||||
|
component: 'Input',
|
||||||
|
dynamicRules: ({model,schema}) => {
|
||||||
|
return [
|
||||||
|
{ required: true, message: '请输入任务编号!'},
|
||||||
|
];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '课程名称',
|
||||||
|
field: 'kcmc',
|
||||||
|
component: 'Input',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '开课单位',
|
||||||
|
field: 'kkdw',
|
||||||
|
component: 'Input',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '开课单位id',
|
||||||
|
field: 'kkdwid',
|
||||||
|
component: 'Input',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '选课人数',
|
||||||
|
field: 'xkrs',
|
||||||
|
component: 'Input',
|
||||||
|
},
|
||||||
|
// TODO 主键隐藏字段，目前写死为ID
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
field: 'id',
|
||||||
|
component: 'Input',
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
];
|
||||||
|
//子表单数据
|
||||||
|
//子表表格配置
|
||||||
|
export const zyJxdgTeacherCenterColumns: JVxeColumn[] = [
|
||||||
|
{
|
||||||
|
title: '主表id',
|
||||||
|
key: 'mainId',
|
||||||
|
type: JVxeTypes.input,
|
||||||
|
width:"200px",
|
||||||
|
placeholder: '请输入${title}',
|
||||||
|
defaultValue:'',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '一级id',
|
||||||
|
key: 'oneId',
|
||||||
|
type: JVxeTypes.input,
|
||||||
|
width:"200px",
|
||||||
|
placeholder: '请输入${title}',
|
||||||
|
defaultValue:'',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '二级id',
|
||||||
|
key: 'twoId',
|
||||||
|
type: JVxeTypes.input,
|
||||||
|
width:"200px",
|
||||||
|
placeholder: '请输入${title}',
|
||||||
|
defaultValue:'',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '三级id',
|
||||||
|
key: 'threeId',
|
||||||
|
type: JVxeTypes.input,
|
||||||
|
width:"200px",
|
||||||
|
placeholder: '请输入${title}',
|
||||||
|
defaultValue:'',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '类型',
|
||||||
|
key: 'type',
|
||||||
|
type: JVxeTypes.input,
|
||||||
|
width:"200px",
|
||||||
|
placeholder: '请输入${title}',
|
||||||
|
defaultValue:'',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '填写内容',
|
||||||
|
key: 'content',
|
||||||
|
type: JVxeTypes.textarea,
|
||||||
|
width:"200px",
|
||||||
|
placeholder: '请输入${title}',
|
||||||
|
defaultValue:'',
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
@ -0,0 +1,211 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<!--查询区域-->
|
||||||
|
<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-row>
|
||||||
|
</a-form>
|
||||||
|
</div>
|
||||||
|
<!--引用表格-->
|
||||||
|
<BasicTable @register="registerTable" :rowSelection="rowSelection">
|
||||||
|
<!--插槽:table标题-->
|
||||||
|
<template #tableTitle>
|
||||||
|
<a-button type="primary" @click="handleAdd" preIcon="ant-design:plus-outlined"> 新增</a-button>
|
||||||
|
<a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
|
||||||
|
<j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
|
||||||
|
<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)" :dropDownActions="getDropDownAction(record)"/>
|
||||||
|
</template>
|
||||||
|
<!--字段回显插槽-->
|
||||||
|
<template #htmlSlot="{text}">
|
||||||
|
<div v-html="text"></div>
|
||||||
|
</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>
|
||||||
|
<!-- 表单区域 -->
|
||||||
|
<ZyJxdgTeacherMainModal @register="registerModal" @success="handleSuccess"></ZyJxdgTeacherMainModal>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" name="zyJxdgTeacherMain-zyJxdgTeacherMain" setup>
|
||||||
|
import {ref, reactive, computed, unref} from 'vue';
|
||||||
|
import {BasicTable, useTable, TableAction} from '/@/components/Table';
|
||||||
|
import { useListPage } from '/@/hooks/system/useListPage'
|
||||||
|
import {useModal} from '/@/components/Modal';
|
||||||
|
import ZyJxdgTeacherMainModal from './components/ZyJxdgTeacherMainModal.vue'
|
||||||
|
import {columns, searchFormSchema} from './ZyJxdgTeacherMain.data';
|
||||||
|
import {list, deleteOne, batchDelete, getImportUrl,getExportUrl} from './ZyJxdgTeacherMain.api';
|
||||||
|
import {downloadFile} from '/@/utils/common/renderUtils';
|
||||||
|
|
||||||
|
const checkedKeys = ref<Array<string | number>>([]);
|
||||||
|
//注册model
|
||||||
|
const [registerModal, {openModal}] = useModal();
|
||||||
|
//注册table数据
|
||||||
|
const { prefixCls,tableContext,onExportXls,onImportXls } = useListPage({
|
||||||
|
tableProps:{
|
||||||
|
title: '教师填写教学大纲',
|
||||||
|
api: list,
|
||||||
|
columns,
|
||||||
|
canResize:false,
|
||||||
|
useSearchForm: false,
|
||||||
|
actionColumn: {
|
||||||
|
width: 120,
|
||||||
|
fixed:'right'
|
||||||
|
},
|
||||||
|
beforeFetch: (params) => {
|
||||||
|
return Object.assign(params, queryParam.value);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
exportConfig: {
|
||||||
|
name:"教师填写教学大纲",
|
||||||
|
url: getExportUrl,
|
||||||
|
},
|
||||||
|
importConfig: {
|
||||||
|
url: getImportUrl,
|
||||||
|
success: handleSuccess
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 新增事件
|
||||||
|
*/
|
||||||
|
function handleAdd() {
|
||||||
|
openModal(true, {
|
||||||
|
isUpdate: false,
|
||||||
|
showFooter: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 编辑事件
|
||||||
|
*/
|
||||||
|
function handleEdit(record: Recordable) {
|
||||||
|
openModal(true, {
|
||||||
|
record,
|
||||||
|
isUpdate: true,
|
||||||
|
showFooter: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 详情
|
||||||
|
*/
|
||||||
|
function handleDetail(record: Recordable) {
|
||||||
|
openModal(true, {
|
||||||
|
record,
|
||||||
|
isUpdate: true,
|
||||||
|
showFooter: false,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 删除事件
|
||||||
|
*/
|
||||||
|
async function handleDelete(record) {
|
||||||
|
await deleteOne({id: record.id}, handleSuccess);
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 批量删除事件
|
||||||
|
*/
|
||||||
|
async function batchHandleDelete() {
|
||||||
|
await batchDelete({ids: selectedRowKeys.value},handleSuccess);
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 成功回调
|
||||||
|
*/
|
||||||
|
function handleSuccess() {
|
||||||
|
(selectedRowKeys.value = []) && reload();
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 操作栏
|
||||||
|
*/
|
||||||
|
function getTableAction(record){
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
label: '编辑',
|
||||||
|
onClick: handleEdit.bind(null, record),
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 下拉操作栏
|
||||||
|
*/
|
||||||
|
function getDropDownAction(record){
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
label: '详情',
|
||||||
|
onClick: handleDetail.bind(null, record),
|
||||||
|
}, {
|
||||||
|
label: '删除',
|
||||||
|
popConfirm: {
|
||||||
|
title: '是否确认删除',
|
||||||
|
confirm: handleDelete.bind(null, record),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/* ----------------------以下为原生查询需要添加的-------------------------- */
|
||||||
|
const queryParam = ref<any>({});
|
||||||
|
const toggleSearchStatus = ref<boolean>(false);
|
||||||
|
const labelCol = reactive({
|
||||||
|
xs: { span: 24 },
|
||||||
|
sm: { span: 7 },
|
||||||
|
});
|
||||||
|
const wrapperCol = reactive({
|
||||||
|
xs: { span: 24 },
|
||||||
|
sm: { span: 16 },
|
||||||
|
});
|
||||||
|
/**
|
||||||
|
* 重置
|
||||||
|
*/
|
||||||
|
function searchReset() {
|
||||||
|
queryParam.value = {};
|
||||||
|
selectedRowKeys.value = [];
|
||||||
|
//刷新数据
|
||||||
|
reload();
|
||||||
|
}
|
||||||
|
|
||||||
|
</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>
|
||||||
|
|
@ -0,0 +1,213 @@
|
||||||
|
<template>
|
||||||
|
<a-spin :spinning="loading">
|
||||||
|
<a-form v-bind="formItemLayout">
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="版本id" v-bind="validateInfos.banbenId">
|
||||||
|
<j-dict-select-tag v-model:value="formData.banbenId" dictCode="zy_jxdg_banben,title,id" placeholder="请选择版本id" :disabled="disabled"/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="是否发布（0未发布 1已发布）" v-bind="validateInfos.sffb">
|
||||||
|
<j-dict-select-tag type='radio' v-model:value="formData.sffb" dictCode="yn" placeholder="请选择是否发布（0未发布 1已发布）" :disabled="disabled"/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="任务编号" v-bind="validateInfos.rwbh">
|
||||||
|
<a-input v-model:value="formData.rwbh" placeholder="请输入任务编号" :disabled="disabled"></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="课程名称" v-bind="validateInfos.kcmc">
|
||||||
|
<a-input v-model:value="formData.kcmc" placeholder="请输入课程名称" :disabled="disabled"></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="开课单位" v-bind="validateInfos.kkdw">
|
||||||
|
<a-input v-model:value="formData.kkdw" placeholder="请输入开课单位" :disabled="disabled"></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="开课单位id" v-bind="validateInfos.kkdwid">
|
||||||
|
<a-input v-model:value="formData.kkdwid" placeholder="请输入开课单位id" :disabled="disabled"></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-item label="选课人数" v-bind="validateInfos.xkrs">
|
||||||
|
<a-input v-model:value="formData.xkrs" placeholder="请输入选课人数" :disabled="disabled"></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-form>
|
||||||
|
|
||||||
|
<!-- 子表单区域 -->
|
||||||
|
<a-tabs v-model:activeKey="activeKey" animated>
|
||||||
|
<a-tab-pane tab="教师填写教学大纲内容" key="zyJxdgTeacherCenter" :forceRender="true">
|
||||||
|
<j-vxe-table
|
||||||
|
:keep-source="true"
|
||||||
|
resizable
|
||||||
|
ref="zyJxdgTeacherCenterTableRef"
|
||||||
|
:loading="zyJxdgTeacherCenterTable.loading"
|
||||||
|
:columns="zyJxdgTeacherCenterTable.columns"
|
||||||
|
:dataSource="zyJxdgTeacherCenterTable.dataSource"
|
||||||
|
:height="340"
|
||||||
|
:disabled="disabled"
|
||||||
|
:rowNumber="true"
|
||||||
|
:rowSelection="true"
|
||||||
|
:toolbar="true"/>
|
||||||
|
</a-tab-pane>
|
||||||
|
</a-tabs>
|
||||||
|
</a-spin>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent, ref, reactive, computed, toRaw, onMounted } from 'vue';
|
||||||
|
import { defHttp } from '/@/utils/http/axios';
|
||||||
|
import { useValidateAntFormAndTable } from '/@/hooks/system/useJvxeMethods';
|
||||||
|
import { queryZyJxdgTeacherCenterListByMainId, queryDataById, saveOrUpdate } from '../ZyJxdgTeacherMain.api';
|
||||||
|
import { JVxeTable } from '/@/components/jeecg/JVxeTable';
|
||||||
|
import {zyJxdgTeacherCenterColumns} from '../ZyJxdgTeacherMain.data';
|
||||||
|
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
|
||||||
|
import { Form } from 'ant-design-vue';
|
||||||
|
const useForm = Form.useForm;
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
name: "ZyJxdgTeacherMainForm",
|
||||||
|
components:{
|
||||||
|
JDictSelectTag,
|
||||||
|
JVxeTable,
|
||||||
|
},
|
||||||
|
props:{
|
||||||
|
formDisabled:{
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
formData: { type: Object, default: ()=>{} },
|
||||||
|
formBpm: { type: Boolean, default: true }
|
||||||
|
},
|
||||||
|
emits:['success'],
|
||||||
|
setup(props, {emit}) {
|
||||||
|
const loading = ref(false);
|
||||||
|
const zyJxdgTeacherCenterTableRef = ref();
|
||||||
|
const zyJxdgTeacherCenterTable = reactive<Record<string, any>>({
|
||||||
|
loading: false,
|
||||||
|
columns: zyJxdgTeacherCenterColumns,
|
||||||
|
dataSource: []
|
||||||
|
});
|
||||||
|
const activeKey = ref('zyJxdgTeacherCenter');
|
||||||
|
const formData = reactive<Record<string, any>>({
|
||||||
|
id: '',
|
||||||
|
banbenId: '',
|
||||||
|
sffb: '',
|
||||||
|
rwbh: '',
|
||||||
|
kcmc: '',
|
||||||
|
kkdw: '',
|
||||||
|
kkdwid: '',
|
||||||
|
xkrs: '',
|
||||||
|
});
|
||||||
|
|
||||||
|
//表单验证
|
||||||
|
const validatorRules = reactive({
|
||||||
|
banbenId: [{ required: true, message: '请输入版本id!'},],
|
||||||
|
sffb: [{ required: true, message: '请输入是否发布（0未发布 1已发布）!'},],
|
||||||
|
rwbh: [{ required: true, message: '请输入任务编号!'},],
|
||||||
|
});
|
||||||
|
const {resetFields, validate, validateInfos} = useForm(formData, validatorRules, {immediate: true});
|
||||||
|
const dbData = {};
|
||||||
|
const formItemLayout = {
|
||||||
|
labelCol: {xs: {span: 24}, sm: {span: 5}},
|
||||||
|
wrapperCol: {xs: {span: 24}, sm: {span: 16}},
|
||||||
|
};
|
||||||
|
|
||||||
|
// 表单禁用
|
||||||
|
const disabled = computed(()=>{
|
||||||
|
if(props.formBpm === true){
|
||||||
|
if(props.formData.disabled === false){
|
||||||
|
return false;
|
||||||
|
}else{
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return props.formDisabled;
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
function add() {
|
||||||
|
resetFields();
|
||||||
|
zyJxdgTeacherCenterTable.dataSource = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
async function edit(row) {
|
||||||
|
//主表数据
|
||||||
|
await queryMainData(row.id);
|
||||||
|
//子表数据
|
||||||
|
const zyJxdgTeacherCenterDataList = await queryZyJxdgTeacherCenterListByMainId(row['id']);
|
||||||
|
zyJxdgTeacherCenterTable.dataSource = [...zyJxdgTeacherCenterDataList];
|
||||||
|
}
|
||||||
|
|
||||||
|
async function queryMainData(id) {
|
||||||
|
const row = await queryDataById(id);
|
||||||
|
Object.keys(row).map(k => {
|
||||||
|
formData[k] = row[k];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const {getSubFormAndTableData, transformData} = useValidateAntFormAndTable(activeKey, {
|
||||||
|
'zyJxdgTeacherCenter': zyJxdgTeacherCenterTableRef,
|
||||||
|
});
|
||||||
|
|
||||||
|
async function getFormData() {
|
||||||
|
await validate();
|
||||||
|
return transformData(toRaw(formData))
|
||||||
|
}
|
||||||
|
|
||||||
|
async function submitForm() {
|
||||||
|
const mainData = await getFormData();
|
||||||
|
const subData = await getSubFormAndTableData();
|
||||||
|
const values = Object.assign({}, dbData, mainData, subData);
|
||||||
|
console.log('表单提交数据', values)
|
||||||
|
const isUpdate = values.id ? true : false
|
||||||
|
await saveOrUpdate(values, isUpdate);
|
||||||
|
//关闭弹窗
|
||||||
|
emit('success');
|
||||||
|
}
|
||||||
|
|
||||||
|
function setFieldsValue(values) {
|
||||||
|
if(values){
|
||||||
|
Object.keys(values).map(k=>{
|
||||||
|
formData[k] = values[k];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 值改变事件触发-树控件回调
|
||||||
|
* @param key
|
||||||
|
* @param value
|
||||||
|
*/
|
||||||
|
function handleFormChange(key, value) {
|
||||||
|
formData[key] = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
return {
|
||||||
|
zyJxdgTeacherCenterTableRef,
|
||||||
|
zyJxdgTeacherCenterTable,
|
||||||
|
validatorRules,
|
||||||
|
validateInfos,
|
||||||
|
activeKey,
|
||||||
|
loading,
|
||||||
|
formData,
|
||||||
|
setFieldsValue,
|
||||||
|
handleFormChange,
|
||||||
|
formItemLayout,
|
||||||
|
disabled,
|
||||||
|
getFormData,
|
||||||
|
submitForm,
|
||||||
|
add,
|
||||||
|
edit
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,68 @@
|
||||||
|
<template>
|
||||||
|
<BasicModal v-bind="$attrs" @register="registerModal" :title="title" :width="800" @ok="handleSubmit">
|
||||||
|
<zy-jxdg-teacher-main-form ref="formComponent" :formDisabled="formDisabled" :formBpm="false" @success="submitSuccess"></zy-jxdg-teacher-main-form>
|
||||||
|
</BasicModal>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { ref, unref } from 'vue';
|
||||||
|
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||||
|
import ZyJxdgTeacherMainForm from './ZyJxdgTeacherMainForm.vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "TestCgMainVxeModal",
|
||||||
|
components:{
|
||||||
|
BasicModal,
|
||||||
|
ZyJxdgTeacherMainForm
|
||||||
|
},
|
||||||
|
emits:['register','success'],
|
||||||
|
setup(_p, {emit}){
|
||||||
|
const formComponent = ref()
|
||||||
|
const isUpdate = ref(true);
|
||||||
|
const formDisabled = ref(false);
|
||||||
|
const title = ref('')
|
||||||
|
|
||||||
|
//表单赋值
|
||||||
|
const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
|
||||||
|
setModalProps({confirmLoading: false,showCancelBtn:data?.showFooter,showOkBtn:data?.showFooter});
|
||||||
|
isUpdate.value = !!data?.isUpdate;
|
||||||
|
title.value = data?.isUpdate?'编辑':'新增'
|
||||||
|
formDisabled.value = !data?.showFooter;
|
||||||
|
if (unref(isUpdate)) {
|
||||||
|
console.log('data', data)
|
||||||
|
formComponent.value.edit(data.record)
|
||||||
|
}else{
|
||||||
|
formComponent.value.add()
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
function handleSubmit() {
|
||||||
|
formComponent.value.submitForm();
|
||||||
|
}
|
||||||
|
|
||||||
|
function submitSuccess(){
|
||||||
|
emit('success');
|
||||||
|
closeModal();
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
registerModal,
|
||||||
|
title,
|
||||||
|
formComponent,
|
||||||
|
formDisabled,
|
||||||
|
handleSubmit,
|
||||||
|
submitSuccess
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
/** 时间和数字输入框样式 */
|
||||||
|
:deep(.ant-input-number){
|
||||||
|
width: 100%
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.ant-calendar-picker){
|
||||||
|
width: 100%
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -79,7 +79,7 @@
|
||||||
|
|
||||||
<span class="topTitle" >
|
<span class="topTitle" >
|
||||||
<div hidden @click="testKuayu">点击开始跨域报错</div>
|
<div hidden @click="testKuayu">点击开始跨域报错</div>
|
||||||
<RouterLink :to="{path:'/site/index'}" style="color:white;">{{ projectName }}
|
<RouterLink :to="{path:'/site/index'}" style="color:white;">{{ projectName }}<span style="font-size: 16px;">（听评课督导平台）</span>
|
||||||
<span style="font-size: 16px;" v-if="getSysConfig().flag1">{{getSysConfig().flag1}}({{getSysConfig().bxqkssj}}至{{getSysConfig().bxqjssj}})</span>
|
<span style="font-size: 16px;" v-if="getSysConfig().flag1">{{getSysConfig().flag1}}({{getSysConfig().bxqkssj}}至{{getSysConfig().bxqjssj}})</span>
|
||||||
<span style="font-size: 16px;margin-left: 20px;" v-if="getUserSf()=='T'" >本学期听课要求：{{tkyqcs}}<span v-if="tkyqcs!='未配置'">次</span>；已完成：{{tkyqywc}}次</span>
|
<span style="font-size: 16px;margin-left: 20px;" v-if="getUserSf()=='T'" >本学期听课要求：{{tkyqcs}}<span v-if="tkyqcs!='未配置'">次</span>；已完成：{{tkyqywc}}次</span>
|
||||||
</RouterLink>
|
</RouterLink>
|
||||||
|
|
|
||||||
|
|
@ -153,7 +153,7 @@ function rkbLoadData() {
|
||||||
if(!props.queryParam.pageSize){
|
if(!props.queryParam.pageSize){
|
||||||
newRow.pageSize = -1
|
newRow.pageSize = -1
|
||||||
}else{
|
}else{
|
||||||
newRow.pageSize = 12
|
newRow.pageSize = 20
|
||||||
}
|
}
|
||||||
newRow.sftkb = '1'
|
newRow.sftkb = '1'
|
||||||
console.log(`🚀 ~ file: kclbList.vue:109 ~ rkbLoadData ~ newRow:`, newRow)
|
console.log(`🚀 ~ file: kclbList.vue:109 ~ rkbLoadData ~ newRow:`, newRow)
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue