| | |
| | | <template>
|
| | | <div>
|
| | | <div class="body" :style="{height:mainHeight+'px'}">
|
| | | <div class="bodyTopButtonGroup">
|
| | | <el-button v-waves type="primary" icon="el-icon-download" @click="download">导åº</el-button>
|
| | | </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.socode" placeholder="请è¾å
¥" style="width: 200px" />-->
|
| | | <!-- </el-form-item>-->
|
| | | <el-form-item label="车é´åç§°" style=" display: flex;">
|
| | | <el-select
|
| | | v-model="form.wkshopcode"
|
| | | filterable
|
| | | :popper-append-to-body="false"
|
| | | style="width: 200px"
|
| | | placeholder="è¯·éæ©"
|
| | | >
|
| | | <el-option
|
| | | v-for="item in wkshopcodeArr"
|
| | | :key="item.torg_code"
|
| | | :label="item.torg_name"
|
| | | :value="item.torg_code"
|
| | | />
|
| | | </el-select>
|
| | | </el-form-item>
|
| | | <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 v-show="isExpandForm" label="产ååç§°" style=" display: flex;">
|
| | | <el-input v-model="form.partname" style="width: 200px" placeholder="请è¾å
¥" />
|
| | | </el-form-item>
|
| | | <el-form-item v-show="isExpandForm" 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-input v-model="form.style" style="width: 200px" placeholder="请è¾å
¥" />-->
|
| | | <el-select v-model="form.style" style="width: 200px" placeholder="è¯·éæ©">
|
| | | <el-option
|
| | | v-for="item in styleArr"
|
| | | :key="item.code"
|
| | | :label="item.name"
|
| | | :value="item.code"
|
| | | />
|
| | | </el-select>
|
| | | </el-form-item>
|
| | | <el-form-item v-show="isExpandForm" label="缺é·åç§°" style=" display: flex;">
|
| | | <el-input v-model="form.defectname" style="width: 200px" placeholder="请è¾å
¥" />
|
| | | </el-form-item>
|
| | | <el-form-item v-show="isExpandForm" label="æ¥å·¥äººå" style=" display: flex;">
|
| | | <el-input v-model="form.repairname" 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.repairdate"
|
| | | 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>
|
| | |
|
| | | <div class="elTableDiv">
|
| | | <el-table
|
| | | ref="tableDataRef"
|
| | | class="tableFixed"
|
| | | :data="tableData"
|
| | | :height="isExpandForm?tableHeight:(tableHeight+80)+'px'"
|
| | | border
|
| | | :row-class-name="tableRowClassName"
|
| | | :style="{width: 100+'%',height:isExpandForm?tableHeight:(tableHeight+80)+'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="socode"-->
|
| | | <!-- 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="120"
|
| | | 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="wkshp_name"
|
| | | label="车é´åç§°"
|
| | | width="130"
|
| | | show-tooltip-when-overflow
|
| | | sortable="custom"
|
| | | />
|
| | | <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="style"
|
| | | label="æä½ç±»å"
|
| | | width="110"
|
| | | sortable="custom"
|
| | | />
|
| | | <el-table-column
|
| | | prop="plan_qty"
|
| | | label="任塿°é"
|
| | | width="110"
|
| | | sortable="custom"
|
| | | />
|
| | | <el-table-column
|
| | | prop="repair_qty"
|
| | | label="ç»´ä¿®æ°é"
|
| | | width="110"
|
| | | sortable="custom"
|
| | | />
|
| | | <el-table-column
|
| | | prop="laborbad_qty"
|
| | | label="å·¥åºæ°é"
|
| | | width="110"
|
| | | sortable="custom"
|
| | | />
|
| | | <el-table-column
|
| | | prop="materielbad_qty"
|
| | | label="æåºæ°é"
|
| | | width="110"
|
| | | sortable="custom"
|
| | | />
|
| | | <el-table-column
|
| | | prop="defect_code"
|
| | | label="缺é·ä»£ç "
|
| | | width="110"
|
| | | show-tooltip-when-overflow
|
| | | sortable="custom"
|
| | | />
|
| | | <el-table-column
|
| | | prop="defect_name"
|
| | | label="缺é·åç§°"
|
| | | width="110"
|
| | | show-tooltip-when-overflow
|
| | | sortable="custom"
|
| | | />
|
| | | <el-table-column
|
| | | prop="lm_user"
|
| | | label="æä½äººå"
|
| | | width="110"
|
| | | sortable="custom"
|
| | | />
|
| | | <el-table-column
|
| | | prop="lm_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="getMaintenanceDetailsReportSearch"
|
| | | />
|
| | | </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, MaintenanceDetailsReportExcelSearch, MaintenanceDetailsReportSearch
|
| | | } from '@/api/ReportManager'
|
| | | import elDragDialog from '@/directive/el-drag-dialog'
|
| | | import waves from '@/directive/waves'
|
| | | import { PrentOrganizationNoCompany } from '@/api/GeneralBasicData'
|
| | |
|
| | | export default {
|
| | | name: 'RepairDetailList',
|
| | | components: {
|
| | | Pagination, ImportPicker
|
| | | },
|
| | | directives: { elDragDialog, waves },
|
| | | data() {
|
| | | return {
|
| | | mouseHoverType: 'mouseout',
|
| | | isExpandForm: false,
|
| | | mainHeight: 0,
|
| | | tableHeight: 0,
|
| | | form: {
|
| | |
|
| | | wkshopcode: '',
|
| | | wocode: '', // å·¥åç¼å·
|
| | | partcode: '', // 产åç¼ç
|
| | | partname: '', // 产ååç§°
|
| | | partspec: '', // è§æ ¼åå·
|
| | | stepname: '', // å·¥åºåç§°
|
| | | style: '', // æä½ç±»å
|
| | | defectname: '', // 缺é·åç§°
|
| | | repairname: '', // æä½äººå
|
| | | repairdate: '', // æä½æ¶é´
|
| | | prop: 'partcode', // æåºå段
|
| | | order: 'desc', // æåºå段
|
| | | page: 1, // 第å 页
|
| | | rows: 20 // æ¯é¡µå¤å°æ¡
|
| | | },
|
| | | styleArr: [
|
| | | { code: 'B', name: 'æ¥å·¥' },
|
| | | { code: 'S', name: 'æ¶æ' }
|
| | | ],
|
| | | // groupArr: [],
|
| | | wkshopcodeArr: [],
|
| | | total: 10,
|
| | | tableData: [],
|
| | | 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.getMaintenanceDetailsReportSearch()
|
| | | }
|
| | | }
|
| | | },
|
| | | activated() {
window.addEventListener('resize', this.getHeight)
this.getHeight()
},
created() {
|
| | | this.handleRequest()
|
| | | },
|
| | | mounted() {
|
| | | window.addEventListener('resize', this.getHeight)
|
| | | this.getHeight()
|
| | | },
|
| | | methods: {
|
| | | handleRequest() {
|
| | | this.getMaintenanceDetailsReportSearch().then(res => {
|
| | | if (res.code === '200') {
|
| | | this.getPrentOrganizationNoCompany()
|
| | | }
|
| | | })
|
| | | },
|
| | | async getPrentOrganizationNoCompany() {
|
| | | const { data: res } = await PrentOrganizationNoCompany()
|
| | | this.wkshopcodeArr = res
|
| | | },
|
| | | async getMaintenanceDetailsReportSearch() {
|
| | | let tempDate = this.form.repairdate
|
| | | if (tempDate.length > 0) {
|
| | | tempDate = handleDatetime(tempDate[0]) + '~' + handleDatetime(tempDate[1])
|
| | | }
|
| | | const data = {
|
| | |
|
| | | wkshopcode: this.form.wkshopcode,
|
| | | wocode: this.form.wocode,
|
| | | partcode: this.form.partcode,
|
| | | partname: this.form.partname,
|
| | | partspec: this.form.partspec,
|
| | | stepname: this.form.stepname,
|
| | | style: this.form.style,
|
| | | defectname: this.form.defectname,
|
| | | repairname: this.form.repairname,
|
| | | repairdate: tempDate,
|
| | | prop: this.form.prop,
|
| | | order: this.form.order,
|
| | | page: this.form.page,
|
| | | rows: this.form.rows
|
| | | }
|
| | |
|
| | | const res = await MaintenanceDetailsReportSearch(data)
|
| | | this.tableData = res.data
|
| | | this.total = res.count
|
| | |
|
| | | return { code: res.code }
|
| | | },
|
| | |
|
| | | // async getMesOrderStepReportSelectUserGroup() {
|
| | | // const { data: res } = await MesOrderStepReportSelectUserGroup()
|
| | | // this.groupArr = res
|
| | | // },
|
| | | // æåºæ¹åæ¶
|
| | | 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.getMaintenanceDetailsReportSearch()
|
| | | },
|
| | | async download() {
|
| | | let tempDate = this.form.repairdate
|
| | | if (tempDate.length > 0) {
|
| | | tempDate = handleDatetime(tempDate[0]) + '~' + handleDatetime(tempDate[1])
|
| | | }
|
| | |
|
| | | const data = {
|
| | |
|
| | | wkshopcode: this.form.wkshopcode,
|
| | | wocode: this.form.wocode,
|
| | | partcode: this.form.partcode,
|
| | | partname: this.form.partname,
|
| | | partspec: this.form.partspec,
|
| | | stepname: this.form.stepname,
|
| | | style: this.form.style,
|
| | | defectname: this.form.defectname,
|
| | | repairname: this.form.repairname,
|
| | | repairdate: tempDate
|
| | | }
|
| | |
|
| | | const { data: res } = await MaintenanceDetailsReportExcelSearch(data)
|
| | | window.location.href = res
|
| | | },
|
| | | // æ¥è¯¢
|
| | | search() {
|
| | | this.getMaintenanceDetailsReportSearch()
|
| | | },
|
| | | // 导å
¥æé®
|
| | | upload() {
|
| | | this.shows = true
|
| | | this.$refs.importPickerFunc.newDataFunc()
|
| | | },
|
| | | colos() {
|
| | | this.shows = false
|
| | | },
|
| | | // éç½®
|
| | | reset() {
|
| | | this.form.wkshopcode = ''
|
| | | this.form.wocode = ''
|
| | | this.form.partcode = ''
|
| | | this.form.partname = ''
|
| | | this.form.partspec = ''
|
| | | this.form.stepname = ''
|
| | | this.form.style = ''
|
| | | this.form.defectname = ''
|
| | | this.form.repairname = ''
|
| | | this.form.repairdate = ''
|
| | | this.getMaintenanceDetailsReportSearch()
|
| | | },
|
| | |
|
| | | // æ°å¢æé®
|
| | | 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.repairname)
|
| | | // 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.getMaintenanceDetailsReportSearch()
|
| | | // }
|
| | | // })
|
| | | // }).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.getMaintenanceDetailsReportSearch()
|
| | | // } else {
|
| | | // this.$message.error(this.operation === 'add' ? 'æ·»å 失败ï¼' : 'ä¿®æ¹å¤±è´¥ï¼')
|
| | | // }
|
| | | // })
|
| | | }
|
| | | })
|
| | | },
|
| | | // è·å页é¢é«åº¦
|
| | | getHeight() {
|
| | | this.$nextTick(() => {
|
| | | this.mainHeight = window.innerHeight - 85
|
| | | this.tableHeight = this.mainHeight - 295
|
| | | this.$refs.tableDataRef.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>
|
| | | <template> |
| | | <div> |
| | | <div class="body" :style="{height:mainHeight+'px'}"> |
| | | <div class="bodyTopButtonGroup"> |
| | | <el-button v-waves type="primary" icon="el-icon-download" @click="download">导åº</el-button> |
| | | </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.socode" placeholder="请è¾å
¥" style="width: 200px" />--> |
| | | <!-- </el-form-item>--> |
| | | <el-form-item label="车é´åç§°" style=" display: flex;"> |
| | | <el-select |
| | | v-model="form.wkshopcode" |
| | | filterable |
| | | :popper-append-to-body="false" |
| | | style="width: 200px" |
| | | placeholder="è¯·éæ©" |
| | | > |
| | | <el-option |
| | | v-for="item in wkshopcodeArr" |
| | | :key="item.torg_code" |
| | | :label="item.torg_name" |
| | | :value="item.torg_code" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <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 v-show="isExpandForm" 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-input v-model="form.style" style="width: 200px" placeholder="请è¾å
¥" />--> |
| | | <el-select v-model="form.style" style="width: 200px" placeholder="è¯·éæ©"> |
| | | <el-option |
| | | v-for="item in styleArr" |
| | | :key="item.code" |
| | | :label="item.name" |
| | | :value="item.code" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item v-show="isExpandForm" label="缺é·åç§°" style=" display: flex;"> |
| | | <el-input v-model="form.defectname" style="width: 200px" placeholder="请è¾å
¥" /> |
| | | </el-form-item> |
| | | <el-form-item v-show="isExpandForm" label="æ¥å·¥äººå" style=" display: flex;"> |
| | | <el-input v-model="form.repairname" 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.repairdate" |
| | | 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> |
| | | |
| | | <div class="elTableDiv"> |
| | | <el-table |
| | | ref="tableDataRef" |
| | | class="tableFixed" |
| | | :data="tableData" |
| | | :height="isExpandForm?tableHeight:(tableHeight+80)+'px'" |
| | | border |
| | | :row-class-name="tableRowClassName" |
| | | :style="{width: 100+'%',height:isExpandForm?tableHeight:(tableHeight+80)+'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="socode"--> |
| | | <!-- 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="120" |
| | | 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="wkshp_name" |
| | | label="车é´åç§°" |
| | | width="130" |
| | | show-tooltip-when-overflow |
| | | sortable="custom" |
| | | /> |
| | | <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="style" |
| | | label="æä½ç±»å" |
| | | width="110" |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | | prop="plan_qty" |
| | | label="任塿°é" |
| | | width="110" |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | | prop="repair_qty" |
| | | label="ç»´ä¿®æ°é" |
| | | width="110" |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | | prop="laborbad_qty" |
| | | label="å·¥åºæ°é" |
| | | width="110" |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | | prop="materielbad_qty" |
| | | label="æåºæ°é" |
| | | width="110" |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | | prop="defect_code" |
| | | label="缺é·ä»£ç " |
| | | width="110" |
| | | show-tooltip-when-overflow |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | | prop="defect_name" |
| | | label="缺é·åç§°" |
| | | width="110" |
| | | show-tooltip-when-overflow |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | | prop="lm_user" |
| | | label="æä½äººå" |
| | | width="110" |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | | prop="lm_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="getMaintenanceDetailsReportSearch" |
| | | /> |
| | | </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, MaintenanceDetailsReportExcelSearch, MaintenanceDetailsReportSearch |
| | | } from '@/api/ReportManager' |
| | | import elDragDialog from '@/directive/el-drag-dialog' |
| | | import waves from '@/directive/waves' |
| | | import { PrentOrganizationNoCompany } from '@/api/GeneralBasicData' |
| | | |
| | | export default { |
| | | name: 'RepairDetailList', |
| | | components: { |
| | | Pagination, ImportPicker |
| | | }, |
| | | directives: { elDragDialog, waves }, |
| | | data() { |
| | | return { |
| | | mouseHoverType: 'mouseout', |
| | | isExpandForm: false, |
| | | mainHeight: 0, |
| | | tableHeight: 0, |
| | | form: { |
| | | |
| | | wkshopcode: '', |
| | | wocode: '', // å·¥åç¼å· |
| | | partcode: '', // 产åç¼ç |
| | | partname: '', // 产ååç§° |
| | | partspec: '', // è§æ ¼åå· |
| | | stepname: '', // å·¥åºåç§° |
| | | style: '', // æä½ç±»å |
| | | defectname: '', // 缺é·åç§° |
| | | repairname: '', // æä½äººå |
| | | repairdate: '', // æä½æ¶é´ |
| | | prop: 'partcode', // æåºå段 |
| | | order: 'desc', // æåºå段 |
| | | page: 1, // 第å 页 |
| | | rows: 20 // æ¯é¡µå¤å°æ¡ |
| | | }, |
| | | styleArr: [ |
| | | { code: 'B', name: 'æ¥å·¥' }, |
| | | { code: 'S', name: 'æ¶æ' } |
| | | ], |
| | | // groupArr: [], |
| | | wkshopcodeArr: [], |
| | | total: 10, |
| | | tableData: [], |
| | | 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.getMaintenanceDetailsReportSearch() |
| | | } |
| | | } |
| | | }, |
| | | activated() { |
| | | window.addEventListener('resize', this.getHeight) |
| | | this.getHeight() |
| | | }, |
| | | created() { |
| | | this.handleRequest() |
| | | }, |
| | | mounted() { |
| | | window.addEventListener('resize', this.getHeight) |
| | | this.getHeight() |
| | | }, |
| | | methods: { |
| | | handleRequest() { |
| | | this.getMaintenanceDetailsReportSearch().then(res => { |
| | | if (res.code === '200') { |
| | | this.getPrentOrganizationNoCompany() |
| | | } |
| | | }) |
| | | }, |
| | | async getPrentOrganizationNoCompany() { |
| | | const { data: res } = await PrentOrganizationNoCompany() |
| | | this.wkshopcodeArr = res |
| | | }, |
| | | async getMaintenanceDetailsReportSearch() { |
| | | let tempDate = this.form.repairdate |
| | | if (tempDate.length > 0) { |
| | | tempDate = handleDatetime(tempDate[0]) + '~' + handleDatetime(tempDate[1]) |
| | | } |
| | | const data = { |
| | | |
| | | wkshopcode: this.form.wkshopcode, |
| | | wocode: this.form.wocode, |
| | | partcode: this.form.partcode, |
| | | partname: this.form.partname, |
| | | partspec: this.form.partspec, |
| | | stepname: this.form.stepname, |
| | | style: this.form.style, |
| | | defectname: this.form.defectname, |
| | | repairname: this.form.repairname, |
| | | repairdate: tempDate, |
| | | prop: this.form.prop, |
| | | order: this.form.order, |
| | | page: this.form.page, |
| | | rows: this.form.rows |
| | | } |
| | | |
| | | const res = await MaintenanceDetailsReportSearch(data) |
| | | this.tableData = res.data |
| | | this.total = res.count |
| | | |
| | | return { code: res.code } |
| | | }, |
| | | |
| | | // async getMesOrderStepReportSelectUserGroup() { |
| | | // const { data: res } = await MesOrderStepReportSelectUserGroup() |
| | | // this.groupArr = res |
| | | // }, |
| | | // æåºæ¹åæ¶ |
| | | 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.getMaintenanceDetailsReportSearch() |
| | | }, |
| | | async download() { |
| | | let tempDate = this.form.repairdate |
| | | if (tempDate.length > 0) { |
| | | tempDate = handleDatetime(tempDate[0]) + '~' + handleDatetime(tempDate[1]) |
| | | } |
| | | |
| | | const data = { |
| | | |
| | | wkshopcode: this.form.wkshopcode, |
| | | wocode: this.form.wocode, |
| | | partcode: this.form.partcode, |
| | | partname: this.form.partname, |
| | | partspec: this.form.partspec, |
| | | stepname: this.form.stepname, |
| | | style: this.form.style, |
| | | defectname: this.form.defectname, |
| | | repairname: this.form.repairname, |
| | | repairdate: tempDate |
| | | } |
| | | |
| | | const { data: res } = await MaintenanceDetailsReportExcelSearch(data) |
| | | window.location.href = res |
| | | }, |
| | | // æ¥è¯¢ |
| | | search() { |
| | | this.getMaintenanceDetailsReportSearch() |
| | | }, |
| | | // 导å
¥æé® |
| | | upload() { |
| | | this.shows = true |
| | | this.$refs.importPickerFunc.newDataFunc() |
| | | }, |
| | | colos() { |
| | | this.shows = false |
| | | }, |
| | | // éç½® |
| | | reset() { |
| | | this.form.wkshopcode = '' |
| | | this.form.wocode = '' |
| | | this.form.partcode = '' |
| | | this.form.partname = '' |
| | | this.form.partspec = '' |
| | | this.form.stepname = '' |
| | | this.form.style = '' |
| | | this.form.defectname = '' |
| | | this.form.repairname = '' |
| | | this.form.repairdate = '' |
| | | this.getMaintenanceDetailsReportSearch() |
| | | }, |
| | | |
| | | // æ°å¢æé® |
| | | 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.repairname) |
| | | // 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.getMaintenanceDetailsReportSearch() |
| | | // } |
| | | // }) |
| | | // }).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.getMaintenanceDetailsReportSearch() |
| | | // } else { |
| | | // this.$message.error(this.operation === 'add' ? 'æ·»å 失败ï¼' : 'ä¿®æ¹å¤±è´¥ï¼') |
| | | // } |
| | | // }) |
| | | } |
| | | }) |
| | | }, |
| | | // è·å页é¢é«åº¦ |
| | | getHeight() { |
| | | this.$nextTick(() => { |
| | | this.mainHeight = window.innerHeight - 85 |
| | | this.tableHeight = this.mainHeight - 295 |
| | | this.$refs.tableDataRef.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> |