yxq
1年前
5個のファイルの変更、442行の追加、36行の削除
分割表示
差分オプション
-
+440 -36Learun.Framework.Ultimate V7/Learun.Application.Web/Areas/PersonnelManagement/Views/Gz_Amounts/Index.cshtml
-
+1 -0Learun.Framework.Ultimate V7/Learun.Application.Web/Content/elementui/element-ui@2.15.13.css
-
+1 -0Learun.Framework.Ultimate V7/Learun.Application.Web/Content/elementui/element-ui@2.15.13.js
-
バイナリLearun.Framework.Ultimate V7/Learun.Application.Web/Content/elementui/fonts/element-icons.ttf
-
バイナリLearun.Framework.Ultimate V7/Learun.Application.Web/Content/elementui/fonts/element-icons.woff
+ 440
- 36
Learun.Framework.Ultimate V7/Learun.Application.Web/Areas/PersonnelManagement/Views/Gz_Amounts/Index.cshtml
ファイルの表示
| @@ -1,40 +1,444 @@ | |||
| @{ | |||
| ViewBag.Title = "工资明细信息"; | |||
| Layout = "~/Views/Shared/_Index.cshtml"; | |||
| } | |||
| <div class="lr-layout" id="lr_layout"> | |||
| @*<div class="lr-layout-left"> | |||
| <div class="lr-layout-wrap"> | |||
| <div class="lr-layout-title">树形目录</div> | |||
| <div id="tree" class="lr-layout-body"></div> | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="UTF-8"> | |||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |||
| <title>Document</title> | |||
| <link rel="stylesheet" href="~/Content/elementui/element-ui@2.15.13.css"> | |||
| <script src="~/Content/vue/vue.js"></script> | |||
| <script src="~/Content/elementui/element-ui@2.15.13.js"></script> | |||
| <script src="~/Content/jquery/jquery-1.10.2.min.js"></script> | |||
| </head> | |||
| <body> | |||
| <div id="app" style="height:100%"> | |||
| <el-row :gutter="14" style="margin-bottom:12px"> | |||
| <el-col :span="4"> | |||
| <el-input placeholder="请输入教职工编号/姓名进行查询" v-model="query.keyword" clearable size="small"></el-input> | |||
| </el-col> | |||
| <el-col :span="4"> | |||
| <el-select v-model="query.value" clearable size="small" placeholder="请选择部门"> | |||
| <el-option label="123123" value="123"></el-option> | |||
| <el-option label="456" value="222"></el-option> | |||
| </el-select> | |||
| </el-col> | |||
| <el-col :span="4"> | |||
| <el-date-picker size="small" | |||
| v-model="query.time" | |||
| type="daterange" | |||
| start-placeholder="开始日期" | |||
| end-placeholder="结束日期" | |||
| value-format="yyyy-MM-dd"> | |||
| </el-date-picker> | |||
| </el-col> | |||
| <el-col :span="2"> | |||
| <a class="btn btn-default" v-on:click="search"><i class="el-icon-search" style="margin-right:4px"></i>查询</a> | |||
| </el-col> | |||
| <el-col :span="10" style="display: flex;justify-content: right;"> | |||
| <a v-on:click="refresh" class="btn btn-default" style="margin-right:8px;font-size:14px"><i class="el-icon-refresh"></i></a> | |||
| <a class="btn btn-default" v-on:click="detailShow"><i class="el-icon-edit-outline" style="margin-right:4px"></i>查看</a> | |||
| <a class="btn btn-default" v-on:click="importantData"><i class="el-icon-download" style="margin-right:4px"></i>导入</a> | |||
| <a class="btn btn-default" v-on:click="del"><i class="el-icon-delete" style="margin-right:4px"></i>删除</a> | |||
| </el-col> | |||
| </el-row> | |||
| <div style="height:calc(100% - 80px)"> | |||
| <el-table :data="tableData" | |||
| height="100%" | |||
| size="mini" | |||
| :cell-style="{paddingTop:'2px',paddingBottom:'2px'}" | |||
| :header-row-style="{color:'#606266',fontWeight:400}" | |||
| :header-cell-style="{paddingTop:'2px',paddingBottom:'2px'}" | |||
| border | |||
| v-on:selection-change="handleSelectionChange"> | |||
| <el-table-column type="index" | |||
| width="38" | |||
| align="center"> | |||
| </el-table-column> | |||
| <el-table-column align="center" | |||
| type="selection" | |||
| width="44"> | |||
| </el-table-column> | |||
| <template v-for="item in fixedColumn"> | |||
| <el-table-column :prop="item.prop" | |||
| show-overflow-tooltip | |||
| :label="item.label"> | |||
| </el-table-column> | |||
| </template> | |||
| </el-table> | |||
| </div> | |||
| </div>*@ | |||
| <div class="lr-layout-center"> | |||
| <div class="lr-layout-wrap"> | |||
| <div class="lr-layout-title">标题</div> | |||
| <div class="lr-layout-tool"> | |||
| <div class="lr-layout-tool-left"> | |||
| <div class="lr-layout-tool-item"> | |||
| <input id="txt_Keyword" type="text" class="form-control" placeholder="请输入要查询关键字" /> | |||
| </div> | |||
| <div class="lr-layout-tool-item"> | |||
| <a id="btn_Search" class="btn btn-primary btn-sm"><i class="fa fa-search"></i> 查询</a> | |||
| </div> | |||
| </div> | |||
| <div class="lr-layout-tool-right"> | |||
| <div class=" btn-group btn-group-sm"> | |||
| <a id="lr_refresh" class="btn btn-default"><i class="fa fa-refresh"></i></a> | |||
| </div> | |||
| <div class=" btn-group btn-group-sm" learun-authorize="yes"> | |||
| <a id="lr_add" class="btn btn-default"><i class="fa fa-plus"></i> 新增</a> | |||
| <a id="lr_edit" class="btn btn-default"><i class="fa fa-pencil-square-o"></i> 编辑</a> | |||
| <a id="lr_delete" class="btn btn-default"><i class="fa fa-trash-o"></i> 删除</a> | |||
| <a id="lr_import" class="btn btn-default"><i class="fa fa-edit"></i> 导入</a> | |||
| </div> | |||
| <div style="padding: 6px 0;display: flex;justify-content: center;"> | |||
| <el-pagination v-on:size-change="handleSizeChange" background | |||
| v-on:current-change="handleCurrentChange" | |||
| :current-page="currentPage" | |||
| :page-sizes="[30, 100, 200]" | |||
| :page-size="pageSize" | |||
| layout="total, sizes, prev, pager, next, jumper" | |||
| :total="total"> | |||
| </el-pagination> | |||
| </div> | |||
| <!-- 导入 --> | |||
| <el-dialog title="导入" | |||
| :visible.sync="dialogVisible" | |||
| :close-on-click-modal="false" | |||
| width="456px" | |||
| :before-close="handleClose"> | |||
| <div style="margin: 0 auto;width: 360px;"> | |||
| <el-date-picker style="margin-bottom: 12px;" | |||
| v-model="month" | |||
| size="small" | |||
| type="month" | |||
| value-format="yyyy-MM" | |||
| placeholder="选择月"> | |||
| </el-date-picker> | |||
| <el-upload v-if="ready" | |||
| action="#" | |||
| class="upload-demo" | |||
| drag | |||
| :show-file-list="false" | |||
| :multiple="false" | |||
| :accept="'.' + accept.join(',.')" | |||
| :limit="1" | |||
| :auto-upload="false" | |||
| :on-change="handleChange" | |||
| :disabled="isUploading"> | |||
| <i class="el-icon-upload"></i> | |||
| <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div> | |||
| <div class="el-upload__tip" slot="tip">只能上传{{accept.join('/')}}文件，且不超过{{size}}mb</div> | |||
| </el-upload> | |||
| <div v-for="item in fileList" style="width: 360px;margin: 0 auto;padding-top: 16px;"> | |||
| <div class="el-icon el-icon-document">{{ item.name }}</div> | |||
| </div> | |||
| </div> | |||
| <div class="lr-layout-body" id="gridtable"></div> | |||
| </div> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button v-on:click="handleClose" size="small">取 消</el-button> | |||
| <el-button type="primary" v-on:click="confirm" size="small">确 定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| <!-- 查看详情 --> | |||
| <el-dialog title="详情" | |||
| :visible.sync="dialogVisible1" | |||
| :close-on-click-modal="false" | |||
| width="1200px"> | |||
| <div> | |||
| <el-table :data="detailData" | |||
| border | |||
| show-overflow-tooltip | |||
| height="500"> | |||
| <template v-for="item in fixedColumn"> | |||
| <el-table-column :prop="item.prop" | |||
| :label="item.label"> | |||
| </el-table-column> | |||
| </template> | |||
| <template v-for="item in trendsColumn"> | |||
| <el-table-column :prop="item.prop" | |||
| :label="item.label"> | |||
| </el-table-column> | |||
| </template> | |||
| </el-table> | |||
| </div> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button v-on:click="dialogVisible1 = false" size="small">关 闭</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </div> | |||
| @Html.AppendJsFile("/Areas/PersonnelManagement/Views/Gz_Amounts/Index.js") | |||
| <script> | |||
| var vm = new Vue({ | |||
| el: '#app', | |||
| data() { | |||
| return { | |||
| query: {}, | |||
| tableData: [], | |||
| multipleSelection: [], | |||
| currentPage: 1, | |||
| pageSize: 30, | |||
| total: 0, | |||
| //固定列 | |||
| fixedColumn: [ | |||
| { prop: 'UserNo', label: '部门名称' }, | |||
| { prop: 'UserNo', label: '部门名称' }, | |||
| { prop: 'UserNo', label: '职员类型代码' }, | |||
| { prop: 'UserNo', label: '职员类型' }, | |||
| { prop: 'UserNo', label: '职员代码' }, | |||
| { prop: 'UserNo', label: '职员姓名' }, | |||
| { prop: 'CreateTime', label: '发放时间' }, | |||
| { prop: 'UserNo', label: '发放次数' }, | |||
| { prop: 'UserNo', label: '扣款合计' }, | |||
| { prop: 'UserNo', label: '职员类型代码' }, | |||
| { prop: 'Year', label: '发放年份' }, | |||
| { prop: 'Month', label: '发放月份' }, | |||
| { prop: 'Amount', label: '实发合计' }, | |||
| { prop: 'UserNo', label: '备注' }, | |||
| { prop: 'UserNo', label: '审核人' } | |||
| ], | |||
| // 导入 | |||
| dialogVisible: false, | |||
| fileList: [], | |||
| isUploading: false, | |||
| accept: ['xls', 'xlsx'], | |||
| size: 10, | |||
| ready: true, | |||
| frequently: false, | |||
| month: '', | |||
| // 查看详情 | |||
| dialogVisible1: false, | |||
| detailData: [], | |||
| trendsColumn: [] | |||
| } | |||
| }, | |||
| mounted() { | |||
| this.init() | |||
| }, | |||
| methods: { | |||
| init() { | |||
| this.getTableData() | |||
| }, | |||
| NetRequest(url, data, method = "POST") { | |||
| let _this = this | |||
| return new Promise((resolve) => { | |||
| $.ajax({ | |||
| type: method, | |||
| data, | |||
| contentType: false, | |||
| processData: false, | |||
| dataType: "json", | |||
| async: false, | |||
| cache: false, | |||
| url: top.$.rootUrl + url, | |||
| success: function (res) { | |||
| if (res.code == 200) { | |||
| resolve(res.data); | |||
| } else { | |||
| _this.$message.error(res.info || "请求失败！"); | |||
| resolve(false); | |||
| } | |||
| }, | |||
| error: function (error) { | |||
| _this.$message.error("请求出错！"); | |||
| resolve(false); | |||
| }, | |||
| }); | |||
| }); | |||
| }, | |||
| handleSizeChange(val) { | |||
| this.pageSize = val | |||
| this.currentPage = 1 | |||
| this.getTableData() | |||
| }, | |||
| handleCurrentChange(val) { | |||
| this.currentPage = val | |||
| this.getTableData() | |||
| }, | |||
| refresh() { | |||
| location.reload() | |||
| }, | |||
| async getTableData() { | |||
| let getParams = { | |||
| pagination: JSON.stringify({ | |||
| rows: this.pageSize, page: this.currentPage, sidx: '', sord: "DESC", | |||
| }), | |||
| queryJson: JSON.stringify(this.query) | |||
| } | |||
| let result = await this.NetRequest('/PersonnelManagement/Gz_Amounts/GetPageList', $.param(getParams), 'get') | |||
| this.tableData = result.rows | |||
| this.total = result.records | |||
| }, | |||
| search() { | |||
| this.currentPage = 1 | |||
| this.getTableData() | |||
| }, | |||
| handleSelectionChange(val) { | |||
| this.multipleSelection = val; | |||
| }, | |||
| // 删除 | |||
| del() { | |||
| let ids = this.multipleSelection.map(e => e.id).toString() | |||
| if (!ids) { | |||
| this.$message.warning('请选择需要删除的数据！') | |||
| return | |||
| } | |||
| this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', { | |||
| confirmButtonText: '确定', | |||
| cancelButtonText: '取消', | |||
| type: 'warning' | |||
| }).then(async() => { | |||
| let res = await this.NetRequest('/PersonnelManagement/Gz_Amounts/DeleteForm', { keyValue: ids }) | |||
| if (res) { | |||
| this.$message.success('删除成功！') | |||
| } | |||
| }) | |||
| }, | |||
| // 导入 | |||
| importantData() { | |||
| this.dialogVisible = true | |||
| }, | |||
| initUpload() { | |||
| this.ready = false; | |||
| this.$nextTick(() => { | |||
| this.ready = true; | |||
| }); | |||
| }, | |||
| beforeAvatarUpload(file) { | |||
| let fileRaw = file.raw; | |||
| let typeArr = fileRaw.name.split("."); | |||
| let type = typeArr[typeArr.length - 1].toLowerCase(); | |||
| const isType = this.accept.length ? this.accept.includes(type) : true; | |||
| const isSize = fileRaw.size / 1024 / 1024 < this.size; | |||
| if (!isType || !isSize) { | |||
| if (this.frequently) return false; | |||
| this.frequently = true; | |||
| setTimeout(() => { | |||
| this.frequently = false; | |||
| }, 500); | |||
| if (!isType) { | |||
| // this.$message.error( | |||
| // `上传文件只能是 ${this.accept.join(" / ")} 格式!` | |||
| // ); | |||
| this.$message.warning('上传文件格式错误！') | |||
| } else if (!isSize) { | |||
| this.$message.warning('上传文件大小过大！') | |||
| // this.$message.error(`上传文件大小不能超过 ${this.size}MB!`); | |||
| } | |||
| return false; | |||
| } | |||
| return true; | |||
| }, | |||
| handleChange(file, fileList) { | |||
| this.initUpload(); | |||
| if (!this.beforeAvatarUpload(file)) { | |||
| return; | |||
| } | |||
| this.fileList = [{ | |||
| ...fileList[fileList.length - 1], | |||
| originalName: fileList[fileList.length - 1].name, | |||
| }]; | |||
| }, | |||
| uploadFile(file) { | |||
| return new Promise((resolve) => { | |||
| let formData = new FormData(); | |||
| formData.append("file", file.raw); | |||
| NetRequest('learun/nologin/adms/annexes/upload', formData) | |||
| .then((res) => { | |||
| if (res) { | |||
| resolve(res); | |||
| } else { | |||
| resolve(false); | |||
| } | |||
| }) | |||
| .catch(() => { | |||
| resolve(false); | |||
| }); | |||
| }); | |||
| }, | |||
| async upload() { | |||
| this.isUploading = true; | |||
| let flag = true; | |||
| for (const index in this.fileList) { | |||
| let file = this.fileList[index]; | |||
| if (file.status == "ready") { | |||
| res = await this.uploadFile(file); | |||
| } | |||
| if (file) { | |||
| this.fileList[index].status = "success"; | |||
| this.fileList[index].res = res; | |||
| this.fileList.splice(1, 0); | |||
| } else { | |||
| flag = false; | |||
| break; | |||
| } | |||
| } | |||
| this.isUploading = false; | |||
| return flag; | |||
| }, | |||
| async confirm() { | |||
| if (!this.month) { | |||
| this.$message.warning('请选择月份！') | |||
| return | |||
| } | |||
| if (!this.fileList.length) { | |||
| this.$message.warning('请选择上传文件！') | |||
| return | |||
| } | |||
| let params = { | |||
| month: this.month, | |||
| } | |||
| console.log('提交数据-----', params) | |||
| const formData = new FormData(); | |||
| formData.append('data', JSON.stringify({ strEntity: JSON.stringify(params) })) | |||
| let res = await this.NetRequest('/PersonnelManagement/Gz_Amounts/GzImport', formData) | |||
| if (res) { | |||
| this.$message.success('导入成功！') | |||
| this.handleClose() | |||
| } | |||
| }, | |||
| handleClose() { | |||
| this.month = '' | |||
| this.fileList = [] | |||
| this.dialogVisible = false | |||
| }, | |||
| // 查看详情 | |||
| async detailShow() { | |||
| if (this.multipleSelection.length!=1) { | |||
| this.$message.warning('请选择一条数据进行查看！') | |||
| return | |||
| } | |||
| this.detailData = [] | |||
| let result = await this.NetRequest('/PersonnelManagement/Gz_Amounts/SaveForm', $.param({ keyValue: this.multipleSelection[0].id }), 'get') | |||
| this.trendsColumn = [{ porp: 'aaa', label: '动态1' }] | |||
| this.dialogVisible1 = true | |||
| }, | |||
| } | |||
| }) | |||
| </script> | |||
| <style> | |||
| html { | |||
| width: calc(100% - 2px); | |||
| height: calc(100% - 2px); | |||
| background: #F8F8F8; | |||
| box-sizing: border-box; | |||
| } | |||
| body { | |||
| border: 1px solid #CCCCCC; | |||
| border-radius: 4px; | |||
| background: #fff; | |||
| padding: 12px; | |||
| height: calc(100% - 16px); | |||
| box-sizing: border-box; | |||
| } | |||
| .el-input, | |||
| .el-select, | |||
| .el-date-editor.el-input, | |||
| .el-date-editor.el-input__inner { | |||
| width: 100%; | |||
| } | |||
| .btn { | |||
| display: inline-block; | |||
| padding: 6px 12px; | |||
| margin-bottom: 0; | |||
| font-size: 14px; | |||
| font-weight: 400; | |||
| line-height: 1.42857143; | |||
| text-align: center; | |||
| white-space: nowrap; | |||
| vertical-align: middle; | |||
| -ms-touch-action: manipulation; | |||
| touch-action: manipulation; | |||
| cursor: pointer; | |||
| -webkit-user-select: none; | |||
| -moz-user-select: none; | |||
| -ms-user-select: none; | |||
| user-select: none; | |||
| background-image: none; | |||
| border: 1px solid transparent; | |||
| border-radius: 4px; | |||
| } | |||
| .btn-default { | |||
| color: #333; | |||
| background-color: #fff; | |||
| border-color: #ccc; | |||
| } | |||
| </style> | |||
| </body> | |||
| </html> | |||