commit
eaa4753d75
15 changed files with 1445 additions and 26 deletions
@ -0,0 +1,100 @@ |
||||
import {defHttp} from '/@/utils/http/axios'; |
||||
import {useMessage} from "/@/hooks/web/useMessage"; |
||||
|
||||
const {createConfirm} = useMessage(); |
||||
|
||||
enum Api { |
||||
list = '/project/project/list', |
||||
fengMian = '/project/project/getFengMian', |
||||
userInfo = '/project/project/getUserInfo', |
||||
departInfo = '/project/project/getDepartInfo', |
||||
saveshenbao = '/project/project/save4shenbao', |
||||
updateshenbao = '/project/project/update4shenbao', |
||||
edit = '/project/project/edit', |
||||
deleteOne = '/project/project/delete', |
||||
deleteBatch = '/project/project/deleteBatch', |
||||
importExcel = '/project/project/importExcel', |
||||
exportXls = '/project/project/exportXls', |
||||
save = '/project/project/add', |
||||
} |
||||
|
||||
/** |
||||
* 导出api |
||||
* @param params |
||||
*/ |
||||
export const getExportUrl = Api.exportXls; |
||||
/** |
||||
* 导入api |
||||
*/ |
||||
export const getImportUrl = Api.importExcel; |
||||
/** |
||||
* 列表接口 |
||||
* @param params |
||||
*/ |
||||
export const list = (params) => |
||||
defHttp.get({url: Api.list, params}); |
||||
|
||||
|
||||
export const getFengMian = (params) => |
||||
defHttp.get({url: Api.fengMian, params}); |
||||
|
||||
export const getUserByProjectId = (params) => |
||||
defHttp.get({url: Api.userInfo, params}); |
||||
|
||||
export const getDepartByProjectId = (params) => |
||||
defHttp.get({url: Api.departInfo, 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}); |
||||
} |
||||
|
||||
/** |
||||
* 保存 |
||||
* @param params |
||||
*/ |
||||
export const save4shenbao = (params) => { |
||||
return defHttp.post({url: Api.saveshenbao, params}); |
||||
}; |
||||
|
||||
|
||||
/** |
||||
* 更新 |
||||
* @param params |
||||
*/ |
||||
export const update4shenbao = (params) => { |
||||
return defHttp.post({url: Api.updateshenbao, params}); |
||||
}; |
||||
@ -0,0 +1,95 @@ |
||||
<template> |
||||
<div class="container"> |
||||
<table border="1"> |
||||
<thead> |
||||
<tr> |
||||
<th colspan="2" style="font-size: 20px">驻马店财政科研项目预算申报书</th> |
||||
</tr> |
||||
</thead> |
||||
<tbody> |
||||
<tr> |
||||
<td>预算年度</td> |
||||
<td>{{ data.annualName }}</td> |
||||
</tr> |
||||
<tr> |
||||
<td>项目类别</td> |
||||
<td>{{ data.projectTypeName }}</td> |
||||
</tr> |
||||
<tr> |
||||
<td>经费类别</td> |
||||
<td>{{ data.projectTypeName }}</td> |
||||
</tr> |
||||
<tr> |
||||
<td>项目名称</td> |
||||
<td>{{ data.projectName }}</td> |
||||
</tr> |
||||
<tr> |
||||
<td>申报单位</td> |
||||
<td>{{ data.projectName }}</td> |
||||
</tr> |
||||
<tr> |
||||
<td>科研团队名称</td> |
||||
<td></td> |
||||
</tr> |
||||
|
||||
<tr> |
||||
<td>项目负责人</td> |
||||
<td>{{ data.projectCharger }}</td> |
||||
</tr> |
||||
<tr> |
||||
<td>申请预算额度(万元)</td> |
||||
<td>{{ data.applyFund }}</td> |
||||
</tr> |
||||
<!-- <tr> |
||||
<td>市县/省直部门</td> |
||||
<td>行1，列2</td> |
||||
</tr>--> |
||||
<tr> |
||||
<td>填报日期</td> |
||||
<td>{{ data.createTime }}</td> |
||||
</tr> |
||||
|
||||
</tbody> |
||||
</table> |
||||
</div> |
||||
</template> |
||||
<script setup lang="ts"> |
||||
|
||||
import {useRoute} from "vue-router"; |
||||
import {getFengMian} from './FengMian.api'; |
||||
import {onMounted, ref} from "vue"; |
||||
|
||||
const route = useRoute(); |
||||
const data = ref({}) |
||||
|
||||
async function getData() { |
||||
let params = { |
||||
id: route.query.id, |
||||
}; |
||||
let obj = await getFengMian(params); |
||||
console.log('data', JSON.stringify(obj)) |
||||
data.value = obj |
||||
} |
||||
|
||||
|
||||
onMounted(() => { |
||||
getData() |
||||
}); |
||||
|
||||
</script> |
||||
|
||||
<style scoped lang="less"> |
||||
.container { |
||||
display: flex; |
||||
align-content: center; |
||||
justify-content: center; |
||||
} |
||||
|
||||
th, td { |
||||
width: 500px; |
||||
height: 40px; |
||||
text-align: center; |
||||
line-height: 40px; |
||||
border: 1px solid #000; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,156 @@ |
||||
<template> |
||||
<div> |
||||
<PageWrapper> |
||||
<Description |
||||
title="项目基本信息" |
||||
:collapseOptions="{ canExpand: false, helpMessage: 'help me' }" |
||||
:column="2" |
||||
:data="projectBaseInfoData" |
||||
:schema="schema" |
||||
/> |
||||
<!-- <Description |
||||
class="mt-4" |
||||
title="垂直示例" |
||||
layout="vertical" |
||||
:collapseOptions="{ canExpand: false, helpMessage: 'help me' }" |
||||
:column="2" |
||||
:data="mockData" |
||||
:schema="schema" |
||||
/>--> |
||||
|
||||
<Description @register="register" class="mt-4"/> |
||||
<Description @register="register1" class="mt-4"/> |
||||
</PageWrapper> |
||||
</div> |
||||
<div> |
||||
<!--引用表格--> |
||||
<BasicTable @register="registerTable"></BasicTable> |
||||
</div> |
||||
</template> |
||||
|
||||
|
||||
<script lang="ts" setup> |
||||
import {onMounted} from 'vue'; |
||||
import {DescItem, Description, useDescription} from '/@/components/Description/index'; |
||||
import {PageWrapper} from '/@/components/Page'; |
||||
import {BasicTable} from '/@/components/Table'; |
||||
|
||||
import {useRoute} from "vue-router"; |
||||
import {getFengMian} from './FengMian.api'; |
||||
import {useModal} from "@/components/Modal"; |
||||
import {useListPage} from "@/hooks/system/useListPage"; |
||||
import {columns} from "@/views/projectObjective/ProjectObjective.data"; |
||||
import {list} from '@/views/projectObjective/ProjectObjective.api'; |
||||
|
||||
const route = useRoute(); |
||||
|
||||
//注册model |
||||
const [registerModal, {openModal}] = useModal(); |
||||
//注册table数据 |
||||
const {tableContext} = useListPage({ |
||||
tableProps: { |
||||
title: '项目绩效目标及分年度目标：', |
||||
api: list, |
||||
columns, |
||||
canResize: false, |
||||
formConfig: { |
||||
//labelWidth: 120, |
||||
// schemas: searchFormSchema, |
||||
autoSubmitOnEnter: true, |
||||
showAdvancedButton: true, |
||||
fieldMapToNumber: [], |
||||
fieldMapToTime: [], |
||||
}, |
||||
} |
||||
}) |
||||
|
||||
const [registerTable, {reload}, {rowSelection, selectedRowKeys}] = tableContext |
||||
|
||||
const projectBaseInfoData: Recordable = { |
||||
username: 'oooooo777', |
||||
nickName: 'VB', |
||||
age: '123', |
||||
phone: '15695909xxx', |
||||
email: '190848757@qq.com', |
||||
addr: '厦门市思明区', |
||||
sex: '男', |
||||
certy: '3504256199xxxxxxxxx', |
||||
tag: 'orange', |
||||
}; |
||||
|
||||
const mockData: Recordable = { |
||||
username: 'test', |
||||
nickName: 'VB', |
||||
age: '123', |
||||
phone: '15695909xxx', |
||||
email: '190848757@qq.com', |
||||
addr: '厦门市思明区', |
||||
sex: '男', |
||||
certy: '3504256199xxxxxxxxx', |
||||
tag: 'orange', |
||||
}; |
||||
const schema: DescItem[] = [ |
||||
{ |
||||
field: 'username', |
||||
label: '用户名', |
||||
}, |
||||
{ |
||||
field: 'nickName', |
||||
label: '昵称', |
||||
render: (curVal, data) => { |
||||
return `${data.username}-${curVal}`; |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'phone', |
||||
label: '联系电话', |
||||
}, |
||||
{ |
||||
field: 'email', |
||||
label: '邮箱', |
||||
}, |
||||
{ |
||||
field: 'addr', |
||||
label: '地址', |
||||
}, |
||||
]; |
||||
// export default defineComponent({ |
||||
// components: { |
||||
// Description, PageWrapper, BasicTable |
||||
// } |
||||
// , |
||||
// setup() { |
||||
const [register] = useDescription({ |
||||
title: 'useDescription', |
||||
// data: mockData, |
||||
data: projectBaseInfoData, |
||||
schema: schema, |
||||
}); |
||||
|
||||
/*const [register1] = useDescription({ |
||||
title: '无边框', |
||||
bordered: false, |
||||
data: mockData, |
||||
schema: schema, |
||||
});*/ |
||||
|
||||
|
||||
async function getData() { |
||||
let params = { |
||||
id: route.query.id, |
||||
}; |
||||
let obj = await getFengMian(params); |
||||
console.log('data', JSON.stringify(obj)) |
||||
projectBaseInfoData.value = obj |
||||
} |
||||
|
||||
|
||||
onMounted(() => { |
||||
getData() |
||||
}); |
||||
|
||||
|
||||
// return {mockData, projectBaseInfoData, schema, register/*, register1*/}; |
||||
// }, |
||||
// }); |
||||
</script> |
||||
@ -0,0 +1,97 @@ |
||||
<template> |
||||
<div class="p-4"> |
||||
<div class="p-4 bg-white"> |
||||
<BasicForm @register="register" @submit="handleSubmit" /> |
||||
</div> |
||||
</div> |
||||
<div type="primary" class="button-container"> |
||||
<a-button type="primary" @click="goBack">返回</a-button> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
export default { |
||||
title: '富文本 | Markdown', |
||||
name: 'MarkdownDemo', |
||||
}; |
||||
</script> |
||||
|
||||
<script lang="ts" setup> |
||||
import { FormSchema, useForm, BasicForm } from '/@/components/Form'; |
||||
import { useMessage } from '/@/hooks/web/useMessage'; |
||||
import { defineComponent, onMounted, ref } from 'vue'; |
||||
import { useRouter } from 'vue-router'; |
||||
|
||||
const { back } = useRouter(); |
||||
const { createMessage, createSuccessModal } = useMessage(); |
||||
|
||||
const schemas: FormSchema[] = [ |
||||
{ |
||||
field: 'tinymce', |
||||
component: 'JEditor', |
||||
// component: 'InputTextArea', |
||||
// componentProps: { |
||||
// // placeholder: '请输入公司地址', |
||||
// rows: 12, |
||||
// }, |
||||
// label: '富文本', |
||||
// defaultValue: 'dd', |
||||
dynamicDisabled: true, |
||||
}, |
||||
]; |
||||
|
||||
const [register, { setProps, validate, setFieldsValue }] = useForm({ |
||||
labelWidth: 120, |
||||
schemas: schemas, |
||||
actionColOptions: { |
||||
span: 24, |
||||
}, |
||||
compact: true, |
||||
showResetButton: false, |
||||
showSubmitButton: false, |
||||
showAdvancedButton: false, |
||||
disabled: false, |
||||
}); |
||||
|
||||
function handleSubmit(values) { |
||||
console.log(values); |
||||
} |
||||
|
||||
function setDis(flag) { |
||||
setProps({ disabled: !!flag }); |
||||
} |
||||
|
||||
async function getValues() { |
||||
try { |
||||
const values = await validate(); |
||||
console.log(values); |
||||
createSuccessModal({ |
||||
title: '校验通过', |
||||
content: `${JSON.stringify(values)}`, |
||||
}); |
||||
} catch (error) { |
||||
createMessage.warning('检验不通过'); |
||||
} |
||||
} |
||||
|
||||
function setValues() { |
||||
setFieldsValue({ |
||||
tinymce: "<p style=\"text-align: center;\"><strong>填报说明</strong></p>\n<p>一、项目类别是指项目所属计划（专项、基金等）。申请项目经费的单位应符合《河南省省级创新研发专项资金管理办法》（豫财科〔2022〕46号）以及项目申报指南有关条件和要求。</p>\n<p>二、项目名称和项目承担单位名称，应填写正式全称。承担单位名称与单位法人营业执照、单位开户名称及单位公章应当一致。预算数据以“万元”为单位，精确到小数点后两位。各类标准或单价以“元”为单位，精确到个位。预算书中不同地方出现的相通设备、材料等实物信息应当填写规范和统一的名称。“科研团队”的内涵和基本条件按省科技厅规定执行。</p>\n<p>三、“单位基本情况表”中，单位技术研究资质包括：工程技术研究中心、重点实验室、高新技术企业、企业技术中心、工程研究中心、产品质量监督检验中心、创新型试点企业、创新型科技团队、省知识产权优势企业等，填写申报项目相关领域的研究资质。同类资质只填列最高一个级别。</p>\n<p>企业类型按照《中小企业划型标准规定》(工信部联企业[2011]300号)填报。</p>\n<p>四、项目绩效目标指项目完成后的达到的产出和效果，包括研究、开发及转化的技术指标，经济、社会、环境效益等预期效果，目标应具体可考核。项目绩效目标应当与项目申报书中的相关内容保持一致。跨年度实施的项目应当编列年度工作计划和目标。</p>\n<p>五、“项目经费预算表”中，项目经费是指在项目组织实施过程中与研究开发活动直接相关的费用，包括直接费用和间接费用。具体经费开支范围按照《河南省省级创新研发专项资金管理办法》（豫财科〔2022〕46号）相关内容执行。</p>\n<p>支出预算表中“已完成”是指从项目开始实施至项目申报时已完成的支出情况。项目尚未实施的可不填。</p>\n<p>财政拨款需要拨付到项目合作单位的以及需分年度支付的，应填报“省财政拨款分单位、年度预算表”。项目牵头单位实行统一核算，合作单位经费支出实行报帐的可以不填。</p>\n<p>六、经费支出说明：</p>\n<p>1、对照《河南省省级创新研发专项资金管理办法》（豫财科〔2022〕46号）中“经费开支范围”和本申报书中“项目经费预算表”，逐项详细说明。主要包括支出的具体内容、用途以及数量、单价等计算依据。</p>\n<p>2、根据项目经费预算支出情况，对定额以上的设备设施费、材料费、测试化验加工费、国际合作与交流经费，需填写“经费支出分项预算明细表”。</p>\n<p>七、网报预算申报书时，应同时上传单位证照（事业单位上传法人证书，企业单位上传营业执照）、单位技术研究资质认定文件（扫描件）、企业上年度财务审计报告（扫描件）、资金证明材料等有关附件。</p>", |
||||
}); |
||||
} |
||||
function goBack(){ |
||||
back(); |
||||
}; |
||||
|
||||
|
||||
onMounted(() => { |
||||
setValues(); |
||||
}); |
||||
|
||||
</script> |
||||
|
||||
<style scoped> |
||||
.button-container { |
||||
text-align: center; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,89 @@ |
||||
<template> |
||||
<div class="p-4"> |
||||
<a-card :bordered="false" style="height: 100%"> |
||||
<a-tabs v-model:activeKey="activeKey" @change="tabChange"> |
||||
<a-tab-pane key="FengMianDemo" tab="封面" force-render></a-tab-pane> |
||||
<a-tab-pane key="TianBaoShuMingDemo" tab="填报说明" force-render></a-tab-pane> |
||||
<a-tab-pane key="ProjectBaseInfoDemo" tab="项目基本情况表"></a-tab-pane> |
||||
<a-tab-pane key="ZhengWenDemo" tab="正文"></a-tab-pane> |
||||
<a-tab-pane key="XiangMuHeZuoKaiFaDemo" tab="项目合作开发情况"></a-tab-pane> |
||||
<a-tab-pane key="HeZuoDanWeiDemo" tab="合作单位"></a-tab-pane> |
||||
<a-tab-pane key="ZhuYaoRenYuanDemo" tab="项目主要参加人员"></a-tab-pane> |
||||
<!-- <a-tab-pane key="JeecgPdfView" tab="PDF预览"></a-tab-pane>--> |
||||
<a-tab-pane key="XiangMuJiXiaoMuBiaoDemo" tab="项目绩效目标"></a-tab-pane> |
||||
<a-tab-pane key="YiJianDemo" tab="意见"></a-tab-pane> |
||||
<a-tab-pane key="FuJianDemo" tab="文件上传"></a-tab-pane> |
||||
</a-tabs> |
||||
<component :is="currentComponent"></component> |
||||
</a-card> |
||||
</div> |
||||
<!-- <div type="primary" class="button-container"> |
||||
<a-button type="primary" @click="goBack"> 获取路由 </a-button> |
||||
</div>--> |
||||
</template> |
||||
<script lang="ts"> |
||||
import { defineComponent, ref, computed } from 'vue'; |
||||
import FengMianDemo from './FengMianDemo.vue'; |
||||
import TianBaoShuMingDemo from './TianBaoShuMingDemo.vue'; |
||||
import ProjectBaseInfoDemo from './ProjectBaseInfoDemo.vue'; |
||||
import JiBenXinXiDemo from '../xiangmushu/JiBenXinXiDemo.vue'; |
||||
import XiangMuJiXiaoMuBiaoDemo from '../xiangmushu/XiangMuJiXiaoMuBiaoDemo.vue'; |
||||
import YiJianDemo from '../xiangmushu/YiJianDemo.vue'; |
||||
import HeZuoDanWeiDemo from '../xiangmushu/HeZuoDanWeiDemo.vue'; |
||||
import ZhuYaoRenYuanDemo from '../xiangmushu/ZhuYaoRenYuanDemo.vue'; |
||||
import ZhengWenDemo from '../xiangmushu/ZhengWenDemo.vue'; |
||||
import XiangMuHeZuoKaiFaDemo from '../xiangmushu/XiangMuHeZuoKaiFaDemo.vue'; |
||||
import JeecgPdfView from '../xiangmushu/JeecgPdfView.vue'; |
||||
import FuJianDemo from '../xiangmushu/FuJianDemo.vue'; |
||||
import { useRouter } from 'vue-router'; |
||||
|
||||
export default defineComponent({ |
||||
name: 'comp-jeecg-basic', |
||||
setup() { |
||||
const route = useRouter(); |
||||
const projectId = ref(route.currentRoute.value.query); |
||||
const activeKey = ref('FengMianDemo'); |
||||
const currentComponent = computed(() => { |
||||
const componentType = { |
||||
TianBaoShuMingDemo: TianBaoShuMingDemo, |
||||
FengMianDemo: FengMianDemo, |
||||
ProjectBaseInfoDemo: ProjectBaseInfoDemo, |
||||
ZhengWenDemo: ZhengWenDemo, |
||||
XiangMuHeZuoKaiFaDemo: XiangMuHeZuoKaiFaDemo, |
||||
XiangMuJiXiaoMuBiaoDemo: XiangMuJiXiaoMuBiaoDemo, |
||||
YiJianDemo: YiJianDemo, |
||||
HeZuoDanWeiDemo: HeZuoDanWeiDemo, |
||||
ZhuYaoRenYuanDemo: ZhuYaoRenYuanDemo, |
||||
JeecgPdfView: JeecgPdfView, |
||||
FuJianDemo: FuJianDemo, |
||||
}; |
||||
return componentType[activeKey.value]; |
||||
}); |
||||
|
||||
//使用component动态切换tab |
||||
function tabChange(key) { |
||||
activeKey.value = key; |
||||
// alert("activeKey.value-"+activeKey.value) |
||||
} |
||||
|
||||
/*function goBack() { |
||||
// back(); |
||||
alert("获取路由:"+JSON.stringify(projectId)); |
||||
// console.log("获取路由:"+JSON.stringify(route.currentRoute.value.query)); |
||||
// route.back(); |
||||
}*/ |
||||
return { |
||||
activeKey, |
||||
currentComponent, |
||||
tabChange, |
||||
// goBack, |
||||
}; |
||||
}, |
||||
}); |
||||
</script> |
||||
|
||||
<style scoped> |
||||
.button-container { |
||||
text-align: center; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,865 @@ |
||||
import { FormSchema, JCronValidator } from '/@/components/Form'; |
||||
import { usePermission } from '/@/hooks/web/usePermission'; |
||||
|
||||
const { isDisabledAuth } = usePermission(); |
||||
export const schemas: FormSchema[] = [ |
||||
{ |
||||
field: 'jdst', |
||||
component: 'JDictSelectTag', |
||||
label: '性别下拉', |
||||
helpMessage: ['component模式'], |
||||
componentProps: { |
||||
dictCode: 'sex', |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'jdst', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'jdst1', |
||||
component: 'JDictSelectTag', |
||||
label: '性别选择', |
||||
helpMessage: ['component模式'], |
||||
componentProps: { |
||||
dictCode: 'sex', |
||||
type: 'radioButton', |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'jdst1', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'jdst2', |
||||
component: 'JDictSelectTag', |
||||
label: '字典表下拉', |
||||
helpMessage: ['component模式'], |
||||
componentProps: { |
||||
dictCode: 'sys_user,realname,id', |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'jdst2', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'jdst3', |
||||
component: 'JDictSelectTag', |
||||
label: '字典表下拉(带条件)', |
||||
helpMessage: ['component模式'], |
||||
componentProps: { |
||||
dictCode: "sys_user,realname,id,username!='admin' order by create_time", |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'jdst3', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'jsst', |
||||
component: 'JSearchSelect', |
||||
label: '字典搜索(同步)', |
||||
colProps: { span: 12 }, |
||||
componentProps: { |
||||
//dict: "sys_depart,depart_name,id", |
||||
dictOptions: [ |
||||
{ |
||||
text: '选项一', |
||||
value: '1', |
||||
}, |
||||
{ |
||||
text: '选项二', |
||||
value: '2', |
||||
}, |
||||
{ |
||||
text: '选项三', |
||||
value: '3', |
||||
}, |
||||
], |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'jsst', |
||||
component: 'JEllipsis', |
||||
label: '选择值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'jsst2', |
||||
component: 'JSearchSelect', |
||||
label: '字典搜索(异步)', |
||||
colProps: { span: 12 }, |
||||
componentProps: { |
||||
dict: 'sys_depart,depart_name,id', |
||||
pageSize: 6, |
||||
async: true, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'jsst2', |
||||
component: 'JEllipsis', |
||||
label: '选择值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'xldx', |
||||
component: 'JDictSelectTag', |
||||
label: '字典下拉多选', |
||||
colProps: { span: 12 }, |
||||
componentProps: { |
||||
dictCode: 'sex', |
||||
mode: 'multiple', |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'xldx', |
||||
component: 'JEllipsis', |
||||
label: '选择值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'xldx2', |
||||
component: 'JSelectMultiple', |
||||
label: '字典下拉多选2', |
||||
colProps: { span: 12 }, |
||||
componentProps: { |
||||
dictCode: 'sex', |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'xldx2', |
||||
component: 'JEllipsis', |
||||
label: '选择值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'dxxlk', |
||||
component: 'JDictSelectTag', |
||||
label: '字典下拉单选', |
||||
colProps: { span: 12 }, |
||||
componentProps: { |
||||
dictCode: 'sex', |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'dxxlk', |
||||
component: 'JEllipsis', |
||||
label: '选择值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
label: '可输入下拉', |
||||
field: 'selectInput', |
||||
component: 'JSelectInput', |
||||
componentProps: { |
||||
options: [ |
||||
{ label: '选项一', value: '1' }, |
||||
{ label: '选项二', value: '2' }, |
||||
{ label: '选项三', value: '3' }, |
||||
], |
||||
}, |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'selectInput', |
||||
component: 'JEllipsis', |
||||
label: '选择值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'depart3', |
||||
component: 'JSelectDept', |
||||
label: '选择部门—自定义值', |
||||
helpMessage: ['component模式'], |
||||
componentProps: { showButton: false, rowKey: 'orgCode', primaryKey: 'orgCode' }, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'depart3', |
||||
component: 'JEllipsis', |
||||
label: '选中部门', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'depart2', |
||||
component: 'JSelectDept', |
||||
label: '选择部门', |
||||
helpMessage: ['component模式'], |
||||
componentProps: { showButton: false }, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'depart2', |
||||
component: 'JEllipsis', |
||||
label: '选中部门', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'user2', |
||||
component: 'JSelectUser', |
||||
label: '用户选择组件', |
||||
helpMessage: ['component模式'], |
||||
componentProps: { |
||||
labelKey: 'realname', |
||||
rowKey: 'id', |
||||
showSelected: true, |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'user2', |
||||
component: 'JEllipsis', |
||||
label: '选中用户', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'user3', |
||||
component: 'JSelectUserByDept', |
||||
label: '部门选择用户', |
||||
helpMessage: ['component模式'], |
||||
componentProps: { |
||||
labelKey: 'realname', |
||||
rowKey: 'username', |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'user3', |
||||
component: 'JEllipsis', |
||||
label: '选中用户', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'role2', |
||||
component: 'JSelectRole', |
||||
label: '角色选择组件', |
||||
helpMessage: ['component模式'], |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'role2', |
||||
component: 'JEllipsis', |
||||
label: '选中角色', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'position2', |
||||
component: 'JSelectPosition', |
||||
label: '职务选择组件', |
||||
helpMessage: ['component模式'], |
||||
colProps: { span: 12 }, |
||||
componentProps: { async: true, showSelectTable: true }, |
||||
}, |
||||
{ |
||||
field: 'position2', |
||||
component: 'JEllipsis', |
||||
label: '选中职务', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'checkbox1', |
||||
component: 'JCheckbox', |
||||
label: 'JCheckbox组件1', |
||||
helpMessage: ['component模式'], |
||||
defaultValue: '1,2', |
||||
componentProps: { |
||||
options: [ |
||||
{ label: '男', value: '1' }, |
||||
{ label: '女', value: '2' }, |
||||
], |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'checkbox1', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'checkbox2', |
||||
component: 'Input', |
||||
label: 'JCheckbox组件2', |
||||
defaultValue: '1', |
||||
helpMessage: ['插槽模式'], |
||||
slot: 'JCheckbox', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'checkbox2', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'data1', |
||||
label: '日期选择', |
||||
component: 'DatePicker', |
||||
componentProps: { |
||||
showTime: true, |
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss', |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'data1', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'data2', |
||||
label: '年份范围选择', |
||||
component: 'RangePicker', |
||||
componentProps: { |
||||
picker: 'year', |
||||
valueFormat: 'YYYY', |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'data2', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'hk', |
||||
component: 'Input', |
||||
label: '滑块验证码', |
||||
helpMessage: ['插槽模式'], |
||||
slot: 'dargVerify', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'hk', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'JTreeDict', |
||||
component: 'JTreeDict', |
||||
label: '树字典', |
||||
helpMessage: ['component模式'], |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'JTreeDict', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'ts', |
||||
component: 'JTreeSelect', |
||||
label: '下拉树选择', |
||||
helpMessage: ['component模式'], |
||||
componentProps: { |
||||
dict: 'sys_permission,name,id', |
||||
pidField: 'parent_id', |
||||
hasChildField: 'is_leaf', |
||||
converIsLeafVal: 0, |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'ts', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'ts1', |
||||
component: 'JTreeSelect', |
||||
label: '下拉树多选', |
||||
helpMessage: ['component模式'], |
||||
componentProps: { |
||||
dict: 'sys_permission,name,id', |
||||
pidField: 'parent_id', |
||||
hasChildField: 'is_leaf', |
||||
converIsLeafVal: 0, |
||||
multiple: true, |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'ts1', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'category', |
||||
component: 'JCategorySelect', |
||||
label: '分类字典树', |
||||
helpMessage: ['component模式'], |
||||
defaultValue: '', |
||||
componentProps: { |
||||
pcode: 'B01', |
||||
multiple: true, |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'category', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'JEasyCron', |
||||
component: 'JEasyCron', |
||||
label: 'JEasyCron', |
||||
helpMessage: ['component模式'], |
||||
colProps: { span: 12 }, |
||||
defaultValue: '* * * * * ? *', |
||||
rules: [{ validator: JCronValidator }], |
||||
}, |
||||
{ |
||||
field: 'JEasyCron', |
||||
component: 'JEllipsis', |
||||
label: '选择值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'JInput', |
||||
component: 'JInput', |
||||
label: '特殊查询组件', |
||||
helpMessage: ['插槽模式'], |
||||
slot: 'JInput', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'jinputtype', |
||||
component: 'Select', |
||||
label: '查询类型', |
||||
componentProps: { |
||||
options: [ |
||||
{ value: 'like', label: '模糊（like）' }, |
||||
{ value: 'ne', label: '不等于（ne）' }, |
||||
{ value: 'ge', label: '大于等于（ge）' }, |
||||
{ value: 'le', label: '小于等于（le)' }, |
||||
], |
||||
}, |
||||
colProps: { |
||||
span: 6, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'JInput', |
||||
component: 'JEllipsis', |
||||
label: '输入值', |
||||
colProps: { span: 6 }, |
||||
}, |
||||
{ |
||||
field: 'field1', |
||||
component: 'Select', |
||||
label: '省市区选择', |
||||
helpMessage: ['插槽模式'], |
||||
slot: 'jAreaLinkage', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
defaultValue: ['130000', '130200'], |
||||
}, |
||||
{ |
||||
field: 'field1', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'field0', |
||||
component: 'Select', |
||||
label: '禁用组件(方式一)', |
||||
helpMessage: ['插槽模式'], |
||||
slot: 'jAreaLinkage1', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
defaultValue: ['130000', '130200'], |
||||
}, |
||||
|
||||
{ |
||||
field: 'field0', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'field2', |
||||
component: 'JAreaLinkage', |
||||
label: '禁用组件(方式二)', |
||||
helpMessage: ['component模式'], |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
dynamicDisabled: ({ values }) => { |
||||
console.log(values); |
||||
return isDisabledAuth(['demo.dbarray']); |
||||
}, |
||||
defaultValue: ['140000', '140300', '140302'], |
||||
}, |
||||
{ |
||||
field: 'field2', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'pca1', |
||||
component: 'JAreaSelect', |
||||
label: '省市区级联', |
||||
helpMessage: ['component模式'], |
||||
defaultValue: '140302', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'pca1', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'pop1', |
||||
component: 'Input', |
||||
label: 'JPopup示例', |
||||
helpMessage: ['插槽模式'], |
||||
slot: 'JPopup', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'pop1', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'JInputPop', |
||||
component: 'JInputPop', |
||||
label: 'JInputPop', |
||||
helpMessage: ['component模式'], |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'JInputPop', |
||||
component: 'JEllipsis', |
||||
label: '输入值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'JTreeDictAsync', |
||||
component: 'JTreeDict', |
||||
label: '异步JTreeDict', |
||||
helpMessage: ['component模式'], |
||||
colProps: { span: 12 }, |
||||
componentProps: { async: true }, |
||||
}, |
||||
{ |
||||
field: 'JTreeDictAsync', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'JSwitch', |
||||
component: 'JSwitch', |
||||
label: 'JSwitch', |
||||
helpMessage: ['component模式'], |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'JSwitch', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'JSwitchSelect', |
||||
component: 'JSwitch', |
||||
label: 'JSwitchSelect', |
||||
helpMessage: ['component模式'], |
||||
colProps: { span: 12 }, |
||||
componentProps: { query: true }, |
||||
}, |
||||
{ |
||||
field: 'JSwitchSelect', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
|
||||
{ |
||||
field: 'userSelect2', |
||||
component: 'UserSelect', |
||||
label: '高级用户选择', |
||||
helpMessage: ['component模式'], |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'userSelect2', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
|
||||
{ |
||||
field: 'superQuery', |
||||
component: 'Input', |
||||
label: '高级查询', |
||||
helpMessage: ['插槽模式'], |
||||
slot: 'superQuery', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'superQuery', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'superQuery1', |
||||
component: 'Input', |
||||
label: '高级查询', |
||||
helpMessage: ['插槽模式-自己保存查询条件'], |
||||
slot: 'superQuery1', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'superQuery1', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'pop2', |
||||
component: 'JPopupDict', |
||||
label: 'JPopupDict示例', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
componentProps:{ |
||||
placeholder: '请选择', |
||||
dictCode: 'report_user,username,id', |
||||
multi: true, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'pop2', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'sex', |
||||
component: 'JDictSelectTag', |
||||
label: '性别(控制下方课程options)', |
||||
helpMessage: ['component模式','性别不同，下方课程展示选项不同'], |
||||
componentProps: { |
||||
dictCode: 'sex', |
||||
type: 'radioButton', |
||||
onChange: (value) => { |
||||
console.log(value); |
||||
}, |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'sex', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'course', |
||||
component: 'Select', |
||||
label: '课程', |
||||
dynamicPropskey: 'options', |
||||
dynamicPropsVal: ({ model }) => { |
||||
let options; |
||||
if (model.sex == 1) { |
||||
return [ |
||||
{ value: '0', label: 'java - 男' }, |
||||
{ value: '1', label: 'vue - 男' }, |
||||
]; |
||||
} else if (model.sex == 2) { |
||||
return [ |
||||
{ value: '2', label: '瑜伽 - 女' }, |
||||
{ value: '3', label: '美甲 - 女' }, |
||||
]; |
||||
} else { |
||||
return []; |
||||
} |
||||
}, |
||||
componentProps: { |
||||
disabled: false, |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'course', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'field100', |
||||
component: 'JInputSelect', |
||||
label: 'JInputSelect', |
||||
helpMessage: ['component模式'], |
||||
componentProps: { |
||||
selectPlaceholder: '可选择系统变量', |
||||
inputPlaceholder: '请输入', |
||||
selectWidth:'200px', |
||||
options: [ |
||||
{ |
||||
label: '登录用户账号', |
||||
value: '#{sys_user_code}', |
||||
}, |
||||
{ |
||||
label: '登录用户名称', |
||||
value: '#{sys_user_name}', |
||||
}, |
||||
{ |
||||
label: '当前日期', |
||||
value: '#{sys_date}', |
||||
}, |
||||
{ |
||||
label: '当前时间', |
||||
value: '#{sys_time}', |
||||
}, |
||||
{ |
||||
label: '登录用户部门', |
||||
value: '#{sys_org_code}', |
||||
}, |
||||
{ |
||||
label: '用户拥有部门', |
||||
value: '#{sys_multi_org_code}', |
||||
}, |
||||
{ |
||||
label: '登录用户租户', |
||||
value: '#{tenant_id}', |
||||
}, |
||||
], |
||||
}, |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'field100', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
{ |
||||
field: 'JAreaLinkage', |
||||
component: 'JAreaLinkage', |
||||
label: '省市区选择', |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'JAreaLinkage', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
|
||||
{ |
||||
field: 'orderAuth', |
||||
component: 'Input', |
||||
label: '指令权限', |
||||
helpMessage: ['有权限右侧的"选中值"可见，否则不可见'], |
||||
colProps: { |
||||
span: 12, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'orderAuth', |
||||
auth: 'demo:order:auth', |
||||
component: 'JEllipsis', |
||||
label: '选中值', |
||||
colProps: { span: 12 }, |
||||
}, |
||||
|
||||
]; |
||||
Loading…
Reference in new issue