AiDOPWarehouse/Admin.NET/Admin.NET.Web.Entry/wwwroot/Template/index.vue - Copy (2).cshtml

@Model  Admin.Net.Core.CustomEngine
<template>
  <div class="@(@Model.ClassName)-container">
    <el-card shadow="hover" :body-style="{ paddingBottom: '0' }">
		          
@if(Model.QueryWhetherList.Count > 0){
     @:<el-form :model="queryParams" ref="queryForm" :inline="true">
		 @:<a-row>
foreach (var column in Model.QueryWhetherList){
    if(@column.EffectType == "Input" || @column.EffectType == "InputTextArea"){
       @:<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" >
       @:<el-form-item label="@column.ColumnComment">
       @:<el-input v-model="queryParam.@(@column.ColumnName)" clearable placeholder="请输入@(@column.ColumnComment)"/>
       @:</el-form-item>
       @:</el-col>
    }else if(@column.EffectType == "InputTextArea"){
		@:<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" >
        @:<el-form-item label="@column.ColumnComment">
        @:<el-input-number v-model="queryParam.@(@column.ColumnName)"  clearable placeholder="请输入@(@column.ColumnComment)"/>
        @:</el-form-item>
        @:</el-col>
    }else if(@column.EffectType == "InputNumber"){
		@:<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" >
        @:<el-form-item label="@column.ColumnComment">
        @:<el-input-number v-model="queryParam.@(@column.ColumnName)"  clearable placeholder="请输入@(@column.ColumnComment)"/>
        @:</el-form-item>
        @:</el-col>
    }else if(@column.EffectType == "fk"){
        @:<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" >
        @:<el-form-item label="@column.ColumnComment">
        @:<el-select clearable v-model="queryParam.@(@column.ColumnName)" placeholder="请选择@(@column.ColumnComment)">
        @:<el-select-option v-for="(item,index) in get@(@column.FkEntityName)DropdownList" :key="index" :value="item.vaue">{{ item.label }}</el-select-option>
        @:</el-select>
        @:</el-form-item>
        @:</el-col>
    }else if(@column.EffectType == "Select"){
         @:<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" >
         @:<el-form-item label="@column.ColumnComment">
         @:<el-select clearable v-model="queryParam.@(@column.ColumnName)" placeholder="请选择@(@column.ColumnComment)">
         @:<el-select-option v-for="(item,index) in getDictDataDropdownList('@(@column.DictTypeCode)')" :key="index" :value="item.code">{{ item.name }}</el-select-option>
         @:</el-select>
         @:</el-form-item>
         @:</el-col>
    }else if(@column.EffectType == "DatePicker"){
        @:<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" >
        @:<el-form-item label="@column.ColumnComment">
        @:<el-date-picker placeholder="请选择@(@column.ColumnComment)" v-model="queryParam.@(@column.ColumnName)Date" />
        @:</el-form-item>
        @:</el-col>
    }
			@:<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" >
             @: <span class="table-page-search-submitButtons">
                @: <el-button icon="ele-Refresh" @@click="() => queryParam = {}"> 重置 </el-button>
              @: <el-button type="primary" icon="ele-Search" @@click="handleQuery" v-auth="'@(@Model.ClassName):page'"> 查询 </el-button>
				@:  <el-button icon="ele-Plus" @@click="openAdd@(@Model.ClassName)" v-auth="'@(@Model.ClassName):add'"> 新增 </el-button>  
             @: </span>
           @: </el-col>
          @:</a-row>
        @:</a-form>
}
}
      
    </a-card>
    <a-card :bordered="false">
	<el-table 
		:data="userData" 
		style="width: 100%" 
		v-loading="loading" 
		tooltip-effect="light"
		row-key="id"
		border>
		<el-table-column type="index" label="序号" width="55" align="center" fixed />
		@foreach (var column in Model.TableField){		   
		     if(@column.WhetherTable == "Y"){
			     if(@column.EffectType == "Upload"||@column.EffectType == "fk"||@column.EffectType == "Switch"||@column.EffectType == "ConstSelector"){
				 @: <el-table-column prop="@column.ColumnName" label="@column.ColumnComment" fixed show-overflow-tooltip>
					    @:<template #default="scope">
			                if(@column.EffectType == "Upload"){
								@:<el-image
							        @:style="width: 60px; height: 60px"
							        @::src="scope.row.url"
							        @::lazy="true"
							        @::hide-on-click-modal="true"
							        @::preview-src-list="[scope.row.url]"
							        @::initial-index="0"
							        @:fit="scale-down"
							        @:preview-teleported
						         @:/>
                            }else if(@column.EffectType == "fk"){
                                @:<span>{{scope.row.fk@(@column.ColumnName).@(@column.LowerFkColumnName)}}</span>
                            }else if(@column.EffectType == "Switch"){
								@:<el-tag v-if="scope.row.@(@column.LowerColumnName)"> 是 </el-tag>
								@:<el-tag type="danger" v-else> 否 </el-tag>
                            }else if(@column.EffectType == "ConstSelector"){
								@:<span>{{codeToName(scope.row.@(@column.LowerColumnName), '@(@column.DictTypeCode)')}</span>
                            }
					    @:</template>
					@:</el-table-column>
			     }
                 else {
				    @: <el-table-column prop="@column.ColumnName" label="@column.ColumnComment" fixed show-overflow-tooltip />
				 }
		    }
			}
			           <el-table-column label="操作" width="110" align="center" fixed="right" show-overflow-tooltip v-if="auth('@(@Model.ClassName):edit') || auth('@(@Model.ClassName):delete')">
							<template #default="scope">
								<el-button icon="ele-Edit" size="small" text type="primary" @@click="openEdit@(@Model.ClassName)(scope.row)" v-auth="'@(@Model.ClassName):update'"> 编辑 </el-button>
								<el-button icon="ele-Edit" size="small" text type="primary" @@click="del@(@Model.ClassName)(scope.row)" v-auth="'@(@Model.ClassName):delete'"> 删除 </el-button>								
							</template>
		</el-table-column>
	</el-table>
	<el-pagination
		v-model:currentPage="tableParams.page"
		v-model:page-size="tableParams.pageSize"
		:total="tableParams.total"
		:page-sizes="[10, 20, 50, 100]"
		small
		background
		@@size-change="handleSizeChange"
		@@current-change="handleCurrentChange"
		layout="total, sizes, prev, pager, next, jumper"
	/>	 
<editDialog ref="editDialogRef" :title="edit@(@Model.ClassName)Title"/>
    </a-card>
  </div>
</template>

<script lang="ts">
	import { ref, toRefs, reactive, onMounted, defineComponent, getCurrentInstance, onUnmounted } from 'vue';
    import { ElMessageBox, ElMessage } from 'element-plus';
	import { auth } from '/@@/utils/authFunction';
	import { formatDate } from '/@@/utils/formatTime';
	
	import editDialog from '/@@/views/main/@(@Model.ClassName)/component/editDialog.vue'
	import { get@(@Model.ClassName)Page, delete@(@Model.ClassName) } from '/@@/api/main/@(@Model.ClassName)';
@foreach (var column in Model.QueryWhetherList){
	if(@column.EffectType == "fk"){
  @:import { get@(@column.FkEntityName)Dropdown } from '/@@/api/main/@(@Model.ClassName)';		
	}
}
@foreach (var column in Model.QueryWhetherList){
	if(@column.EffectType == "Select"){
  @:import { getDictDataDropdown } from '/@@/api/system/admin';
  break;
	}
}	
	export default defineComponent({
	    name: '@(@Model.ClassName)',
		components: { editDialog },
		setup() {
		    const { proxy } = getCurrentInstance() as any;
			const editDialogRef = ref();
			const state = reactive({
			    loading: false,
			    tableData: [] as any,
			    queryParams: {} as any,
			    tableParams: {
				    page: 1,
				    pageSize: 10,
				    total: 0 as any,
			    },
			    edit@(@Model.ClassName)Title: '',
		    });
			
			onMounted(async () => {
			    handleQuery();

			    proxy.mittBus.on('submitRefresh', () => {
				    handleQuery();
			    });
		    });
			
		    onUnmounted(() => {
			    proxy.mittBus.off('submitRefresh');
		    });	
			
			// 查询操作
		    const handleQuery = async () => {
			    state.loading = true;
			    var res = await get@(@Model.ClassName)Page(Object.assign(state.queryParams, state.tableParams));
			    state.tableData = res.data.result?.items ?? [];
			    state.tableParams.total = res.data.result?.total;
			    state.loading = false;
		    };
			
			// 打开新增页面
		    const openAdd@(@Model.ClassName) = () => {
			    state.edit@(@Model.ClassName)Title = '添加@(@Model.BusName)';
			    editDialogRef.value.openDialog({});
		    };
			
		    // 打开编辑页面
		    const openEdit@(@Model.ClassName) = (row: any) => {
			    state.edit@(@Model.ClassName)Title = '编辑@(@Model.BusName)';
			    editDialogRef.value.openDialog(row);
		    };
			
		    // 删除
		    const del@(@Model.ClassName) = (row: any) => {
			    ElMessageBox.confirm(`确定要删除吗?`, '提示', {
				    confirmButtonText: '确定',
				    cancelButtonText: '取消',
				    type: 'warning',
			    })
				    .then(async () => {
					    await delete@(@Model.ClassName)(row);
					    handleQuery();
					    ElMessage.success('删除成功');
				    })
				    .catch(() => {});
		    };
			
		    // 改变页面容量
		    const handleSizeChange = (val: number) => {
			    state.tableParams.pageSize = val;
			    handleQuery();
		    };
			
		    // 改变页码序号
		    const handleCurrentChange = (val: number) => {
			    state.tableParams.page = val;
			    handleQuery();
		    };
			
@foreach (var column in Model.QueryWhetherList){
	if(@column.EffectType == "fk"){
			@:const get@(@column.FkEntityName)DropdownList = await () => {
				@:let list = await get@(@column.FkEntityName)Dropdown();
			    @:return list.data.result ?? [];
		    @:};
			break;
	}
}

@foreach (var column in Model.QueryWhetherList){
	if(@column.EffectType == "Select"){
			@:const getDictDataDropdownList = await (val: any) => {
				@:let list = await getDictDataDropdownList(val);
			    @:return list.data.result ?? [];
		    @:};
			break;
	}
}
            return {
			    handleQuery,
			    editDialogRef,
			    openAdd@(@Model.ClassName),
			    openEdit@(@Model.ClassName),
			    del@(@Model.ClassName),
			    handleSizeChange,
			    handleCurrentChange,
			    formatDate,
@foreach (var column in Model.QueryWhetherList){
	if(@column.EffectType == "fk"){
			@:get@(@column.FkEntityName)DropdownList,
			break;
	}
}
@foreach (var column in Model.QueryWhetherList){
	if(@column.EffectType == "Select"){
			@:getDictDataDropdownList,
			break;
	}
}				
			    auth,
			    ...toRefs(state),
		   };
		}
	})
</script>