gaoxing/UNIVPLMDataIntegration
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

同步模版

Browse Source
This commit is contained in:
Master 2024-07-11 14:47:43 +08:00
parent a9f719a9b5
commit 0f1b7b8dbe
1 changed files with 91 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

117
Admin.NET/Admin.NET.Web.Entry/wwwroot/Template/index.vue.vm
View File

@ -20,25 +20,25 @@
<template> <template>
<div class="@(@Model.LowerClassName)-container" v-loading="options.loading"> <div class="@(@Model.LowerClassName)-container" v-loading="options.loading">
<el-card shadow="hover" :body-style="{ padding: '20px 20px 16px 10px', display: 'flex', width: '100%', height: '100%', alignItems: 'start' }"> <el-card shadow="hover" :body-style="{ padding: '20px 20px 16px 10px', display: 'flex', width: '100%', height: '100%', alignItems: 'start' }">
<el-form :model="state.queryParams" ref="queryForm" :show-message="false" :inlineMessage="true" label-width="auto" style="flex: 1 1 0%" @@submit.prevent="handleQuery(true)" > <el-form :model="state.queryParams" ref="queryForm" :show-message="false" :inlineMessage="true" label-width="auto" style="flex: 1 1 0%" @@submit.prevent="handleQuery" >
<el-row :gutter="10"> <el-row :gutter="10">
@if(Model.QueryWhetherList.Count > 0){ @if(Model.QueryWhetherList.Count > 0){
<el-col class="mb5" :xs="24" :sm="12" :md="8" :lg="6" :xl="6"> <el-col class="mb5" :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
<el-form-item label="关键字" prop="searchKey"> <el-form-item label="关键字" prop="searchKey">
<el-input v-model="state.queryParams.searchKey" placeholder="请输入模糊查询关键字" clearable @@keyup.enter.native="handleQuery(true)" /> <el-input v-model="state.queryParams.searchKey" placeholder="请输入模糊查询关键字" clearable @@keyup.enter.native="handleQuery" />
</el-form-item> </el-form-item>
</el-col> </el-col>
foreach (var column in Model.QueryWhetherList) { foreach (var column in Model.QueryWhetherList) {
if(@column.EffectType == "Input" || @column.EffectType == "InputTextArea") { if(@column.EffectType == "Input" || @column.EffectType == "InputTextArea") {
<el-col class="mb5" :xs="24" :sm="12" :md="8" :lg="6" :xl="6" v-if="state.showAdvanceQueryUI"> <el-col class="mb5" :xs="24" :sm="12" :md="8" :lg="6" :xl="6" v-if="state.showAdvanceQueryUI">
<el-form-item label="@column.ColumnComment" prop="@(@column.LowerPropertyName)"> <el-form-item label="@column.ColumnComment" prop="@(@column.LowerPropertyName)">
<el-input v-model="state.queryParams.@(@column.LowerPropertyName)" placeholder="@column.ColumnComment" clearable @@keyup.enter.native="handleQuery(true)" /> <el-input v-model="state.queryParams.@(@column.LowerPropertyName)" placeholder="@column.ColumnComment" clearable @@keyup.enter.native="handleQuery" />
</el-form-item> </el-form-item>
</el-col> </el-col>
} else if(@column.EffectType == "InputNumber") { } else if(@column.EffectType == "InputNumber") {
<el-col class="mb5" :xs="24" :sm="12" :md="8" :lg="6" :xl="6" v-if="state.showAdvanceQueryUI"> <el-col class="mb5" :xs="24" :sm="12" :md="8" :lg="6" :xl="6" v-if="state.showAdvanceQueryUI">
<el-form-item label="@column.ColumnComment"> <el-form-item label="@column.ColumnComment">
<el-input-number v-model="state.queryParams.@(@column.LowerPropertyName)" placeholder="请输入@(@column.ColumnComment)" clearable @@keyup.enter.native="handleQuery(true)" /> <el-input-number v-model="state.queryParams.@(@column.LowerPropertyName)" placeholder="请输入@(@column.ColumnComment)" clearable @@keyup.enter.native="handleQuery" />
</el-form-item> </el-form-item>
</el-col> </el-col>
} else if(@column.EffectType == "fk") { } else if(@column.EffectType == "fk") {
@ -52,7 +52,7 @@
} else if(@column.EffectType == "Select") { } else if(@column.EffectType == "Select") {
<el-col class="mb5" :xs="24" :sm="12" :md="8" :lg="6" :xl="6" v-if="state.showAdvanceQueryUI"> <el-col class="mb5" :xs="24" :sm="12" :md="8" :lg="6" :xl="6" v-if="state.showAdvanceQueryUI">
<el-form-item label="@column.ColumnComment" prop="@(@column.LowerPropertyName)"> <el-form-item label="@column.ColumnComment" prop="@(@column.LowerPropertyName)">
<el-select v-model="state.queryParams.@(@column.LowerPropertyName)" filterable placeholder="请选择@(@column.ColumnComment)" clearable @@keyup.enter.native="handleQuery(true)" > <el-select v-model="state.queryParams.@(@column.LowerPropertyName)" filterable placeholder="请选择@(@column.ColumnComment)" clearable @@keyup.enter.native="handleQuery" >
<el-option v-for="(item,index) in dl('@(@column.DictTypeCode)')" :key="index" :value="item.code" :label="`${item.name} [${item.code}] ${item.value}`" /> <el-option v-for="(item,index) in dl('@(@column.DictTypeCode)')" :key="index" :value="item.code" :label="`${item.name} [${item.code}] ${item.value}`" />
</el-select> </el-select>
</el-form-item> </el-form-item>
@ -60,7 +60,7 @@
} else if(@column.EffectType == "EnumSelector") { } else if(@column.EffectType == "EnumSelector") {
<el-col class="mb5" :xs="24" :sm="12" :md="8" :lg="6" :xl="6" v-if="state.showAdvanceQueryUI"> <el-col class="mb5" :xs="24" :sm="12" :md="8" :lg="6" :xl="6" v-if="state.showAdvanceQueryUI">
<el-form-item label="@column.ColumnComment" prop="@(@column.LowerPropertyName)"> <el-form-item label="@column.ColumnComment" prop="@(@column.LowerPropertyName)">
<el-select v-model="state.queryParams.@(@column.LowerPropertyName)" filterable placeholder="请选择@(@column.ColumnComment)" clearable @@keyup.enter.native="handleQuery(true)" > <el-select v-model="state.queryParams.@(@column.LowerPropertyName)" filterable placeholder="请选择@(@column.ColumnComment)" clearable @@keyup.enter.native="handleQuery" >
<el-option v-for="(item,index) in dl('@(@column.DictTypeCode)')" :key="index" :value="item.value" :label="`${item.name} [${item.code}] ${item.value}`" /> <el-option v-for="(item,index) in dl('@(@column.DictTypeCode)')" :key="index" :value="item.value" :label="`${item.name} [${item.code}] ${item.value}`" />
</el-select> </el-select>
</el-form-item> </el-form-item>
@ -86,7 +86,7 @@
<el-row> <el-row>
<el-col> <el-col>
<el-button-group> <el-button-group>
<el-button type="primary" icon="ele-Search" @@click="handleQuery(true)" v-auth="'@(@Model.LowerClassName):page'" :loading="options.loading"> 查询 </el-button> <el-button type="primary" icon="ele-Search" @@click="handleQuery" v-auth="'@(@Model.LowerClassName):page'" :loading="options.loading"> 查询 </el-button>
<el-button icon="ele-Refresh" @@click="resetQuery" :loading="options.loading"> 重置 </el-button> <el-button icon="ele-Refresh" @@click="resetQuery" :loading="options.loading"> 重置 </el-button>
<el-button icon="ele-ZoomIn" @@click="changeAdvanceQueryUI" v-if="!state.showAdvanceQueryUI" style="margin-left: 5px"> 高级查询 </el-button> <el-button icon="ele-ZoomIn" @@click="changeAdvanceQueryUI" v-if="!state.showAdvanceQueryUI" style="margin-left: 5px"> 高级查询 </el-button>
<el-button icon="ele-ZoomOut" @@click="changeAdvanceQueryUI" v-if="state.showAdvanceQueryUI" style="margin-left: 5px"> 隐藏 </el-button> <el-button icon="ele-ZoomOut" @@click="changeAdvanceQueryUI" v-if="state.showAdvanceQueryUI" style="margin-left: 5px"> 隐藏 </el-button>
@ -96,7 +96,7 @@
</el-card> </el-card>
<el-card class="full-table" shadow="hover" style="margin-top: 5px"> <el-card class="full-table" shadow="hover" style="margin-top: 5px">
<vxe-grid ref="xGrid" class="xGrid-style" v-bind="options" @@sort-change="sortChange"> <vxe-grid ref="xGrid" class="xGrid-style" v-bind="options" v-on="gridEvents">
<template #toolbar_buttons> <template #toolbar_buttons>
<el-button type="primary" icon="ele-Plus" @@click="handleAdd" v-auth="'@(@Model.LowerClassName):add'"> 新增 </el-button> <el-button type="primary" icon="ele-Plus" @@click="handleAdd" v-auth="'@(@Model.LowerClassName):add'"> 新增 </el-button>
</template> </template>
@ -177,15 +177,6 @@
<el-button icon="ele-Delete" size="small" text type="danger" @@click="handleDelete(row)" v-auth="'@(@Model.LowerClassName):delete'" :disabled="row.status === 1" /> <el-button icon="ele-Delete" size="small" text type="danger" @@click="handleDelete(row)" v-auth="'@(@Model.LowerClassName):delete'" :disabled="row.status === 1" />
</el-tooltip> </el-tooltip>
</template> </template>
<template #pager>
<vxe-pager
:loading="options.loading"
v-model:current-page="state.tableParams.page"
v-model:page-size="state.tableParams.pageSize"
:total="state.tableParams.total"
@@page-change="pageChange"
/>
</template>
</vxe-grid> </vxe-grid>
</el-card> </el-card>
@ -198,8 +189,10 @@
import { onMounted, reactive, ref } from 'vue'; import { onMounted, reactive, ref } from 'vue';
import { ElMessageBox, ElMessage } from "element-plus"; import { ElMessageBox, ElMessage } from "element-plus";
import { auth } from '/@@/utils/authFunction'; import { auth } from '/@@/utils/authFunction';
import { VxeGridInstance, VxePagerEvents, VxePagerDefines } from 'vxe-table';
import { useVxeTable } from '/@@/hooks/vxeTableOptionsHook'; import { VxeGridInstance, VxeGridListeners, VxeGridPropTypes } from 'vxe-table';
import { useVxeTable } from '/@/hooks/useVxeTableOptionsHook';
import { Local } from '/@/utils/storage';
@if(@Model.TableField.Any(x=>x.EffectType == "ConstSelector")){ @if(@Model.TableField.Any(x=>x.EffectType == "ConstSelector")){
@:import { codeToName, getConstType } from "/@@/utils/constHelper"; @:import { codeToName, getConstType } from "/@@/utils/constHelper";
@ -260,25 +253,25 @@ const state = reactive({
} }
} }
}, },
tableParams: { localPageParam: {
page: 1, pageSize: 50 as number,
pageSize: 50, defaultSort: { field: 'createTime', order: 'asc', descStr: 'desc' },
field: 'id', // 默认的排序字段
order: 'aes', // 排序方向
descStr: 'desc', // 降序排序的关键字符
total: 0 as any,
}, },
visible: false, visible: false,
title: '', title: '',
}); });
// 本地存储参数
const localPageParamKey = 'localPageParam:@(@Model.LowerClassName)';
// 改变高级查询的控件显示状态 // 改变高级查询的控件显示状态
const changeAdvanceQueryUI = () => { const changeAdvanceQueryUI = () => {
state.showAdvanceQueryUI = !state.showAdvanceQueryUI; state.showAdvanceQueryUI = !state.showAdvanceQueryUI;
}; };
// 表格参数配置 // 表格参数配置
const options = useVxeTable<@(@Model.ClassName)>({ const options = useVxeTable<@(@Model.ClassName)>(
{
id: '@(@Model.ClassName)', id: '@(@Model.ClassName)',
name: '@(@Model.BusName)', name: '@(@Model.BusName)',
columns: [ columns: [
@ -312,29 +305,30 @@ const options = useVxeTable<@(@Model.ClassName)>({
{ field: '', title: '修改记录', width: 100, showOverflow: 'tooltip', slots: { default: 'row_record' } }, { field: '', title: '修改记录', width: 100, showOverflow: 'tooltip', slots: { default: 'row_record' } },
{ title: '操作', fixed: 'right', width: 180, showOverflow: true, slots: { default: 'row_buttons' } }, { title: '操作', fixed: 'right', width: 180, showOverflow: true, slots: { default: 'row_buttons' } },
], ],
enableExport: auth('@(@Model.LowerClassName):export'), },
searchCallback: () => handleQuery(), // vxeGrid配置参数(此处可覆写任何参数)，参考vxe-table官方文档
queryAllCallback: () => fetchData({ pageSize: 99999 }), {
}); // 代理配置
proxyConfig: { autoLoad: true, ajax: { query: ({ page, sort }) => handleQueryApi(page, sort) } },
// 排序配置
sortConfig: { defaultSort: Local.get(localPageParamKey)?.defaultSort || state.localPageParam.defaultSort },
// 分页配置
pagerConfig: { pageSize: Local.get(localPageParamKey)?.pageSize || state.localPageParam.pageSize },
// 工具栏配置
toolbarConfig: { export: false },
// 行设置
rowConfig: { height: 80 },
}
);
// 页面初始化 // 页面初始化
onMounted(async () => { onMounted(async () => {
await handleQuery(); await handleQuery();
}); });
// 查询操作 // 查询api
const handleQuery = async (reset = false) => { const handleQueryApi = async (page: VxeGridPropTypes.ProxyAjaxQueryPageParams, sort: VxeGridPropTypes.ProxyAjaxQuerySortCheckedParams) => {
options.loading = true; const params = Object.assign(state.queryParams, { page: page.currentPage, pageSize: page.pageSize, field: sort.field, order: sort.order, descStr: 'desc' }) as @(@Model.ClassName)Input;
if (reset) state.tableParams.page = 1;
var res = await fetchData(null);
xGrid.value?.loadData(res.data.result?.items ?? []);
state.tableParams.total = res.data.result?.total;
options.loading = false;
};
// 获取数据
const fetchData = async (tableParams: any) => {
let params = Object.assign(state.queryParams, state.tableParams, tableParams);
@if (@Model.IsApiService) { @if (@Model.IsApiService) {
@:return getAPI(@(@Model.ClassName)Api).api@(@Model.ClassName)PagePost(params); @:return getAPI(@(@Model.ClassName)Api).api@(@Model.ClassName)PagePost(params);
} else { } else {
@ -342,6 +336,11 @@ const fetchData = async (tableParams: any) => {
} }
}; };
// 查询操作
const handleQuery = async (reset = false) => {
await xGrid.value?.commitProxy('query');
};
// 重置操作 // 重置操作
const resetQuery = () => { const resetQuery = () => {
state.queryParams.searchKey = undefined, state.queryParams.searchKey = undefined,
@ -350,21 +349,7 @@ const resetQuery = () => {
@:state.queryParams.@(@column.LowerPropertyName) = undefined, @:state.queryParams.@(@column.LowerPropertyName) = undefined,
} }
} }
handleQuery(true); await xGrid.value?.commitProxy('reload');
};
// 改变页码序号或页面容量
const pageChange: VxePagerEvents.PageChange = ({ currentPage, pageSize }: VxePagerDefines.PageChangeEventParams) => {
state.tableParams.page = currentPage;
state.tableParams.pageSize = pageSize;
handleQuery();
};
// 列排序
const sortChange = (options: any) => {
state.tableParams.field = options.field;
state.tableParams.order = options.order;
handleQuery();
}; };
// 打开新增页面 // 打开新增页面
@ -419,6 +404,20 @@ const handleDelete = (row: any) => {
.catch(() => {}); .catch(() => {});
}; };
// 表格事件
const gridEvents: VxeGridListeners<@(@Model.ClassName)> = {
// 只对 pager-config 配置时有效，分页发生改变时会触发该事件
async pageChange({ pageSize }) {
state.localPageParam.pageSize = pageSize;
Local.set(localPageParamKey, state.localPageParam);
},
// 当排序条件发生变化时会触发该事件
async sortChange({ field, order }) {
state.localPageParam.defaultSort = { field: field, order: order!, descStr: 'desc' };
Local.set(localPageParamKey, state.localPageParam);
},
};
@foreach (var column in Model.QueryWhetherList) { @foreach (var column in Model.QueryWhetherList) {
@if(@column.EffectType == "fk") { @if(@column.EffectType == "fk") {
@:const @LowerFirstLetter(@column.FkEntityName)@(@column.PropertyName)DropdownList = ref<any>([]); @:const @LowerFirstLetter(@column.FkEntityName)@(@column.PropertyName)DropdownList = ref<any>([]);