From 162fa9155bfeadfeae1365a3d94a3ac12726c276 Mon Sep 17 00:00:00 2001 From: zhaowei <zhaowei> Date: 星期三, 09 四月 2025 11:16:23 +0800 Subject: [PATCH] 维修工单页面布局及样式完成80% --- src/views/eam/repair/modules/EamRepairOrderModal.vue | 206 +++++++++++++++++++++++++ src/views/eam/repair/EamRepairOrderList.vue | 264 +++++++++++++++++++++++++++++++++ 2 files changed, 470 insertions(+), 0 deletions(-) diff --git a/src/views/eam/repair/EamRepairOrderList.vue b/src/views/eam/repair/EamRepairOrderList.vue new file mode 100644 index 0000000..496eae8 --- /dev/null +++ b/src/views/eam/repair/EamRepairOrderList.vue @@ -0,0 +1,264 @@ +<template> + <a-card :bordered="false"> + + <!-- 鏌ヨ鍖哄煙 --> + <div class="table-page-search-wrapper"> + <a-form layout="inline" @keyup.enter.native="searchQuery"> + <a-row :gutter="24"> + <a-col :xl="6" :lg="7" :md="8" :sm="24"> + <a-form-item label="宸ュ崟缂栧彿"> + <a-input placeholder="璇疯緭鍏ュ伐鍗曠紪鍙�" v-model="queryParam.repairCode"></a-input> + </a-form-item> + </a-col> + <template v-if="toggleSearchStatus"> + <a-col :xl="6" :lg="7" :md="8" :sm="24"> + <a-form-item label="鎶ヤ慨缂栧彿"> + <a-input placeholder="璇疯緭鍏ユ姤淇紪鍙�" v-model="queryParam.reportId"></a-input> + </a-form-item> + </a-col> + <a-col :xl="6" :lg="7" :md="8" :sm="24"> + <a-form-item label="璁惧缂栧彿"> + <lx-search-equipment-select placeholder="璇疯緭鍏ヨ澶囩紪鍙锋垨鍚嶇О鎼滅储" v-model="queryParam.equipmentId"/> + </a-form-item> + </a-col> + <a-col :xl="6" :lg="7" :md="8" :sm="24"> + <a-form-item label="缁翠慨鐘舵��"> + <a-input placeholder="璇疯緭鍏ョ淮淇姸鎬�" v-model="queryParam.repairStatus"></a-input> + </a-form-item> + </a-col> + </template> + <a-col :xl="6" :lg="7" :md="8" :sm="24"> + <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons"> + <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button> + <a-button @click="searchReset" icon="reload" style="margin-left: 8px">閲嶇疆</a-button> + <a @click="handleToggleSearch" style="margin-left: 8px"> + {{ toggleSearchStatus ? '鏀惰捣' : '灞曞紑' }} + <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/> + </a> + </span> + </a-col> + + </a-row> + </a-form> + </div> + + <!-- 鎿嶄綔鎸夐挳鍖哄煙 --> + <div class="table-operator"> + <a-button @click="handleAdd" type="primary" icon="plus">鏂板</a-button> + <a-button type="primary" icon="download" @click="handleExportXls('缁翠慨宸ュ崟')">瀵煎嚭</a-button> + <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" + @change="handleImportExcel"> + <a-button type="primary" icon="import">瀵煎叆</a-button> + </a-upload> + <a-dropdown v-if="selectedRowKeys.length > 0"> + <a-menu slot="overlay"> + <a-menu-item key="1" @click="batchDel"> + <a-icon type="delete"/> + 鍒犻櫎 + </a-menu-item> + </a-menu> + <a-button style="margin-left: 8px"> 鎵归噺鎿嶄綔 + <a-icon type="down"/> + </a-button> + </a-dropdown> + </div> + + <!-- table鍖哄煙-begin --> + <div> + <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;"> + <i class="anticon anticon-info-circle ant-alert-icon"></i> 宸查�夋嫨 <a + style="font-weight: 600">{{ selectedRowKeys.length }}</a>椤� + <a style="margin-left: 24px" @click="onClearSelected">娓呯┖</a> + </div> + + <a-table + ref="table" + size="middle" + bordered + rowKey="id" + :columns="columns" + :dataSource="dataSource" + :pagination="ipagination" + :loading="loading" + class="j-table-force-nowrap" + :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" + @change="handleTableChange" + :scroll="{x:'max-content'}" + > + + <span slot="action" slot-scope="text, record"> + <a @click="handleEdit(record)">缂栬緫</a> + + <a-divider type="vertical"/> + <a-dropdown> + <a class="ant-dropdown-link">鏇村 <a-icon type="down"/></a> + <a-menu slot="overlay"> + <a-menu-item> + <a-popconfirm title="纭畾鍒犻櫎鍚�?" @confirm="() => handleDelete(record.id)"> + <a>鍒犻櫎</a> + </a-popconfirm> + </a-menu-item> + </a-menu> + </a-dropdown> + </span> + + </a-table> + </div> + <!-- table鍖哄煙-end --> + + <!-- 琛ㄥ崟鍖哄煙 --> + <eamRepairOrder-modal ref="modalForm" @ok="modalFormOk"></eamRepairOrder-modal> + </a-card> +</template> + +<script> +import '@/assets/less/TableExpand.less' +import EamRepairOrderModal from './modules/EamRepairOrderModal' +import { JeecgListMixin } from '@/mixins/JeecgListMixin' +import LxSearchEquipmentSelect from '@views/eam/equipment/modules/LxSearchEquipmentSelect.vue' + +export default { + name: 'EamRepairOrderList', + mixins: [JeecgListMixin], + components: { + LxSearchEquipmentSelect, + EamRepairOrderModal + }, + data() { + return { + description: '缁翠慨宸ュ崟绠$悊椤甸潰', + // 琛ㄥご + columns: [ + { + title: '#', + dataIndex: '', + key: 'rowIndex', + width: 60, + align: 'center', + customRender: function(t, r, index) { + return parseInt(index) + 1 + }, + fixed: 'left' + }, + { + title: '宸ュ崟缂栧彿', + align: 'center', + dataIndex: 'repairCode', + width: 200, + fixed: 'left' + }, + { + title: '鎶ヤ慨缂栧彿', + align: 'center', + dataIndex: 'reportId', + width: 200, + fixed: 'left' + }, + { + title: '璁惧缂栧彿', + align: 'center', + dataIndex: 'equipmentId_dictText', + width: 200, + fixed: 'left' + }, + { + title: '鐘舵��', + align: 'center', + dataIndex: 'repairStatus_dicText', + fixed: 'left', + width: 100 + }, + { + title: '缁翠慨寮�濮嬫椂闂�', + align: 'center', + dataIndex: 'actualStartTime', + width: 200 + }, + { + title: '缁翠慨缁撴潫鏃堕棿', + align: 'center', + dataIndex: 'actualEndTime', + width: 200 + }, + { + title: '鏁呴殰鍘熷洜', + align: 'center', + dataIndex: 'faultReason' + }, + { + title: '缁翠慨缁撴灉鎻忚堪', + align: 'center', + dataIndex: 'repairDescription', + width: 300 + }, + { + title: '缁翠慨璐熻矗浜�', + align: 'center', + dataIndex: 'repairer', + width: 100 + }, + { + title: '鏄惁濮斿', + align: 'center', + dataIndex: 'outsourcedFlag', + width: 100 + }, + { + title: '濮斿缁翠慨鎻忚堪', + align: 'center', + dataIndex: 'outsourcedRepairDecription', + width: 300 + }, + { + title: '濮斿缁翠慨寮�濮嬫椂闂�', + align: 'center', + dataIndex: 'outsourcedStartTime', + width: 200 + }, + { + title: '濮斿缁翠慨缁撴潫鏃堕棿', + align: 'center', + dataIndex: 'outsourcedEndTime', + width: 200 + }, + { + title: '濮斿璐熻矗浜�', + align: 'center', + dataIndex: 'outsourcedPerson', + width: 100 + }, + { + title: '缁翠慨鍥剧墖', + align: 'center', + dataIndex: 'imageFiles', + width: 100 + }, + { + title: '鎿嶄綔', + dataIndex: 'action', + align: 'center', + scopedSlots: { customRender: 'action' }, + fixed: 'right', + width: 150 + } + ], + url: { + list: '/eam/eamRepairOrder/list', + delete: '/eam/eamRepairOrder/delete', + deleteBatch: '/eam/eamRepairOrder/deleteBatch', + exportXlsUrl: 'eam/eamRepairOrder/exportXls', + importExcelUrl: 'eam/eamRepairOrder/importExcel' + } + } + }, + computed: { + importExcelUrl: function() { + return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}` + } + }, + methods: {} +} +</script> +<style scoped> +@import '~@assets/less/common.less'; +</style> \ No newline at end of file diff --git a/src/views/eam/repair/modules/EamRepairOrderModal.vue b/src/views/eam/repair/modules/EamRepairOrderModal.vue new file mode 100644 index 0000000..1552474 --- /dev/null +++ b/src/views/eam/repair/modules/EamRepairOrderModal.vue @@ -0,0 +1,206 @@ +<template> + <j-modal + :title="title" + :width="800" + :visible="visible" + :confirmLoading="confirmLoading" + switchFullscreen + @ok="handleOk" + @cancel="handleCancel" + cancelText="鍏抽棴"> + <a-spin :spinning="confirmLoading"> + <a-form-model ref="form" :model="model" :labelCol="labelCol" :wrapperCol="wrapperCol" :rules="validatorRules"> + <a-row> + <a-col :span="12"> + <a-form-model-item prop="repairCode" label="宸ュ崟缂栧彿"> + <a-input placeholder="璇疯緭鍏ュ伐鍗曠紪鍙�" v-model="model.repairCode"/> + </a-form-model-item> + </a-col> + + <a-col :span="12"> + <a-form-model-item prop="reportId" label="鎶ヤ慨缂栧彿"> + <a-input placeholder="璇疯緭鍏ユ姤淇紪鍙�" v-model="model.reportId"/> + </a-form-model-item> + </a-col> + </a-row> + + <a-row> + <a-col :span="12"> + <a-form-model-item prop="equipmentId" label="璁惧缂栧彿"> + <lx-search-equipment-select placeholder="璇疯緭鍏ヨ澶囩紪鍙锋垨鍚嶇О鎼滅储" v-model="model.equipmentId"/> + </a-form-model-item> + </a-col> + + <!-- <a-col :span="12">--> + <!-- <a-form-model-item prop="repairStatus" label="缁翠慨鐘舵��">--> + <!-- <a-input placeholder="璇疯緭鍏ョ淮淇姸鎬�" v-model="model.repairStatus"/>--> + <!-- </a-form-model-item>--> + <!-- </a-col>--> + <a-col :span="12"> + <a-form-model-item prop="faultReason" label="鏁呴殰鍘熷洜"> + <a-input placeholder="璇疯緭鍏ユ晠闅滃師鍥�" v-model="model.faultReason"/> + </a-form-model-item> + </a-col> + </a-row> + + <a-row> + <a-col :span="12"> + <a-form-model-item prop="actualStartTime" label="缁翠慨寮�濮嬫椂闂�"> + <a-input placeholder="璇疯緭鍏ョ淮淇紑濮嬫椂闂�" v-model="model.actualStartTime"/> + </a-form-model-item> + </a-col> + + <a-col :span="12"> + <a-form-model-item prop="actualEndTime" label="缁翠慨缁撴潫鏃堕棿"> + <a-input placeholder="璇疯緭鍏ョ淮淇粨鏉熸椂闂�" v-model="model.actualEndTime"/> + </a-form-model-item> + </a-col> + </a-row> + + <a-row> + <a-col :span="12"> + <a-form-model-item prop="repairDescription" label="缁翠慨缁撴灉鎻忚堪"> + <a-input placeholder="璇疯緭鍏ョ淮淇粨鏋滄弿杩�" v-model="model.repairDescription"/> + </a-form-model-item> + </a-col> + + <a-col :span="12"> + <a-form-model-item prop="repairer" label="缁翠慨璐熻矗浜�"> + <a-input placeholder="璇疯緭鍏ョ淮淇礋璐d汉" v-model="model.repairer"/> + </a-form-model-item> + </a-col> + </a-row> + <a-row> + <a-col :span="12"> + <a-form-model-item prop="outsourcedStartTime" label="濮斿缁翠慨寮�濮嬫椂闂�"> + <a-date-picker show-time value-format="YYYY-MM-DD HH:mm:ss" style="width: 100%" + placeholder="璇疯緭鍏ュ澶栫淮淇紑濮嬫椂闂�" + v-model="model.outsourcedStartTime"/> + </a-form-model-item> + </a-col> + + <a-col :span="12"> + <a-form-model-item prop="outsourcedEndTime" label="濮斿缁翠慨缁撴潫鏃堕棿"> + <a-date-picker show-time value-format="YYYY-MM-DD HH:mm:ss" style="width: 100%" + placeholder="璇疯緭鍏ュ澶栫淮淇粨鏉熸椂闂�" + v-model="model.outsourcedEndTime"/> + </a-form-model-item> + </a-col> + </a-row> + + <a-row> + <a-col :span="12"> + <a-form-model-item prop="outsourcedPerson" label="濮斿璐熻矗浜�"> + <a-input placeholder="璇疯緭鍏ュ澶栬礋璐d汉" v-model="model.outsourcedPerson"/> + </a-form-model-item> + </a-col> + </a-row> + + <a-row> + <a-col :span="24"> + <a-form-model-item prop="imageFiles" label="缁翠慨鍥剧墖" :labelCol="labelColLong" :wrapperCol="wrapperColLong"> + <j-image-upload v-model="model.imageFiles" :is-multiple="true" :number="3"/> + </a-form-model-item> + </a-col> + </a-row> + </a-form-model> + </a-spin> + </j-modal> +</template> + +<script> +import { httpAction } from '@api/manage' +import moment from 'moment' +import LxSearchEquipmentSelect from '@views/eam/equipment/modules/LxSearchEquipmentSelect.vue' + +export default { + name: 'EamRepairOrderModal', + components: { LxSearchEquipmentSelect }, + data() { + return { + title: '鎿嶄綔', + visible: false, + model: {}, + labelCol: { + xs: { span: 24 }, + sm: { span: 8 } + }, + wrapperCol: { + xs: { span: 24 }, + sm: { span: 12 } + }, + labelColLong: { + xs: { span: 24 }, + sm: { span: 4 } + }, + wrapperColLong: { + xs: { span: 24 }, + sm: { span: 18 } + }, + confirmLoading: false, + validatorRules: {}, + url: { + add: '/eam/eamRepairOrder/add', + edit: '/eam/eamRepairOrder/edit' + } + } + }, + created() { + }, + methods: { + add() { + //鍒濆鍖栭粯璁ゅ�� + this.edit({}) + }, + edit(record) { + this.model = Object.assign({}, record) + this.visible = true + }, + close() { + this.$emit('close') + this.visible = false + this.$refs.form.clearValidate() + }, + handleOk() { + const that = this + // 瑙﹀彂琛ㄥ崟楠岃瘉 + this.$refs.form.validate(valid => { + if (valid) { + that.confirmLoading = true + let httpurl = '' + let method = '' + if (!this.model.id) { + httpurl += this.url.add + method = 'post' + } else { + httpurl += this.url.edit + method = 'put' + } + httpAction(httpurl, this.model, method).then((res) => { + if (res.success) { + that.$message.success(res.message) + that.$emit('ok') + } else { + that.$message.warning(res.message) + } + }).finally(() => { + that.confirmLoading = false + that.close() + }) + } else { + return false + } + }) + }, + handleCancel() { + this.close() + } + + + } +} +</script> + +<style lang="less" scoped> + +</style> \ No newline at end of file -- Gitblit v1.9.3