| @ -0,0 +1,559 @@ | |||||
| <template> | |||||
| <a-row :gutter="10"> | |||||
| <a-col :md="leftColMd" :sm="24" style="margin-bottom: 20px"> | |||||
| <a-card :bordered="false"> | |||||
| <!-- 查询区域 --> | |||||
| <div class="table-page-search-wrapper"> | |||||
| <a-form layout="inline" @keyup.enter.native="searchQuery"> | |||||
| <a-row :gutter="24"> | |||||
| <a-col :md="6" :sm="12"> | |||||
| <a-form-item label="订单状态"> | |||||
| <j-dict-select-tag dict-code="hotel_order_flow,name,value,pid=0" placeholder="请选择订单状态" v-model="queryParam.status"></j-dict-select-tag> | |||||
| </a-form-item> | |||||
| </a-col> | |||||
| <a-col :md="6" :sm="12"> | |||||
| <a-form-item label="订单编号"> | |||||
| <a-input placeholder="请输入订单编号" v-model="queryParam.id"></a-input> | |||||
| <!-- <j-input placeholder="输入账号模糊查询" v-model="queryParam.username"></j-input>--> | |||||
| </a-form-item> | |||||
| </a-col> | |||||
| <a-col :md="6" :sm="12"> | |||||
| <a-form-item label="用户编号"> | |||||
| <a-input placeholder="请输入用户编号" v-model="queryParam.userId"></a-input> | |||||
| <!-- <j-input placeholder="输入账号模糊查询" v-model="queryParam.username"></j-input>--> | |||||
| </a-form-item> | |||||
| </a-col> | |||||
| <a-col :md="6" :sm="12"> | |||||
| <a-form-item label="店铺编号"> | |||||
| <j-dict-select-tag dict-code="hotel_shop,name,user_id" placeholder="请输入店铺编号" v-model="queryParam.shopId"></j-dict-select-tag> | |||||
| </a-form-item> | |||||
| </a-col> | |||||
| </a-row> | |||||
| </a-form> | |||||
| </div> | |||||
| <!-- 查询区域-END --> | |||||
| <!-- 操作按钮区域 --> | |||||
| <div class="table-operator"> | |||||
| <!-- <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>--> | |||||
| <!-- <a-button type="primary" icon="download" @click="handleExportXls('hotel_order')">导出</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>--> | |||||
| <!-- 高级查询区域 --> | |||||
| <!-- <j-super-query :fieldList="superFieldList" ref="superQueryModal" @handleSuperQuery="handleSuperQuery"></j-super-query>--> | |||||
| <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" | |||||
| :scroll="{x:true}" | |||||
| bordered | |||||
| rowKey="id" | |||||
| :columns="columns" | |||||
| :dataSource="dataSource" | |||||
| :pagination="ipagination" | |||||
| :loading="loading" | |||||
| :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" | |||||
| class="j-table-force-nowrap" | |||||
| @change="handleTableChange"> | |||||
| <template slot="htmlSlot" slot-scope="text"> | |||||
| <div v-html="text"></div> | |||||
| </template> | |||||
| <template slot="imgSlot" slot-scope="text,record"> | |||||
| <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span> | |||||
| <img v-else :src="getImgView(text)" :preview="record.id" height="25px" alt="" style="max-width:80px;font-size: 12px;font-style: italic;"/> | |||||
| </template> | |||||
| <template slot="fileSlot" slot-scope="text"> | |||||
| <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span> | |||||
| <a-button | |||||
| v-else | |||||
| :ghost="true" | |||||
| type="primary" | |||||
| icon="download" | |||||
| size="small" | |||||
| @click="downloadFile(text)"> | |||||
| 下载 | |||||
| </a-button> | |||||
| </template> | |||||
| <span slot="action" slot-scope="text, record"> | |||||
| <a @click="handleOpen(record)">订单详情</a> | |||||
| <a-divider type="vertical"/> | |||||
| <!-- <a @click="handleEdit(record)">编辑</a>--> | |||||
| <!-- <a-divider type="vertical" />--> | |||||
| <div v-if="record.status === 1"> | |||||
| <a @click="handleSend(record)">发货</a> | |||||
| <a-divider type="vertical" /> | |||||
| </div> | |||||
| <a-dropdown> | |||||
| <a class="ant-dropdown-link">更多 <a-icon type="down" /></a> | |||||
| <a-menu slot="overlay"> | |||||
| <a-menu-item> | |||||
| <a @click="handleDetail(record)">详情</a> | |||||
| </a-menu-item> | |||||
| <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> | |||||
| <hotel-order-modal ref="modalForm" @ok="modalFormOk"></hotel-order-modal> | |||||
| <lease-order-modal ref="modalForm2" @ok="modalFormOk"></lease-order-modal> | |||||
| </a-card> | |||||
| </a-col> | |||||
| <a-col :md="rightColMd" :sm="24" v-if="this.rightcolval == 1"> | |||||
| <a-card :bordered="false"> | |||||
| <!-- 查询区域 --> | |||||
| <div class="table-page-search-wrapper"> | |||||
| <a-form layout="inline"> | |||||
| <a-row :gutter="24"> | |||||
| <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons"> | |||||
| <!-- <a-col :md="9" :sm="24">--> | |||||
| <!-- <a-button type="primary" @click="searchQuery2" icon="search" style="margin-left: 21px">查询</a-button>--> | |||||
| <!-- <a-button type="primary" @click="searchReset2" icon="reload" style="margin-left: 8px">重置</a-button>--> | |||||
| <!-- </a-col>--> | |||||
| </span> | |||||
| </a-row> | |||||
| </a-form> | |||||
| </div> | |||||
| <!-- 操作按钮区域 --> | |||||
| <div class="table-operator" :md="24" :sm="24"> | |||||
| <!-- <a-button @click="handleAdd2" type="primary" icon="plus" style="margin-top: 16px">新增规格</a-button>--> | |||||
| <!--<a-button @click="handleEdit2" type="primary" icon="edit" style="margin-top: 16px">用户编辑</a-button>--> | |||||
| <!-- <a-button @click="handleAddUserRole" type="primary" icon="plus" style="margin-top: 16px">已有用户</a-button>--> | |||||
| <!-- <a-dropdown v-if="selectedRowKeys2.length > 0">--> | |||||
| <!-- <a-menu slot="overlay">--> | |||||
| <!-- <a-menu-item key="1" @click="batchDel2">--> | |||||
| <!-- <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">{{--> | |||||
| <!-- selectedRowKeys2.length }}</a>项--> | |||||
| <!-- <a style="margin-left: 24px" @click="onClearSelected2">清空</a>--> | |||||
| <!-- </div>--> | |||||
| <a-table | |||||
| style="height:500px" | |||||
| ref="table2" | |||||
| bordered | |||||
| size="middle" | |||||
| rowKey="id" | |||||
| :columns="columns2" | |||||
| :dataSource="dataSource2" | |||||
| :pagination="ipagination2" | |||||
| :loading="loading2" | |||||
| :rowSelection="{selectedRowKeys: selectedRowKeys2, onChange: onSelectChange2}" | |||||
| @change="handleTableChange2"> | |||||
| <template slot="imgSlot" slot-scope="text,record"> | |||||
| <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span> | |||||
| <img v-else :src="getImgView(text)" :preview="record.id" height="25px" alt="" style="max-width:80px;font-size: 12px;font-style: italic;"/> | |||||
| </template> | |||||
| <span slot="action" slot-scope="text, record"> | |||||
| <!-- <a @click="handleEdit2(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="() => handleDelete2(record.id)">--> | |||||
| <!-- <a>删除</a>--> | |||||
| <!-- </a-popconfirm>--> | |||||
| <!-- </a-menu-item>--> | |||||
| <!-- </a-menu>--> | |||||
| </a-dropdown> | |||||
| </span> | |||||
| </a-table> | |||||
| </div> | |||||
| <!-- 表单区域 --> | |||||
| <hotel-goods-modal ref="modalForm" @ok="modalFormOk"></hotel-goods-modal> | |||||
| <hotel-order-detail-modal ref="modalForm2" @ok="modalFormOk2"></hotel-order-detail-modal> | |||||
| <!-- <Select-User-Modal ref="selectUserModal" @selectFinished="selectOK"></Select-User-Modal>--> | |||||
| </a-card> | |||||
| </a-col> | |||||
| </a-row> | |||||
| </template> | |||||
| <script> | |||||
| import '@/assets/less/TableExpand.less' | |||||
| import { mixinDevice } from '@/utils/mixin' | |||||
| import { JeecgListMixin } from '@/mixins/JeecgListMixin' | |||||
| import HotelOrderModal from './modules/HotelOrderModal' | |||||
| import LeaseOrderModal from './modules/LeaseOrderModal' | |||||
| import {getAction, httpAction} from "@api/manage"; | |||||
| import {filterObj} from "@/utils/util"; | |||||
| import HotelOrderDetailModal from './modules/HotelOrderDetailModal' | |||||
| export default { | |||||
| name: 'LeaseOrderList', | |||||
| mixins:[JeecgListMixin, mixinDevice], | |||||
| components: { | |||||
| HotelOrderModal, | |||||
| LeaseOrderModal, | |||||
| HotelOrderDetailModal | |||||
| }, | |||||
| data () { | |||||
| return { | |||||
| description: '租赁订单管理页面', | |||||
| // 表头 | |||||
| columns: [ | |||||
| { | |||||
| title: '#', | |||||
| dataIndex: '', | |||||
| key:'rowIndex', | |||||
| width:60, | |||||
| align:"center", | |||||
| customRender:function (t,r,index) { | |||||
| return parseInt(index)+1; | |||||
| } | |||||
| }, | |||||
| { | |||||
| title:'创建时间', | |||||
| align:"center", | |||||
| dataIndex: 'createTime', | |||||
| sorter: true, | |||||
| }, | |||||
| { | |||||
| title:'标题', | |||||
| align:"center", | |||||
| dataIndex: 'title' | |||||
| }, | |||||
| { | |||||
| title:'商品图片', | |||||
| align:"center", | |||||
| dataIndex: 'pic', | |||||
| scopedSlots: {customRender: 'imgSlot'} | |||||
| }, | |||||
| { | |||||
| title:'客户姓名', | |||||
| align:"center", | |||||
| dataIndex: 'userName' | |||||
| }, | |||||
| { | |||||
| title:'客户手机号', | |||||
| align:"center", | |||||
| dataIndex: 'userPhone' | |||||
| }, | |||||
| { | |||||
| title:'用户地址', | |||||
| align:"center", | |||||
| dataIndex: 'userAddress' | |||||
| }, | |||||
| { | |||||
| title:'用户编号', | |||||
| align:"center", | |||||
| dataIndex: 'userId' | |||||
| }, | |||||
| { | |||||
| title:'店铺编号', | |||||
| align:"center", | |||||
| dataIndex: 'shopId' | |||||
| }, | |||||
| { | |||||
| title:'租赁时间', | |||||
| align:"center", | |||||
| dataIndex: 'leaseTime' | |||||
| }, | |||||
| { | |||||
| title:'缴纳费用', | |||||
| align:"center", | |||||
| dataIndex: 'payFee' | |||||
| }, | |||||
| { | |||||
| title:'押金', | |||||
| align:"center", | |||||
| dataIndex: 'deposit' | |||||
| }, | |||||
| { | |||||
| title:'水洗费用', | |||||
| align:"center", | |||||
| dataIndex: 'washPay' | |||||
| }, | |||||
| { | |||||
| title:'水洗费用', | |||||
| align:"center", | |||||
| dataIndex: 'rentPay' | |||||
| }, | |||||
| { | |||||
| title:'支付金额', | |||||
| align:"center", | |||||
| dataIndex: 'orderPay' | |||||
| }, | |||||
| { | |||||
| title:'状态', | |||||
| align:"center", | |||||
| dataIndex: 'status_dictText' | |||||
| }, | |||||
| { | |||||
| title:'类型', | |||||
| align:"center", | |||||
| dataIndex: 'type_dictText' | |||||
| }, | |||||
| { | |||||
| title:'是否删除', | |||||
| align:"center", | |||||
| dataIndex: 'delFlag_dictText' | |||||
| }, | |||||
| { | |||||
| title: '操作', | |||||
| dataIndex: 'action', | |||||
| align:"center", | |||||
| fixed:"right", | |||||
| width:147, | |||||
| scopedSlots: { customRender: 'action' } | |||||
| } | |||||
| ], | |||||
| url: { | |||||
| list: "/hotelorder/hotelOrder/lease/flag/list", | |||||
| delete: "/hotelorder/hotelOrder/delete", | |||||
| deleteBatch: "/hotelorder/hotelOrder/deleteBatch", | |||||
| exportXlsUrl: "/hotelorder/hotelOrder/exportXls", | |||||
| importExcelUrl: "hotelorder/hotelOrder/importExcel", | |||||
| damageAuditUrl: "/hotelorder/hotelOrder/damage/audit", | |||||
| detailList: "/hotelorderdetail/hotelOrderDetail/list", | |||||
| }, | |||||
| dictOptions:{}, | |||||
| superFieldList:[], | |||||
| rightcolval:0, | |||||
| currentRoleId: '', | |||||
| selectionRows2: [], | |||||
| selectedRowKeys2:[], | |||||
| dataSource2:[], | |||||
| ipagination2: { | |||||
| current: 1, | |||||
| pageSize: 10, | |||||
| pageSizeOptions: ['10', '20', '30'], | |||||
| showTotal: (total, range) => { | |||||
| return range[0] + '-' + range[1] + ' 共' + total + '条' | |||||
| }, | |||||
| showQuickJumper: true, | |||||
| showSizeChanger: true, | |||||
| total: 0 | |||||
| }, | |||||
| columns2:[ | |||||
| { | |||||
| title:'商品名', | |||||
| align:"center", | |||||
| dataIndex: 'goodsName' | |||||
| }, | |||||
| { | |||||
| title:'商品图', | |||||
| align:"center", | |||||
| dataIndex: 'pic', | |||||
| scopedSlots: {customRender: 'imgSlot'} | |||||
| }, | |||||
| { | |||||
| title:'规格', | |||||
| align:"center", | |||||
| dataIndex: 'sku' | |||||
| }, | |||||
| { | |||||
| title:'数量', | |||||
| align:"center", | |||||
| dataIndex: 'num' | |||||
| }, | |||||
| { | |||||
| title:'押金', | |||||
| align:"center", | |||||
| dataIndex: 'deposit' | |||||
| }, | |||||
| { | |||||
| title:'租金', | |||||
| align:"center", | |||||
| dataIndex: 'rentPay' | |||||
| }, | |||||
| { | |||||
| title:'水洗费用', | |||||
| align:"center", | |||||
| dataIndex: 'washPay' | |||||
| }, | |||||
| { | |||||
| title:'优惠金额', | |||||
| align:"center", | |||||
| dataIndex: 'discountPrice' | |||||
| }, | |||||
| { | |||||
| title:'是否删除', | |||||
| align:"center", | |||||
| dataIndex: 'delFlag_dictText' | |||||
| }, | |||||
| { | |||||
| title: '操作', | |||||
| dataIndex: 'action', | |||||
| align:"center", | |||||
| fixed:"right", | |||||
| width:147, | |||||
| scopedSlots: { customRender: 'action' } | |||||
| } | |||||
| ], | |||||
| } | |||||
| }, | |||||
| created() { | |||||
| this.getSuperFieldList(); | |||||
| }, | |||||
| computed: { | |||||
| importExcelUrl: function(){ | |||||
| return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`; | |||||
| }, | |||||
| leftColMd() { | |||||
| return this.selectedRowKeys.length === 0 ? 24 : 12 | |||||
| }, | |||||
| rightColMd() { | |||||
| return this.selectedRowKeys.length === 0 ? 0 : 12 | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| initDictConfig(){ | |||||
| }, | |||||
| getSuperFieldList(){ | |||||
| let fieldList=[]; | |||||
| fieldList.push({type:'string',value:'title',text:'标题',dictCode:''}) | |||||
| fieldList.push({type:'string',value:'userName',text:'客户姓名',dictCode:''}) | |||||
| fieldList.push({type:'string',value:'userPhone',text:'客户手机号',dictCode:''}) | |||||
| fieldList.push({type:'string',value:'userId',text:'用户编号',dictCode:''}) | |||||
| fieldList.push({type:'string',value:'shopId',text:'店铺编号',dictCode:''}) | |||||
| // fieldList.push({type:'int',value:'status',text:'状态',dictCode:'order_status'}) | |||||
| // fieldList.push({type:'int',value:'type',text:'类型',dictCode:'hotel_order_type'}) | |||||
| // fieldList.push({type:'int',value:'delFlag',text:'是否删除',dictCode:'is_delete'}) | |||||
| this.superFieldList = fieldList | |||||
| }, | |||||
| handleSend(obj){ | |||||
| this.$refs.modalForm2.edit(obj); | |||||
| this.$refs.modalForm2.title = "审核"; | |||||
| this.$refs.modalForm2.disableSubmit = false; | |||||
| console.log(obj) | |||||
| }, | |||||
| searchQuery2() { | |||||
| this.loadData2(1) | |||||
| }, | |||||
| searchReset2() { | |||||
| this.queryParam2 = {} | |||||
| this.loadData2(1) | |||||
| }, | |||||
| handleTableChange2(pagination, filters, sorter) { | |||||
| //分页、排序、筛选变化时触发 | |||||
| //TODO 筛选 | |||||
| if (Object.keys(sorter).length > 0) { | |||||
| this.isorter2.column = sorter.field | |||||
| this.isorter2.order = 'ascend' == sorter.order ? 'asc' : 'desc' | |||||
| } | |||||
| this.ipagination2 = pagination | |||||
| this.loadData2() | |||||
| }, | |||||
| hideUserList(){ | |||||
| //this.rightcolval = 0 | |||||
| this.selectedRowKeys1 = [] | |||||
| }, | |||||
| handlePerssion(roleId){ | |||||
| this.$refs.modalUserRole.show(roleId); | |||||
| }, | |||||
| onSelectChange2(selectedRowKeys, selectionRows) { | |||||
| this.selectedRowKeys2 = selectedRowKeys | |||||
| this.selectionRows2 = selectionRows | |||||
| }, | |||||
| onClearSelected2() { | |||||
| this.selectedRowKeys2 = [] | |||||
| this.selectionRows2 = [] | |||||
| }, | |||||
| handleOpen(record) { | |||||
| this.rightcolval = 1 | |||||
| this.selectedRowKeys = [record.id] | |||||
| this.model = Object.assign({}, record) | |||||
| this.currentRoleId = record.id | |||||
| this.onClearSelected2() | |||||
| this.loadData2() | |||||
| }, | |||||
| loadData2(arg) { | |||||
| if (!this.url.detailList) { | |||||
| this.$message.error('请设置url.list2属性!') | |||||
| return | |||||
| } | |||||
| //加载数据 若传入参数1则加载第一页的内容 | |||||
| if (arg === 1) { | |||||
| this.ipagination2.current = 1 | |||||
| } | |||||
| if (this.currentRoleId === '') return | |||||
| // let params = this.getQueryParams2()//查询条件 | |||||
| // params.orderId = this.currentRoleId | |||||
| let params = { | |||||
| orderId: this.currentRoleId | |||||
| } | |||||
| this.loading2 = true | |||||
| getAction(this.url.detailList, params).then((res) => { | |||||
| if (res.success) { | |||||
| this.dataSource2 = res.result.records | |||||
| this.ipagination2.total = res.result.total | |||||
| } | |||||
| this.loading2 = false | |||||
| }) | |||||
| }, | |||||
| getQueryParams2() { | |||||
| //获取查询条件 | |||||
| let sqp = {} | |||||
| if (this.superQueryParams2) { | |||||
| sqp['superQueryParams'] = encodeURI(this.superQueryParams2) | |||||
| sqp['superQueryMatchType'] = this.superQueryMatchType2 | |||||
| } | |||||
| var param = Object.assign(sqp, this.queryParam2, this.isorter2, this.filters2) | |||||
| param.field = this.getQueryField2() | |||||
| param.pageNo = this.ipagination2.current | |||||
| param.pageSize = this.ipagination2.pageSize | |||||
| return filterObj(param) | |||||
| }, | |||||
| handleEdit2: function(record) { | |||||
| this.$refs.modalForm2.title = '编辑' | |||||
| this.$refs.modalForm2.roleDisabled = true | |||||
| this.$refs.modalForm2.edit(record) | |||||
| }, | |||||
| modalFormOk2() { | |||||
| // 新增/修改 成功时,重载列表 | |||||
| this.loadData2() | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped> | |||||
| @import '~@assets/less/common.less'; | |||||
| </style> | |||||