| src/api/ReportManager.js | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| src/router/index.js | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| src/store/modules/user.js | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| src/views/statistic/groupSalaryList.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| src/views/statistic/personSalaryList.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 |
src/api/ReportManager.js
@@ -17,3 +17,49 @@ params: data }) } // çç»å·¥èµæ¥è¡¨è®°å½æ¥è¯¢ export function GroupSalaryReportSearch(data) { return request({ url: 'ReportManager/GroupSalaryReportSearch', method: 'get', params: data }) } // çç»å·¥èµæ¥è¡¨è®°å½æ¥è¯¢ export function GroupSalaryReportExcelSearch(data) { return request({ url: 'ReportManager/GroupSalaryReportExcelSearch', method: 'get', params: data }) } // çç»å·¥èµæ¥è¡¨è®°å½æ¥çæ¥å·¥äººå export function GroupSalaryReportSearchUser(data) { return request({ url: 'ReportManager/GroupSalaryReportSearchUser', method: 'get', params: data }) } // 人åå·¥èµæç»æ¥è¡¨ export function PeopleSalaryReportSearch(data) { return request({ url: 'ReportManager/PeopleSalaryReportSearch', method: 'get', params: data }) } // 人åå·¥èµæç»æ¥è¡¨å¯¼åº export function PeopleSalaryReportExcelSearch(data) { return request({ url: 'ReportManager/PeopleSalaryReportExcelSearch', method: 'get', params: data }) } src/router/index.js
@@ -502,6 +502,20 @@ code: '1043', component: () => import('@/views/statistic/inProcessList'), meta: { code: '1043', title: 'å¨å¶å表', icon: '', keepAlive: true } }, { path: 'groupSalaryList', name: 'groupSalaryListCancel', code: '0702', component: () => import('@/views/statistic/groupSalaryList'), meta: { code: '0702', title: 'çç»å·¥èµç»è®¡æ¥è¡¨', icon: '', keepAlive: true } }, { path: 'personSalaryList', name: 'personSalaryListCancel', code: '0703', component: () => import('@/views/statistic/personSalaryList'), meta: { code: '0703', title: '人åå·¥èµç»è®¡æ¥è¡¨', icon: '', keepAlive: true } } ] src/store/modules/user.js
@@ -81,9 +81,9 @@ torg_code: localStorage.getItem('torg_code') }).then(res => { if (res.code === '200') { // ButtonData().then(res2 => { // localStorage.setItem('ButtonData', JSON.stringify(res2.data)) // }) ButtonData().then(res2 => { localStorage.setItem('ButtonData', JSON.stringify(res2.data)) }) commit('SET_NAME', res.message) commit('SET_MENU', res.data) src/views/statistic/groupSalaryList.vue
¶Ô±ÈÐÂÎļþ @@ -0,0 +1,857 @@ <template> <div> <div class="body" :style="{height:mainHeight+'px'}"> <div class="bodyTopButtonGroup" style="justify-content: space-between"> <el-button v-waves type="primary" icon="el-icon-download" @click="download">导åº</el-button> <!-- <div--> <!-- style="color: red;margin: 10px 5px 0 0;"--> <!-- >å½åæ¥è¡¨åªç»è®¡èªå¶ä»¶å·¥åº--> <!-- </div>--> <!-- <div class="topRight" style="display: flex;align-items: center">--> <!-- <el-select--> <!-- v-model="form.rejectstepcode"--> <!-- style="width: 170px;"--> <!-- multiple--> <!-- placeholder="è¯·éæ©åé¤å·¥åº"--> <!-- collapse-tags--> <!-- filterable--> <!-- clearable--> <!-- @change="getGroupSalaryReportSearch"--> <!-- >--> <!-- <el-option--> <!-- v-for="item in StepSelectArr"--> <!-- :key="item.stepcode"--> <!-- :label="item.stepname"--> <!-- :value="item.stepcode"--> <!-- />--> <!-- </el-select>--> <!-- </div>--> </div> <div class="bodyTopFormGroup"> <el-form ref="form" :model="form" label-width="100px" inline style="display: flex;" > <div class="elForm"> <el-form-item label="å·¥åç¼å·" style="display: flex;"> <el-input v-model="form.wocode" placeholder="请è¾å ¥" style="width: 200px" /> </el-form-item> <el-form-item label="产åç¼ç " style=" display: flex;"> <el-input v-model="form.partcode" placeholder="请è¾å ¥" style="width: 200px" /> </el-form-item> <el-form-item label="产ååç§°" style=" display: flex;"> <el-input v-model="form.partname" style="width: 200px" placeholder="请è¾å ¥" /> </el-form-item> <el-form-item label="è§æ ¼åå·" style=" display: flex;"> <el-input v-model="form.partspec" style="width: 200px" placeholder="请è¾å ¥" /> </el-form-item> <el-form-item v-show="isExpandForm" label="å·¥åºåç§°" style="display: flex;"> <el-input v-model="form.stepname" style="width: 200px" placeholder="请è¾å ¥" /> </el-form-item> <el-form-item v-show="isExpandForm" label="ç产çç»" style=" display: flex;"> <el-select v-model="form.groupcode" style="width: 200px" placeholder="è¯·éæ©"> <el-option v-for="item in groupArr" :key="item.usergroupcode" :label="item.usergroupname" :value="item.usergroupcode" /> </el-select> </el-form-item> <el-form-item v-show="isExpandForm" label="æä½äººå" style=" display: flex;"> <el-input v-model="form.username" style="width: 200px" placeholder="请è¾å ¥" /> </el-form-item> <el-form-item v-show="isExpandForm" label="æ¥å·¥æ¶é´" style="display: flex;align-items: center"> <el-date-picker v-model="form.operdate" type="daterange" range-separator="~" class="timeMini" size="mini" style="width: 200px;display: flex;line-height: 34px;height: 34px;" :clearable="false" start-placeholder="å¼å§æ¥æ" end-placeholder="ç»ææ¥æ" /> <!-- font-size: 14px!important;--> <!-- :picker-options="expireTimeOption"--> </el-form-item> </div> <div class="bodySearchReset" :style="{marginLeft:$store.state.app.sidebar.opened? $store.state.settings.menuIsHorizontal?'15%':'3%':'10%'}" > <el-button v-waves type="primary" icon="el-icon-search" @click="search">æ¥è¯¢</el-button> <el-button v-waves type="info" icon="el-icon-refresh" @click="reset">éç½®</el-button> </div> </el-form> <div class="bodyTopFormExpand" > <svg-icon v-show="mouseHoverType==='mouseout'" style="cursor: pointer" :icon-class="!isExpandForm?'doubleDown3':'doubleUp3'" @mouseenter="mouseHoverType=$event.type" /> <svg-icon v-show="mouseHoverType==='mouseenter'" style="cursor: pointer" :icon-class="!isExpandForm?'doubleDown':'doubleUp'" @click="isExpandForm=!isExpandForm" @mouseout="mouseHoverType=$event.type" /> </div> </div> <el-tabs type="border-card" style="margin-top: 10px" @tab-click="tabClick"> <el-tab-pane label="æ«éå·¥åº"> <div class="elTableDiv" style="margin: 0 auto 10px;"> <el-table ref="tableDataRef" class="tableFixed" :data="tableData" :height="isExpandForm?(tableHeight-70):(tableHeight-30)+'px'" border :summary-method="getSummaries" show-summary :row-class-name="tableRowClassName" :style="{width: 100+'%',height:isExpandForm?(tableHeight-70):(tableHeight-30)+'px',}" highlight-current-row :header-cell-style="this.$headerCellStyle" :cell-style="this.$cellStyle" @sort-change="sortChange" > <el-table-column prop="rowNum" width="50" fixed label="åºå·" /> <el-table-column prop="wo_code" label="å·¥åç¼å·" width="160" sortable="custom" /> <el-table-column prop="partcode" label="产åç¼ç " width="160" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="partname" label="产ååç§°" width="160" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="partspec" label="产åè§æ ¼" width="150" show-tooltip-when-overflow sortable="custom" > <template slot-scope="{row}"> <div v-if="row.partspec">{{ row.partspec }}</div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="stepcode" label="å·¥åºç¼ç " width="110" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="stepname" label="å·¥åºåç§°" width="110" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="task_qty" label="任塿°é" width="110" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="group_name" label="ç产çç»" width="110" show-tooltip-when-overflow sortable="custom" > <template slot-scope="{row}"> <div v-if="row.group_name">{{ row.group_name }}</div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="good_qty" label="æ¥å·¥æ°é" width="110" sortable="custom" /> <el-table-column prop="unprice" label="å·¥åºåä»·" width="110" sortable="custom" > <template slot-scope="{row}"> <div v-if="row.unprice">{{ row.unprice }} å </div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="usermoney" label="计件工èµ" width="110" sortable="custom" > <template slot-scope="{row}"> <div v-if="row.usermoney">{{ row.usermoney }} å </div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="lm_user" label="æä½äºº" width="110" sortable="custom" /> <el-table-column prop="report_date" label="æä½æ¶é´" width="160" sortable="custom" /> <el-table-column label="æ¥çæç»" width="120" fixed="right" > <template slot-scope="{row}"> <div class="operationClass"> <el-tooltip class="item" effect="dark" content="人åæç»" placement="top"> <!-- <i class="el-icon-edit-outline" @click="edit('edit',row)" />--> <i class="el-icon-tickets" :style="{color:$store.state.settings.theme}" style="cursor: pointer;margin-right: 15px" @click="edit('edit',row)" /> </el-tooltip> <!-- <el-tooltip v-del-tab-index class="item" effect="dark" content="å é¤" placement="top">--> <!-- <i class="el-icon-delete" @click="del(row)" />--> <!-- </el-tooltip>--> </div> </template> </el-table-column> </el-table> </div> <!--å页--> <pagination :total="total" :page.sync="form.page" :limit.sync="form.rows" align="right" layout="total,prev, pager, next,sizes" popper-class="select_bottom" @pagination="getGroupSalaryReportSearch" /> </el-tab-pane> <el-tab-pane label="ééå·¥åº"> <div class="elTableDiv" style="margin: 0 auto 10px;"> <el-table ref="tableDataRef2" class="tableFixed" :data="tableData2" :height="isExpandForm?(tableHeight-70):(tableHeight-30)+'px'" border :summary-method="getSummaries" show-summary :row-class-name="tableRowClassName" :style="{width: 100+'%',height:isExpandForm?(tableHeight-70):(tableHeight-30)+'px',}" highlight-current-row :header-cell-style="this.$headerCellStyle" :cell-style="this.$cellStyle" @sort-change="sortChange" > <el-table-column prop="rowNum" width="50" fixed label="åºå·" /> <el-table-column prop="wo_code" label="å·¥åç¼å·" width="160" sortable="custom" /> <el-table-column prop="partcode" label="产åç¼ç " width="160" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="partname" label="产ååç§°" width="160" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="partspec" label="产åè§æ ¼" width="150" show-tooltip-when-overflow sortable="custom" > <template slot-scope="{row}"> <div v-if="row.partspec">{{ row.partspec }}</div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="stepcode" label="å·¥åºç¼ç " width="110" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="stepname" label="å·¥åºåç§°" width="110" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="task_qty" label="任塿°é" width="110" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="group_name" label="ç产çç»" width="110" show-tooltip-when-overflow sortable="custom" > <template slot-scope="{row}"> <div v-if="row.group_name">{{ row.group_name }}</div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="good_qty" label="æ¥å·¥æ°é" width="110" sortable="custom" /> <el-table-column prop="unprice" label="å·¥åºåä»·" width="110" sortable="custom" > <template slot-scope="{row}"> <div v-if="row.unprice">{{ row.unprice }} å </div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="usermoney" label="计件工èµ" width="110" sortable="custom" > <template slot-scope="{row}"> <div v-if="row.usermoney">{{ row.usermoney }} å </div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="lm_user" label="æä½äºº" width="110" sortable="custom" /> <el-table-column prop="report_date" label="æä½æ¶é´" width="160" sortable="custom" /> <el-table-column label="æ¥çæç»" width="120" fixed="right" > <template slot-scope="{row}"> <div class="operationClass"> <el-tooltip class="item" effect="dark" content="人åæç»" placement="top"> <!-- <i class="el-icon-edit-outline" @click="edit('edit',row)" />--> <i class="el-icon-tickets" :style="{color:$store.state.settings.theme}" style="cursor: pointer;margin-right: 15px" @click="edit('edit',row)" /> </el-tooltip> <!-- <el-tooltip v-del-tab-index class="item" effect="dark" content="å é¤" placement="top">--> <!-- <i class="el-icon-delete" @click="del(row)" />--> <!-- </el-tooltip>--> </div> </template> </el-table-column> </el-table> </div> <!--å页--> <pagination :total="total" :page.sync="form.page" :limit.sync="form.rows" align="right" layout="total,prev, pager, next,sizes" popper-class="select_bottom" @pagination="getGroupSalaryReportSearch" /> </el-tab-pane> </el-tabs> </div> <el-dialog v-el-drag-dialog :title="operation==='add'?'æ°å¢':'人åæç»'" :visible.sync="dialogVisible" width="800px" :close-on-click-modal="false" top="15vh" @closed="handleClose" @close="handleClose" > <div style="height: 300px;width: 100%;background-color: aliceblue;padding:20px"> <el-tag v-for="tag in tagArr" :key="tag.name" type="success" style="margin-right: 15px;min-width: 80px;text-align: center" :style="{color:$store.state.settings.theme}" > {{ tag }} </el-tag> </div> <span slot="footer" class="dialog-footer"> <div class="footerButton"> <el-button v-waves @click="dialogVisible=false">è¿ å</el-button> <!-- <el-button v-waves @click="dialogVisibleCancel">å æ¶</el-button>--> <!-- <el-button v-waves type="primary" @click="dialogVisibleConfirm">ç¡® å®</el-button>--> </div> </span> </el-dialog> <!--å¯¼å ¥ç»ä»¶--> <import-picker ref="importPickerFunc" class="importPickerClass" :shows.sync="shows" :title="title_value" :colos="colos" :code="code" /> </div> </template> <script> import Pagination from '@/components/Pagination' import { getCookie } from '@/utils/auth' import ImportPicker from '@/components/ImportPicker' import { handleDatetime, validateCode } from '@/utils/global' import { GroupSalaryReportExcelSearch, GroupSalaryReportSearch, GroupSalaryReportSearchUser } from '@/api/ReportManager' import elDragDialog from '@/directive/el-drag-dialog' import waves from '@/directive/waves' import { GroupsPermissions } from '@/api/GeneralBasicData' export default { name: 'Zzjg', components: { Pagination, ImportPicker }, directives: { elDragDialog, waves }, data() { return { mouseHoverType: 'mouseout', isExpandForm: false, mainHeight: 0, tableHeight: 0, StepSelectArr: [], // åé¤å·¥åºæ°ç» form: { wocode: '', // å·¥åç¼å· partcode: '', // 产åç¼ç partname: '', // 产ååç§° partspec: '', // è§æ ¼åå· stepname: '', // å·¥åºåç§° groupcode: '', // ç产çç» username: '', // æä½äººå operdate: '', // æä½æ¶é´ rejectstepcode: [], // åé¤å·¥åº(åºå®èªèµå·¥åºä¸åä¸è®¡ç® compute: 'last', // 计件æ¹å¼ ééå·¥åºï¼contin æ«éå·¥åºï¼last prop: 'lm_date', // æåºå段 order: 'desc', // æåºå段 page: 1, // 第å 页 rows: 20 // æ¯é¡µå¤å°æ¡ }, groupArr: [], total: 10, tableData: [], tableData2: [], dialogVisible: false, tagArr: [], // dialogForm: { OrgType: '', OrgCode: '', OrgName: '', SupUnit: ''// ä¸çº§åä½ }, operation: '', dialogFormRules: { OrgType: [ { required: true, message: '请è¾å ¥éæ©ç±»å', trigger: ['blur', 'change'] } ], OrgCode: [ { required: true, validator: validateCode, trigger: ['blur', 'change'] } ], OrgName: [ { required: true, message: '请è¾å ¥åç§°', trigger: ['blur', 'change'] } ] }, title_value: 'æ°æ®å¯¼å ¥ / ç¹æ£é¨ä½', code: '4', shows: false } }, watch: { shows() { if (!this.shows) { this.getGroupSalaryReportSearch() } } }, created() { this.handleRequest() }, mounted() { window.addEventListener('resize', this.getHeight) this.getHeight() }, // updated() { // this.$nextTick(() => { // this.$refs.tableDataRef.doLayout() // this.$refs.tableDataRef2.doLayout() // }) // }, methods: { handleRequest() { this.getGroupSalaryReportSearch().then(res => { if (res.code === '200') { this.getMesOrderStepReportSelectUserGroup() // this.getStepSelect() } }) }, // è·åå·¥åºä¸ææ¥å£ // async getStepSelect() { // const { data: res } = await StepSelect() // this.StepSelectArr = res // }, getSummaries(param) { const { columns, data } = param const sums = [] columns.forEach((column, index) => { if (index === 10) { sums[index] = 'æ»ä»·' return } const values = data.map(item => Number(item[column.property])) if (column.property === 'usermoney') { sums[index] = values.reduce((prev, curr) => { const value = Number(curr) if (!isNaN(value)) { return Math.round(prev * 100) / 100 + Math.round(curr * 100) / 100 } else { return Math.round(prev * 100) / 100 } }, 0) sums[index] += ' å ' } else { // sums[index] = 'N/A' sums[index] = ' ' } }) this.$nextTick(() => { this.$refs.tableDataRef.doLayout() this.$refs.tableDataRef2.doLayout() }) return sums }, async getGroupSalaryReportSearch() { let tempDate = this.form.operdate if (tempDate.length > 0) { tempDate = handleDatetime(tempDate[0]) + '~' + handleDatetime(tempDate[1]) } const data = { wocode: this.form.wocode, partcode: this.form.partcode, partname: this.form.partname, partspec: this.form.partspec, stepname: this.form.stepname, groupcode: this.form.groupcode, username: this.form.username, operdate: tempDate, rejectstepcode: this.form.rejectstepcode.join(','), compute: this.form.compute, prop: this.form.prop, order: this.form.order, page: this.form.page, rows: this.form.rows } const res = await GroupSalaryReportSearch(data) if (this.form.compute === 'last') { this.tableData = res.data } if (this.form.compute === 'contin') { this.tableData2 = res.data } this.total = res.count return { code: res.code } }, async getMesOrderStepReportSelectUserGroup() { const { data: res } = await GroupsPermissions() this.groupArr = res }, tabClick(val) { // console.log(val.label) this.form.compute = val.label === 'æ«éå·¥åº' ? 'last' : 'contin' this.getGroupSalaryReportSearch() }, // æåºæ¹åæ¶ sortChange({ column, prop, order }) { if (order === 'descending') { order = 'desc' } else if (order === 'ascending') { order = 'asc' } else { order = 'desc' } this.form.order = order this.form.prop = prop this.getGroupSalaryReportSearch() }, async download() { let tempDate = this.form.operdate if (tempDate.length > 0) { tempDate = handleDatetime(tempDate[0]) + '~' + handleDatetime(tempDate[1]) } const data = { wocode: this.form.wocode, partcode: this.form.partcode, partname: this.form.partname, partspec: this.form.partspec, stepname: this.form.stepname, groupcode: this.form.groupcode, username: this.form.username, operdate: tempDate, compute: this.form.compute } const { data: res } = await GroupSalaryReportExcelSearch(data) window.location.href = res }, // æ¥è¯¢ search() { this.getGroupSalaryReportSearch() }, // å¯¼å ¥æé® upload() { this.shows = true this.$refs.importPickerFunc.newDataFunc() }, colos() { this.shows = false }, // éç½® reset() { this.form.wocode = '' this.form.partcode = '' this.form.partname = '' this.form.partspec = '' this.form.stepname = '' this.form.groupcode = '' this.form.username = '' this.form.operdate = '' this.getGroupSalaryReportSearch() }, // æ°å¢æé® add(operation) { this.operation = operation this.dialogVisible = true }, // ä¿®æ¹æé® async edit(operation, row) { this.operation = operation this.dialogVisible = true const res = await GroupSalaryReportSearchUser({ id: row.id }) this.tagArr = res.data.map(r => r.username).join(',').split(',') // this.tagArr = ['楼æä¿', 'å¼ ä¸', 'æå'] // this.$nextTick(() => { // this.dialogForm.OrgCode = row.org_code // this.dialogForm.OrgName = row.org_name // this.dialogForm.SupUnit = row.parent_id // }) }, // å é¤æé® async del(row) { // this.$confirm('æ¯å¦ç¡®è®¤å é¤?', 'æç¤º', { // confirmButtonText: 'ç¡®å®', // cancelButtonText: 'åæ¶', // type: 'warning' // }).then(() => { // DeleteOrganization({ orgid: row.code }).then(res => { // if (res.code === '200') { // this.$message.success('å 餿å!') // if (this.form.page > 1 && this.tableData.length === 1) { // this.form.page-- // } // this.getGroupSalaryReportSearch() // } // }) // }).catch(() => { // this.$message.info('已忶å é¤') // }) }, // å¯¹è¯æ¡å ³éäºä»¶ handleClose() { this.dialogForm.OrgType = '' this.dialogForm.OrgCode = '' this.dialogForm.OrgName = '' this.dialogForm.SupUnit = '' this.$refs.dialogForm.clearValidate() }, // å¯¹è¯æ¡åæ¶ dialogVisibleCancel() { this.dialogVisible = false }, // å¯¹è¯æ¡ç¡®è®¤ dialogVisibleConfirm() { this.$refs.dialogForm.validate(valid => { if (valid) { const data = { OrganCode: this.dialogForm.OrgCode, OrganName: this.dialogForm.OrgName, OperType: this.operation === 'add' ? 'Add' : 'Update', Operator: getCookie('admin') } // AddUpdateOrganization(data).then(res => { // if (res.code === '200') { // this.$message.success(this.operation === 'add' ? 'æ·»å æåï¼' : 'ä¿®æ¹æåï¼') // this.dialogVisible = false // this.getGroupSalaryReportSearch() // } else { // this.$message.error(this.operation === 'add' ? 'æ·»å 失败ï¼' : 'ä¿®æ¹å¤±è´¥ï¼') // } // }) } }) }, // è·å页é¢é«åº¦ getHeight() { this.$nextTick(() => { this.mainHeight = window.innerHeight - 85 this.tableHeight = this.mainHeight - 255 this.$refs.tableDataRef.doLayout() this.$refs.tableDataRef2.doLayout() }) }, tableRowClassName({ row, rowIndex }) { return 'custom-row' } } } </script> <style scoped lang="scss"> ::v-deep .el-select__caret { display: flex; align-items: center; justify-content: center; } ::v-deep .el-range__icon { line-height: 28px !important; } ::v-deep .el-range-separator { line-height: 28px !important; } ::v-deep .el-range-input { font-size: 14px; } ::v-deep .el-range-separator { display: flex; justify-content: center; align-items: center; } ::v-deep .el-progress-bar__innerText{ display: none !important; } </style> <style> .el-table .custom-row { background: #f8f8fa; } </style> src/views/statistic/personSalaryList.vue
¶Ô±ÈÐÂÎļþ @@ -0,0 +1,836 @@ <template> <div> <div class="body" :style="{height:mainHeight+'px'}"> <div class="bodyTopButtonGroup" style="justify-content: space-between"> <el-button v-waves type="primary" icon="el-icon-download" @click="download">导åº</el-button> <div style="color: red;margin: 10px 5px 0 0;" >å½åæ¥è¡¨åªç»è®¡èªå¶ä»¶å·¥åº </div> <!-- <div class="topRight" style="display: flex;align-items: center">--> <!-- <!– <div style="font-size: 14px;margin-right: 15px;color: #a7a7a7">åé¤å·¥åº</div>–>--> <!-- <el-select--> <!-- v-model="form.rejectstepcode"--> <!-- style="width: 170px;"--> <!-- multiple--> <!-- placeholder="è¯·éæ©åé¤å·¥åº"--> <!-- collapse-tags--> <!-- filterable--> <!-- clearable--> <!-- @change="getPeopleSalaryReportSearch"--> <!-- >--> <!-- <el-option--> <!-- v-for="item in StepSelectArr"--> <!-- :key="item.stepcode"--> <!-- :label="item.stepname"--> <!-- :value="item.stepcode"--> <!-- />--> <!-- </el-select>--> <!-- </div>--> </div> <div class="bodyTopFormGroup"> <el-form ref="form" :model="form" label-width="100px" inline style="display: flex; " > <div class="elForm"> <el-form-item label="å·¥åç¼å·" style="display: flex;"> <el-input v-model="form.wocode" placeholder="请è¾å ¥" style="width: 200px" /> </el-form-item> <el-form-item label="产åç¼ç " style=" display: flex;"> <el-input v-model="form.partcode" placeholder="请è¾å ¥" style="width: 200px" /> </el-form-item> <el-form-item label="产ååç§°" style=" display: flex;"> <el-input v-model="form.partname" style="width: 200px" placeholder="请è¾å ¥" /> </el-form-item> <el-form-item label="è§æ ¼åå·" style=" display: flex;"> <el-input v-model="form.partspec" style="width: 200px" placeholder="请è¾å ¥" /> </el-form-item> <el-form-item v-show="isExpandForm" label="å·¥åºåç§°" style=" display: flex;"> <el-input v-model="form.stepname" style="width: 200px" placeholder="请è¾å ¥" /> </el-form-item> <!-- <el-form-item v-show="isExpandForm" label="ç产çç»" style=" display: flex;">--> <!-- <el-select v-model="form.groupcode" style="width: 200px" placeholder="è¯·éæ©">--> <!-- <el-option--> <!-- v-for="item in groupArr"--> <!-- :key="item.group_code"--> <!-- :label="item.group_name"--> <!-- :value="item.group_code"--> <!-- />--> <!-- </el-select>--> <!-- </el-form-item>--> <el-form-item v-show="isExpandForm" label="æ¥å·¥äººå" style=" display: flex;"> <el-input v-model="form.reportname" style="width: 200px" placeholder="请è¾å ¥" /> </el-form-item> <el-form-item v-show="isExpandForm" label="æ¥å·¥æ¶é´" style="display: flex;align-items: center"> <el-date-picker v-model="form.reportdate" type="daterange" range-separator="~" class="timeMini" size="mini" style="width: 200px;display: flex;line-height: 34px;height: 34px;" :clearable="false" start-placeholder="å¼å§æ¥æ" end-placeholder="ç»ææ¥æ" /> <!-- font-size: 14px!important;--> <!-- :picker-options="expireTimeOption"--> </el-form-item> </div> <div class="bodySearchReset" :style="{marginLeft:$store.state.app.sidebar.opened? $store.state.settings.menuIsHorizontal?'15%':'3%':'10%'}" > <el-button v-waves type="primary" icon="el-icon-search" @click="search">æ¥è¯¢</el-button> <el-button v-waves type="info" icon="el-icon-refresh" @click="reset">éç½®</el-button> </div> </el-form> <div class="bodyTopFormExpand" > <svg-icon v-show="mouseHoverType==='mouseout'" style="cursor: pointer" :icon-class="!isExpandForm?'doubleDown3':'doubleUp3'" @mouseenter="mouseHoverType=$event.type" /> <svg-icon v-show="mouseHoverType==='mouseenter'" style="cursor: pointer" :icon-class="!isExpandForm?'doubleDown':'doubleUp'" @click="isExpandForm=!isExpandForm" @mouseout="mouseHoverType=$event.type" /> </div> </div> <el-tabs type="border-card" style="margin-top: 10px" @tab-click="tabClick"> <el-tab-pane label="æ«éå·¥åº"> <div class="elTableDiv" style="margin: 0 auto 10px;"> <el-table ref="tableDataRef" class="tableFixed" :data="tableData" :height="isExpandForm?(tableHeight-80):(tableHeight-40)+'px'" border :summary-method="getSummaries" show-summary :row-class-name="tableRowClassName" :style="{width: 100+'%',height:isExpandForm?(tableHeight-80):(tableHeight-40)+'px',}" highlight-current-row :header-cell-style="this.$headerCellStyle" :cell-style="this.$cellStyle" @sort-change="sortChange" > <el-table-column prop="rowNum" width="50" fixed label="åºå·" /> <el-table-column prop="wo_code" label="å·¥åç¼å·" width="160" sortable="custom" /> <el-table-column prop="partcode" label="产åç¼ç " width="160" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="partname" label="产ååç§°" width="160" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="partspec" label="产åè§æ ¼" width="160" show-tooltip-when-overflow sortable="custom" > <template slot-scope="{row}"> <div v-if="row.partspec">{{ row.partspec }}</div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="stepcode" label="å·¥åºç¼ç " width="110" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="stepname" label="å·¥åºåç§°" width="110" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="task_qty" label="任塿°é" width="110" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="group_name" label="ç产çç»" width="110" show-tooltip-when-overflow sortable="custom" > <template slot-scope="{row}"> <div v-if="row.group_name">{{ row.group_name }}</div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="report_qty" label="æ¥å·¥æ°é" width="110" sortable="custom" > <template slot-scope="{row}"> <div v-if="row.report_qty">{{ row.report_qty }}</div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="unprice" label="å·¥åºåä»·" width="110" sortable="custom" > <template slot-scope="{row}"> <div v-if="row.unprice">{{ row.unprice }} å </div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="ratio" label="åé æ¯ä¾" width="110" sortable="custom" > <template slot-scope="{row}"> <div v-if="row.unprice">{{ row.ratio }} %</div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="usermoney" label="个人计件工èµ" width="130" sortable="custom" > <template slot-scope="{row}"> <div v-if="row.usermoney">{{ row.usermoney }} å </div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="username" label="æ¥å·¥äººå" width="110" sortable="custom" /> <el-table-column prop="report_date" label="æ¥å·¥æ¶é´" width="160" sortable="custom" /> </el-table> </div> <!--å页--> <pagination :total="total" :page.sync="form.page" :limit.sync="form.rows" align="right" layout="total,prev, pager, next,sizes" popper-class="select_bottom" @pagination="getPeopleSalaryReportSearch" /> </el-tab-pane> <el-tab-pane label="ééå·¥åº"> <div class="elTableDiv" style="margin: 0 auto 10px;"> <el-table ref="tableDataRef2" class="tableFixed" :data="tableData2" :height="isExpandForm?(tableHeight-80):(tableHeight-40)+'px'" border :summary-method="getSummaries" show-summary :row-class-name="tableRowClassName" :style="{width: 100+'%',height:isExpandForm?(tableHeight-80):(tableHeight-40)+'px',}" highlight-current-row :header-cell-style="this.$headerCellStyle" :cell-style="this.$cellStyle" @sort-change="sortChange" > <el-table-column prop="rowNum" width="50" fixed label="åºå·" /> <el-table-column prop="wo_code" label="å·¥åç¼å·" width="160" sortable="custom" /> <el-table-column prop="partcode" label="产åç¼ç " width="160" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="partname" label="产ååç§°" width="160" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="partspec" label="产åè§æ ¼" width="160" show-tooltip-when-overflow sortable="custom" > <template slot-scope="{row}"> <div v-if="row.partspec">{{ row.partspec }}</div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="step_code" label="å·¥åºç¼ç " width="110" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="stepname" label="å·¥åºåç§°" width="110" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="task_qty" label="任塿°é" width="110" show-tooltip-when-overflow sortable="custom" /> <el-table-column prop="group_name" label="ç产çç»" width="110" show-tooltip-when-overflow sortable="custom" > <template slot-scope="{row}"> <div v-if="row.group_name">{{ row.group_name }}</div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="report_qty" label="æ¥å·¥æ°é" width="110" sortable="custom" > <template slot-scope="{row}"> <div v-if="row.report_qty">{{ row.report_qty }}</div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="unprice" label="å·¥åºåä»·" width="110" sortable="custom" > <template slot-scope="{row}"> <div v-if="row.unprice">{{ row.unprice }} å </div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="usermoney" label="个人计件工èµ" width="130" sortable="custom" > <template slot-scope="{row}"> <div v-if="row.usermoney">{{ row.usermoney }} å </div> <div v-else>/</div> </template> </el-table-column> <el-table-column prop="username" label="æ¥å·¥äººå" width="110" sortable="custom" /> <el-table-column prop="report_date" label="æ¥å·¥æ¶é´" width="160" sortable="custom" /> </el-table> </div> <!--å页--> <pagination :total="total" :page.sync="form.page" :limit.sync="form.rows" align="right" layout="total,prev, pager, next,sizes" popper-class="select_bottom" @pagination="getPeopleSalaryReportSearch" /> </el-tab-pane> </el-tabs> </div> <el-dialog v-el-drag-dialog :title="operation==='add'?'æ°å¢':'人åæç»'" :visible.sync="dialogVisible" width="800px" :close-on-click-modal="false" top="15vh" @closed="handleClose" @close="handleClose" > <div style="height: 300px;width: 100%;background-color: aliceblue;padding:20px"> <el-tag v-for="tag in tagArr" :key="tag.name" type="success" style="margin-right: 15px;min-width: 80px;text-align: center" > {{ tag }} </el-tag> </div> <span slot="footer" class="dialog-footer"> <div class="footerButton"> <el-button v-waves @click="dialogVisible=false">è¿ å</el-button> <!-- <el-button v-waves @click="dialogVisibleCancel">å æ¶</el-button>--> <!-- <el-button v-waves type="primary" @click="dialogVisibleConfirm">ç¡® å®</el-button>--> </div> </span> </el-dialog> <!--å¯¼å ¥ç»ä»¶--> <import-picker ref="importPickerFunc" class="importPickerClass" :shows.sync="shows" :title="title_value" :colos="colos" :code="code" /> </div> </template> <script> import Pagination from '@/components/Pagination' import { getCookie } from '@/utils/auth' import ImportPicker from '@/components/ImportPicker' import { handleDatetime, validateCode } from '@/utils/global' import { GroupSalaryReportSearchUser, PeopleSalaryReportExcelSearch, PeopleSalaryReportSearch } from '@/api/ReportManager' import elDragDialog from '@/directive/el-drag-dialog' import waves from '@/directive/waves' export default { name: 'Zzjg', components: { Pagination, ImportPicker }, directives: { elDragDialog, waves }, data() { return { mouseHoverType: 'mouseout', isExpandForm: false, mainHeight: 0, tableHeight: 0, StepSelectArr: [], // åé¤å·¥åºæ°ç» form: { wocode: '', // å·¥åç¼å· partcode: '', // 产åç¼ç partname: '', // 产ååç§° partspec: '', // è§æ ¼åå· stepname: '', // å·¥åºåç§° groupcode: '', // ç产çç» reportname: '', // æä½äººå reportdate: '', // æä½æ¶é´ rejectstepcode: [], // åé¤å·¥åº(åºå®èªèµå·¥åºä¸åä¸è®¡ç® compute: 'last', // 计件æ¹å¼ prop: 'partcode', // æåºå段 order: 'desc', // æåºå段 page: 1, // 第å 页 rows: 20 // æ¯é¡µå¤å°æ¡ }, groupArr: [], total: 10, tableData: [], tableData2: [], dialogVisible: false, tagArr: [], // dialogForm: { OrgType: '', OrgCode: '', OrgName: '', SupUnit: ''// ä¸çº§åä½ }, operation: '', dialogFormRules: { OrgType: [ { required: true, message: '请è¾å ¥éæ©ç±»å', trigger: ['blur', 'change'] } ], OrgCode: [ { required: true, validator: validateCode, trigger: ['blur', 'change'] } ], OrgName: [ { required: true, message: '请è¾å ¥åç§°', trigger: ['blur', 'change'] } ] }, title_value: 'æ°æ®å¯¼å ¥ / ç¹æ£é¨ä½', code: '4', shows: false } }, watch: { shows() { if (!this.shows) { this.getPeopleSalaryReportSearch() } } }, // updated() { // this.$nextTick(() => { // this.$refs.tableDataRef.doLayout() // this.$refs.tableDataRef2.doLayout() // }) // }, created() { this.handleRequest() }, mounted() { window.addEventListener('resize', this.getHeight) this.getHeight() }, methods: { handleRequest() { this.getPeopleSalaryReportSearch().then(res => { if (res.code === '200') { // this.getMesOrderStepReportSelectUserGroup() // this.getStepSelect() } }) }, // è·åå·¥åºä¸ææ¥å£ // async getStepSelect() { // const { data: res } = await StepSelect() // this.StepSelectArr = res // }, getSummaries(param) { const { columns, data } = param const sums = [] const i = this.form.compute === 'last' ? 11 : 10 columns.forEach((column, index) => { if (index === i) { sums[index] = 'æ»ä»·' return } const values = data.map(item => Number(item[column.property])) if (column.property === 'usermoney') { sums[index] = values.reduce((prev, curr) => { const value = Number(curr) if (!isNaN(value)) { // return prev + curr return Math.round(prev * 100) / 100 + Math.round(curr * 100) / 100 } else { return Math.round(prev * 100) / 100 } }, 0) sums[index] += ' å ' } else { // sums[index] = 'N/A' sums[index] = ' ' } }) this.$nextTick(() => { this.$refs.tableDataRef.doLayout() this.$refs.tableDataRef2.doLayout() }) // (Math.round(sums * 100) / 100).toS // console.log(typeof sums) // console.log(sums[11].split(' ')) return sums }, async getPeopleSalaryReportSearch() { let tempDate = this.form.reportdate if (tempDate.length > 0) { tempDate = handleDatetime(tempDate[0]) + '~' + handleDatetime(tempDate[1]) } const data = { wocode: this.form.wocode, partcode: this.form.partcode, partname: this.form.partname, partspec: this.form.partspec, stepname: this.form.stepname, groupcode: this.form.groupcode, compute: this.form.compute, reportname: this.form.reportname, rejectstepcode: this.form.rejectstepcode.join(','), reportdate: tempDate, prop: this.form.prop, order: this.form.order, page: this.form.page, rows: this.form.rows } const res = await PeopleSalaryReportSearch(data) if (this.form.compute === 'last') { this.tableData = res.data } if (this.form.compute === 'contin') { this.tableData2 = res.data } this.total = res.count return { code: res.code } }, // async getMesOrderStepReportSelectUserGroup() { // const { data: res } = await MesOrderStepReportSelectUserGroup() // this.groupArr = res // }, tabClick(val) { this.form.compute = val.label === 'æ«éå·¥åº' ? 'last' : 'contin' this.getPeopleSalaryReportSearch() }, // æåºæ¹åæ¶ sortChange({ column, prop, order }) { if (order === 'descending') { order = 'desc' } else if (order === 'ascending') { order = 'asc' } else { order = 'desc' } this.form.order = order this.form.prop = prop this.getPeopleSalaryReportSearch() }, async download() { let tempDate = this.form.reportdate if (tempDate.length > 0) { tempDate = handleDatetime(tempDate[0]) + '~' + handleDatetime(tempDate[1]) } const data = { wocode: this.form.wocode, partcode: this.form.partcode, partname: this.form.partname, partspec: this.form.partspec, stepname: this.form.stepname, groupcode: this.form.groupcode, compute: this.form.compute, reportname: this.form.reportname, reportdate: tempDate } const { data: res } = await PeopleSalaryReportExcelSearch(data) window.location.href = res }, // æ¥è¯¢ search() { this.getPeopleSalaryReportSearch() }, // å¯¼å ¥æé® upload() { this.shows = true this.$refs.importPickerFunc.newDataFunc() }, colos() { this.shows = false }, // éç½® reset() { this.form.wocode = '' this.form.partcode = '' this.form.partname = '' this.form.partspec = '' this.form.stepname = '' this.form.groupcode = '' this.form.reportname = '' this.form.reportdate = '' this.getPeopleSalaryReportSearch() }, // æ°å¢æé® add(operation) { this.operation = operation this.dialogVisible = true }, // ä¿®æ¹æé® async edit(operation, row) { this.operation = operation this.dialogVisible = true const res = await GroupSalaryReportSearchUser({ id: row.id }) this.tagArr = res.data.map(r => r.reportname) // this.tagArr = ['楼æä¿', 'å¼ ä¸', 'æå'] // this.$nextTick(() => { // this.dialogForm.OrgCode = row.org_code // this.dialogForm.OrgName = row.org_name // this.dialogForm.SupUnit = row.parent_id // }) }, // å é¤æé® async del(row) { // this.$confirm('æ¯å¦ç¡®è®¤å é¤?', 'æç¤º', { // confirmButtonText: 'ç¡®å®', // cancelButtonText: 'åæ¶', // type: 'warning' // }).then(() => { // DeleteOrganization({ orgid: row.code }).then(res => { // if (res.code === '200') { // this.$message.success('å 餿å!') // if (this.form.page > 1 && this.tableData.length === 1) { // this.form.page-- // } // this.getPeopleSalaryReportSearch() // } // }) // }).catch(() => { // this.$message.info('已忶å é¤') // }) }, // å¯¹è¯æ¡å ³éäºä»¶ handleClose() { this.dialogForm.OrgType = '' this.dialogForm.OrgCode = '' this.dialogForm.OrgName = '' this.dialogForm.SupUnit = '' this.$refs.dialogForm.clearValidate() }, // å¯¹è¯æ¡åæ¶ dialogVisibleCancel() { this.dialogVisible = false }, // å¯¹è¯æ¡ç¡®è®¤ dialogVisibleConfirm() { this.$refs.dialogForm.validate(valid => { if (valid) { const data = { OrganCode: this.dialogForm.OrgCode, OrganName: this.dialogForm.OrgName, OperType: this.operation === 'add' ? 'Add' : 'Update', Operator: getCookie('admin') } // AddUpdateOrganization(data).then(res => { // if (res.code === '200') { // this.$message.success(this.operation === 'add' ? 'æ·»å æåï¼' : 'ä¿®æ¹æåï¼') // this.dialogVisible = false // this.getPeopleSalaryReportSearch() // } else { // this.$message.error(this.operation === 'add' ? 'æ·»å 失败ï¼' : 'ä¿®æ¹å¤±è´¥ï¼') // } // }) } }) }, // è·å页é¢é«åº¦ getHeight() { this.$nextTick(() => { this.mainHeight = window.innerHeight - 85 this.tableHeight = this.mainHeight - 255 this.$refs.tableDataRef.doLayout() this.$refs.tableDataRef2.doLayout() }) }, tableRowClassName({ row, rowIndex }) { return 'custom-row' } } } </script> <style scoped lang="scss"> ::v-deep .el-select__caret { display: flex; align-items: center; justify-content: center; } ::v-deep .el-range__icon { line-height: 28px !important; } ::v-deep .el-range-separator { line-height: 28px !important; } ::v-deep .el-range-input { font-size: 14px; } ::v-deep .el-range-separator { display: flex; justify-content: center; align-items: center; } ::v-deep .el-progress-bar__innerText { display: none !important; } </style> <style> .el-table .custom-row { background: #f8f8fa; } </style>