From b80d156b719cef2b9e4fce7e5ada5325681585a9 Mon Sep 17 00:00:00 2001 From: Your Name <123456> Date: 星期四, 14 七月 2022 11:15:57 +0800 Subject: [PATCH] Merge branch 'master' of https://sinanoaq.cn:8888/r/gtqtOut --- src/views/goalManagement/IncentiveRecording/index.vue | 208 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 208 insertions(+), 0 deletions(-) diff --git a/src/views/goalManagement/IncentiveRecording/index.vue b/src/views/goalManagement/IncentiveRecording/index.vue new file mode 100644 index 0000000..ec09aa2 --- /dev/null +++ b/src/views/goalManagement/IncentiveRecording/index.vue @@ -0,0 +1,208 @@ +<template> +<div> + <el-form ref="ruleFormRef" :model="ruleForm" status-icon label-width="20px" class="topTitle"> + <el-row> + <el-col :span="4"> + <el-form-item> + <el-input v-model="ruleForm.name" placeholder="请选择被奖惩者"> + <template #append> <el-button :icon="Search" @click="openSearch" /> </template + ></el-input> + </el-form-item> + </el-col> + <!-- <el-col :span="4"> + <el-form-item> + <el-input v-model="ruleForm.checkPass" placeholder="目标指标编号" /> + </el-form-item> + </el-col> --> + <el-col :span="4"> + <el-form-item> + <el-button type="primary" @click="submitForm(ruleFormRef)">查询</el-button> + <el-button @click="resetForm(ruleFormRef)">重置</el-button> + </el-form-item> + </el-col> + </el-row> + </el-form> + <div class="minCenter"> + <div class="btns"> + <div> + <el-button type="primary" :icon="Plus" @click="openD">新建</el-button> + <el-button type="warning" plain :icon="EditPen">修改</el-button> + <el-button type="danger" :icon="Delete" plain>删除</el-button> + </div> + <div> + <el-button :icon="Download"></el-button> + <el-button :icon="Refresh"></el-button> + </div> + </div> + <el-table ref="multipleTableRef" :data="tableData" style="width: 100%"> + <el-table-column type="selection" align="center" width="55" /> + <el-table-column label="奖惩日期" align="center" sortable> + <template #default="scope">{{ scope.row.date }}</template> + </el-table-column> + <el-table-column property="name" align="center" label="奖惩类型" sortable /> + <el-table-column property="name" align="center" label="被奖惩者" sortable /> + <el-table-column property="address" label="奖惩内容" align="center" sortable show-overflow-tooltip /> + <el-table-column property="address" label="奖惩依据" align="center" sortable show-overflow-tooltip /> + <!-- <el-table-column property="address" label="指标级别" align="center" sortable show-overflow-tooltip /> + <el-table-column property="address" label="完成期限" align="center" sortable show-overflow-tooltip /> + <el-table-column property="address" label="状态" align="center" sortable show-overflow-tooltip /> --> + <el-table-column label="操作" align="center" style="width:300px"> + <template #default> + <el-button link type="primary" size="default" :icon="View">查看</el-button> + <el-button link type="primary" size="default" :icon="EditPen">修改</el-button> + <el-button link type="primary" size="default" :icon="Delete">删除</el-button> + </template> + </el-table-column> + </el-table> + <div class="pages"> + <el-pagination + v-model:currentPage="currentPage4" + v-model:page-size="pageSize4" + :page-sizes="[100, 200, 300, 400]" + :small="small" + :disabled="disabled" + :background="background" + layout="total, sizes, prev, pager, next, jumper" + :total="400" + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + /> + </div> + <DailogAdd ref="openAdd"></DailogAdd> + <DailogSearchUser ref="openUser"></DailogSearchUser> + </div> + </div> +</template> +<script lang="ts"> +import DailogAdd from './component/DailogAdd.vue' +import DailogSearchUser from '/@/components/DailogSearchUser/index.vue' +import { ref, toRefs, reactive, onMounted, defineComponent } from 'vue'; +import { ElMessageBox, ElMessage, ElButton, ElInput, TabsPaneContext, FormInstance } from 'element-plus'; +import { Plus, Delete, Upload, Download, Refresh, View,EditPen,Search} from '@element-plus/icons-vue'; +interface User { + date: string; + name: string; + address: string; +} +import type { TableColumnCtx } from 'element-plus/es/components/table/src/table-column/defaults'; +export default defineComponent({ + components: { ElButton, ElInput,DailogAdd,DailogSearchUser }, + setup() { + // 搜索条件 + const ruleForm = reactive({ + pass: '', + checkPass: '', + }); + + const formatter = (row: User, column: TableColumnCtx<User>) => { + return row.address; + }; + + const tableData: User[] = [ + { + date: '2016-05-03', + name: 'Tom', + address: 'No. 189, Grove St, Los Angeles', + }, + { + date: '2016-05-02', + name: 'Tom', + address: 'No. 189, Grove St, Los Angeles', + }, + { + date: '2016-05-04', + name: 'Tom', + address: 'No. 189, Grove St, Los Angeles', + }, + { + date: '2016-05-01', + name: 'Tom', + address: 'No. 189, Grove St, Los Angeles', + }, + { + date: '2016-05-08', + name: 'Tom', + address: 'No. 189, Grove St, Los Angeles', + }, + { + date: '2016-05-06', + name: 'Tom', + address: 'No. 189, Grove St, Los Angeles', + }, + { + date: '2016-05-07', + name: 'Tom', + address: 'No. 189, Grove St, Los Angeles', + }, + ]; + const currentPage4 = ref(4); + const pageSize4 = ref(100); + const small = ref(false); + const disabled = ref(false); + const background = ref(false); + const handleSizeChange = (val: number) => { + console.log(`${val} items per page`); + }; + const handleCurrentChange = (val: number) => { + console.log(`current page: ${val}`); + }; + // 弹窗 + const openAdd = ref(); + const openD = () => { + openAdd.value.openDailog(); + }; + const openUser =ref(); + const openSearch=()=>{ + openUser.value.openDailog() + } + return { + + tableData, + formatter, + currentPage4, + pageSize4, + handleSizeChange, + handleCurrentChange, + openAdd, + openD, + small, + disabled, + background, + ruleForm, + openUser, + openSearch, + Plus, + Delete, + Upload, + Download, + Refresh, + View, + EditPen, + Search + }; + }, +}); +</script> +<style scoped> +.minCenter { + width: 100%; + background-color: #fff; + margin-top: 10px; + padding: 0 20px; +} +.topTitle { + background-color: #fff; + padding: 20px 0px 20px 0px; + margin-bottom:10px ; +} +.btns { + padding: 10px 0px 10px 0px; + display: flex; + justify-content: space-between; +} +.pages { + padding: 20px 0; + display: flex; + justify-content: right; +} +</style> \ No newline at end of file -- Gitblit v1.9.2