1608 lines
56 KiB
Vue
1608 lines
56 KiB
Vue
<script setup lang="ts">
|
||
import { ref } from 'vue'
|
||
import PagingComponent from 'components/PagingComponent/index.vue'
|
||
import { useRouter } from 'vue-router'
|
||
import { getOrderListApi } from 'http/api/usercenter/seekorder'
|
||
import uploadComponent from 'components/uploadComponent/index.vue'
|
||
import previewImg from './previewImg/index.vue'
|
||
import { ElMessage } from 'element-plus'
|
||
import { useStore } from 'store/user'
|
||
const store = useStore()
|
||
import { mainStore } from 'store/main'
|
||
const store2 = mainStore()
|
||
/* 查询参数 */
|
||
const queryParams: any = ref({
|
||
deviceName: '',
|
||
orderStatus: '',
|
||
czcompanyName: '',
|
||
companyName: '',
|
||
lowerBound: '',
|
||
upperBound: '',
|
||
pageSize: 10,
|
||
pageNum: 1,
|
||
startTime: '',
|
||
endTime: '',
|
||
})
|
||
const time = ref([])
|
||
const router = useRouter()
|
||
const pageSize = 10
|
||
const pageNumber = 1
|
||
const total: any = ref(0)
|
||
const cardList = ref<any>([])
|
||
const status = 0
|
||
const statusList = [
|
||
{ id: '0', name: '未下单' },
|
||
{ id: '1', name: '已下单' },
|
||
{ id: '2', name: '待出库' },
|
||
{ id: '3', name: '已出库' },
|
||
{ id: '4', name: '租赁中' },
|
||
{ id: '5', name: '已退租' },
|
||
{ id: '5', name: '已完成' },
|
||
]
|
||
// 获取数据列表
|
||
// const getList = async () => {
|
||
// const res: any = await getOrderListApi()
|
||
// console.log('获取数据列表***', res)
|
||
// tableData.value = res.rows
|
||
// total.value = res.total
|
||
// }
|
||
/** 查询列表 */
|
||
const getList = async () => {
|
||
if (time.value.length > 0) {
|
||
console.log('time', time)
|
||
queryParams.value.startTime = time.value[0]
|
||
queryParams.value.endTime = time.value[1]
|
||
} else {
|
||
queryParams.value.startTime = undefined
|
||
queryParams.value.endTime = undefined
|
||
}
|
||
const res: any = await getOrderListApi(queryParams.value)
|
||
cardList.value = res.rows
|
||
total.value = res.total
|
||
}
|
||
|
||
//订单详情
|
||
const handleViewOrder = (index: Number, row: any) => {
|
||
router.push({
|
||
name: 'orderManagementInfo',
|
||
query: { orderStatusTemp: Number(row.orderStatus), idTemp: row.id },
|
||
})
|
||
}
|
||
|
||
onMounted(() => {
|
||
getList()
|
||
})
|
||
|
||
// 查询按钮
|
||
const queryTableList = () => {
|
||
getList()
|
||
}
|
||
|
||
/* 退租按钮 */
|
||
const clickRentingTermination = () => {
|
||
router.push({ name: 'rentinTermination' })
|
||
console.log('退租')
|
||
}
|
||
|
||
/* 查看按钮 */
|
||
const clickPreviewDetails = (row: any) => {
|
||
console.log('查看', row)
|
||
router.push({
|
||
name: 'orderDetails',
|
||
query: {
|
||
orderId: row.orderId,
|
||
},
|
||
})
|
||
}
|
||
|
||
/* 续租按钮 */
|
||
const clickRenewalOfLease = ({ row }: any) => {
|
||
console.log('续租', row)
|
||
router.push({
|
||
name: 'renewalOfLease',
|
||
query: {
|
||
orderId: row.orderId,
|
||
},
|
||
})
|
||
}
|
||
|
||
/* 确认收货 */
|
||
const clickConfirmReceipt = (row: any) => {
|
||
console.log('确认收货')
|
||
router.push({
|
||
name: 'orderDetails',
|
||
query: {
|
||
orderId: row.orderId,
|
||
confirm: 'true',
|
||
},
|
||
})
|
||
}
|
||
|
||
const settleinTitle = ref('')
|
||
/* 编辑 **********/
|
||
const isEditDisabled = ref(false)
|
||
// 退租检修弹框显示隐藏
|
||
const dialogFormVisibleSettlein: any = ref(false)
|
||
const equipmentDeploymentParams: any = ref({
|
||
/* 设备名称 */
|
||
deviceName: '',
|
||
deviceTypeList: [],
|
||
deviceCount: 1,
|
||
unitName: '',
|
||
code: '',
|
||
brand: '',
|
||
typeId: '',
|
||
companyId: '',
|
||
productionDate: '',
|
||
dayLeasePrice: '',
|
||
person: '',
|
||
personPhone: '',
|
||
deviceWeight: '',
|
||
})
|
||
|
||
const mainFileList: any = ref([]) //检测文件1
|
||
const detailsFileList: any = ref([]) //检测文件2
|
||
//图片查看弹窗
|
||
const dialogVisible: any = ref(false)
|
||
const dialogImageUrl = ref('')
|
||
//上传
|
||
const upload: any = ref({
|
||
// 设置上传的请求头部
|
||
headers: { Authorization: 'Bearer ' + store2.token },
|
||
// 上传的地址
|
||
url: import.meta.env.VITE_API_URL + '/file/upload',
|
||
})
|
||
// 文件上传前处理-上传大小
|
||
const beforeUpload = (file: any) => {
|
||
if (file.size / 1024 / 1024 > 2) {
|
||
ElMessage({
|
||
type: 'error',
|
||
message: '上传文件大小不能超过2M!',
|
||
})
|
||
// this.$message.error({ message: `上传文件大小不能超过2M!`,});
|
||
return false
|
||
}
|
||
}
|
||
// 文件上传失败
|
||
const uploadError = () => {
|
||
ElMessage({
|
||
type: 'error',
|
||
message: '上传文件失败!',
|
||
})
|
||
// this.$message.error({message: `上传文件失败!`});
|
||
}
|
||
// 文件上传成功处理
|
||
const handleFileSuccess = (response: any) => {
|
||
if (response.code == 200) {
|
||
let obj = {
|
||
// modelId:this.maId,
|
||
fileName: response.data.name.split('/')[4],
|
||
fileUrl: response.data.url,
|
||
}
|
||
console.log(obj)
|
||
mainFileList.value.push(obj)
|
||
ElMessage({
|
||
type: 'success',
|
||
message: '上传成功！',
|
||
})
|
||
console.log(mainFileList.value)
|
||
}
|
||
}
|
||
|
||
// 文件上传成功处理
|
||
const handleFileSuccess2 = (response: any) => {
|
||
if (response.code == 200) {
|
||
let obj = {
|
||
// modelId:this.maId,
|
||
fileName: response.data.name.split('/')[4],
|
||
fileUrl: response.data.url,
|
||
}
|
||
console.log(obj)
|
||
detailsFileList.value.push(obj)
|
||
ElMessage({
|
||
type: 'success',
|
||
message: '上传成功！',
|
||
})
|
||
console.log(detailsFileList.value)
|
||
}
|
||
}
|
||
//退租检修
|
||
const handleViewBack = () => {
|
||
settleinTitle.value = '退租检修'
|
||
isEditDisabled.value = true
|
||
equipmentDeploymentParams.value = {
|
||
/* 企业Id */
|
||
// ownCo: mainStore().userInfo.companyId,
|
||
/* 租赁范围 */
|
||
leaseScope: '',
|
||
/* 设备所在地 */
|
||
location: '',
|
||
/* 省 */
|
||
provinceId: '',
|
||
/* 市 */
|
||
cityId: '',
|
||
/* 区 */
|
||
areaId: '',
|
||
/* 设备所在地 省 */
|
||
addressEconomize: '',
|
||
/* 设备所在地 市 */
|
||
addressProvince: '',
|
||
/* 设备所在地 区 */
|
||
addressArea: '',
|
||
/* 设备类型 */
|
||
typeId: '',
|
||
/* 设备类型大类 */
|
||
deviceType: '',
|
||
/* 设备类型子类 */
|
||
deviceTypeSon: '',
|
||
/* 设备类型小类*/
|
||
deviceTypeSun: '',
|
||
/* 设备品牌 */
|
||
brand: '',
|
||
/* 设备型号 */
|
||
modelName: '',
|
||
/* 出场日期 */
|
||
productionDate: '',
|
||
/* 工作小时数 */
|
||
workingHours: '',
|
||
/* 整机序列号 */
|
||
serialNumber: '',
|
||
/* 月租金 */
|
||
monthLeasePrice: '',
|
||
/* 日租金 */
|
||
dayLeasePrice: '',
|
||
/* 是否提供机手 */
|
||
isOperator: '',
|
||
/* 机手月费用 */
|
||
jsMonthPrice: '',
|
||
/* 机手日费用 */
|
||
jsDayPrice: '',
|
||
/* 详细说明 */
|
||
description: '',
|
||
/* 设备主图片 */
|
||
picUrl: '',
|
||
/* 检测信息 ，保险信息*/
|
||
fileList: [],
|
||
/* 设备状态 */
|
||
maStatus: 15,
|
||
detectionList: [],
|
||
insureList: [],
|
||
picList: []
|
||
}
|
||
// 打开退组检修弹框
|
||
dialogFormVisibleSettlein.value = true
|
||
}
|
||
const handleViewBack = () => {
|
||
settleinTitle.value = '退租检修'
|
||
isEditDisabled.value = true
|
||
equipmentDeploymentParams.value = {
|
||
/* 企业Id */
|
||
// ownCo: mainStore().userInfo.companyId,
|
||
/* 租赁范围 */
|
||
leaseScope: '',
|
||
/* 设备所在地 */
|
||
location: '',
|
||
/* 省 */
|
||
provinceId: '',
|
||
/* 市 */
|
||
cityId: '',
|
||
/* 区 */
|
||
areaId: '',
|
||
/* 设备所在地 省 */
|
||
addressEconomize: '',
|
||
/* 设备所在地 市 */
|
||
addressProvince: '',
|
||
/* 设备所在地 区 */
|
||
addressArea: '',
|
||
/* 设备类型 */
|
||
typeId: '',
|
||
/* 设备类型大类 */
|
||
deviceType: '',
|
||
/* 设备类型子类 */
|
||
deviceTypeSon: '',
|
||
/* 设备类型小类*/
|
||
deviceTypeSun: '',
|
||
/* 设备品牌 */
|
||
brand: '',
|
||
/* 设备型号 */
|
||
modelName: '',
|
||
/* 出场日期 */
|
||
productionDate: '',
|
||
/* 工作小时数 */
|
||
workingHours: '',
|
||
/* 整机序列号 */
|
||
serialNumber: '',
|
||
/* 月租金 */
|
||
monthLeasePrice: '',
|
||
/* 日租金 */
|
||
dayLeasePrice: '',
|
||
/* 是否提供机手 */
|
||
isOperator: '',
|
||
/* 机手月费用 */
|
||
jsMonthPrice: '',
|
||
/* 机手日费用 */
|
||
jsDayPrice: '',
|
||
/* 详细说明 */
|
||
description: '',
|
||
/* 设备主图片 */
|
||
picUrl: '',
|
||
/* 检测信息 ，保险信息*/
|
||
fileList: [],
|
||
/* 设备状态 */
|
||
maStatus: 15,
|
||
detectionList: [],
|
||
insureList: [],
|
||
picList: [],
|
||
}
|
||
|
||
const settlemoneyTitle = ref('')
|
||
const moneyParams1: any = ref({
|
||
/* 设备名称 */
|
||
deviceName: '',
|
||
deviceTypeList: [],
|
||
deviceCount: 1,
|
||
unitName: '',
|
||
})
|
||
const moneyParams2: any = ref({
|
||
/* 设备名称 */
|
||
deviceName: '',
|
||
deviceTypeList: [],
|
||
deviceCount: 1,
|
||
unitName: '',
|
||
})
|
||
const moneyParams3: any = ref({
|
||
/* 设备名称 */
|
||
deviceName: '',
|
||
deviceTypeList: [],
|
||
deviceCount: 1,
|
||
unitName: '',
|
||
})
|
||
const tableData: any = ref([
|
||
{
|
||
name1:'测试1',
|
||
name2:'测试1-1',
|
||
name3:'测试1-2',
|
||
jy1:'外观1-1',
|
||
jy2:'故障1-2',
|
||
jy3:'外观1-2',
|
||
jy4:'故障1-2',
|
||
jy5:'外观1-3',
|
||
jy6:'故障1-3',
|
||
jy7:'',
|
||
jy8:'',
|
||
remark:'备注1',
|
||
},
|
||
{
|
||
name1:'测试2',
|
||
name2:'测试2-1',
|
||
name3:'测试2-2',
|
||
jy1:'外观2-1',
|
||
jy2:'故障2-2',
|
||
jy3:'外观2-2',
|
||
jy4:'故障2-2',
|
||
jy5:'外观2-3',
|
||
jy6:'故障2-3',
|
||
jy7:'',
|
||
jy8:'',
|
||
remark:'备注2',
|
||
}
|
||
])
|
||
|
||
const partItems1: any = ref([{}])
|
||
const partItems2: any = ref([{}])
|
||
const partItems3: any = ref([{}])
|
||
// 费用结算弹框显示隐藏
|
||
const dialogFormVisibleSettlemoney: any = ref(false)
|
||
//费用结算
|
||
const handleViewMoney = () => {
|
||
settlemoneyTitle.value = '费用结算'
|
||
moneyParams1.value = {
|
||
/* 设备状态 */
|
||
maStatus: 15,
|
||
detectionList: [],
|
||
insureList: [],
|
||
picList: []
|
||
}
|
||
moneyParams2.value = {
|
||
/* 设备状态 */
|
||
maStatus: 15,
|
||
detectionList: [],
|
||
insureList: [],
|
||
picList: []
|
||
}
|
||
moneyParams3.value = {
|
||
/* 设备状态 */
|
||
maStatus: 15,
|
||
detectionList: [],
|
||
insureList: [],
|
||
picList: []
|
||
}
|
||
// 打开退组检修弹框
|
||
dialogFormVisibleSettlemoney.value = true
|
||
}
|
||
|
||
//维修费用
|
||
const addPartItem1=()=> {
|
||
partItems1.value.push({ partType: "", num: "", isCharge: "" });
|
||
}
|
||
const removePartItem1 =(index:number)=> {
|
||
if (partItems1.value.length > 1) {
|
||
partItems1.value.splice(index, 1);
|
||
}
|
||
}
|
||
|
||
//报废费用
|
||
const addPartItem2=()=> {
|
||
partItems2.value.push({ partType: "", num: "", isCharge: "" });
|
||
}
|
||
const removePartItem2 =(index:number)=> {
|
||
if (partItems2.value.length > 1) {
|
||
partItems2.value.splice(index, 1);
|
||
}
|
||
}
|
||
|
||
//报废费用 修改
|
||
|
||
|
||
//报废费用 修改
|
||
|
||
//报废费用 修改
|
||
//报废费用 修改
|
||
const addPartItem3=()=> {
|
||
partItems3.value.push({ partType: "", num: "", isCharge: "" });
|
||
}
|
||
const removePartItem3 =(index:number)=> {
|
||
if (partItems3.value.length > 1) {
|
||
partItems3.value.splice(index, 1);
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<!-- 订单管理 -->
|
||
<div class="container">
|
||
<el-form :model="queryParams" :inline="true" size="default" label-width="0">
|
||
<el-row>
|
||
<el-col :span="6">
|
||
<el-form-item prop="deviceName">
|
||
<el-input
|
||
style="width: 100%"
|
||
v-model.trim="queryParams.deviceName"
|
||
clearable
|
||
placeholder="请输入装备名称"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-form-item prop="orderStatus">
|
||
<el-select
|
||
v-model="queryParams.orderStatus"
|
||
placeholder="请选择订单状态"
|
||
style="width: 100%"
|
||
clearable
|
||
>
|
||
<el-option
|
||
v-for="item in statusList"
|
||
:key="item.id"
|
||
:label="item.name"
|
||
:value="item.id"
|
||
/>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-form-item prop="dateRange">
|
||
<el-date-picker
|
||
v-model="time"
|
||
type="daterange"
|
||
unlink-panels
|
||
range-separator="-"
|
||
start-placeholder="开始时间"
|
||
end-placeholder="结束时间"
|
||
style="width: 100%"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
|
||
<el-col :span="6">
|
||
<el-form-item prop="czcompanyName">
|
||
<el-input
|
||
v-model.trim="queryParams.czcompanyName"
|
||
clearable
|
||
maxlength="20"
|
||
placeholder="出租单位"
|
||
style="width: 100%"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row>
|
||
<el-col :span="6">
|
||
<el-form-item prop="companyName">
|
||
<el-input
|
||
v-model.trim="queryParams.companyName"
|
||
clearable
|
||
maxlength="20"
|
||
placeholder="承租单位"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-input
|
||
v-model.trim="queryParams.lowerBound"
|
||
placeholder="租金/元"
|
||
clearable
|
||
maxlength="20"
|
||
style="width: 45%"
|
||
/>
|
||
<span style="display: inline-block; width: 5%; text-align: center"> - </span>
|
||
<el-input
|
||
v-model.trim="queryParams.upperBound"
|
||
placeholder="租金/元"
|
||
clearable
|
||
maxlength="20"
|
||
style="width: 45%"
|
||
/>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item>
|
||
<el-button type="primary" @click="queryTableList">查询</el-button>
|
||
<el-button @click="resetQuery">重置</el-button>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<!-- <el-form-item label="装备名称：" prop="deviceName">
|
||
<el-input v-model.trim="queryParams.deviceName" style="width: 160px" clearable />
|
||
</el-form-item>
|
||
<el-form-item prop="dateRange">
|
||
<el-date-picker
|
||
v-model="time"
|
||
type="daterange"
|
||
unlink-panels
|
||
range-separator="-"
|
||
start-placeholder="开始时间"
|
||
end-placeholder="结束时间"
|
||
style="width: 180px"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="订单状态" prop="orderStatus">
|
||
<el-select
|
||
v-model="queryParams.orderStatus"
|
||
placeholder="请选择订单状态"
|
||
style="width: 120px"
|
||
clearable
|
||
>
|
||
<el-option
|
||
v-for="item in statusList"
|
||
:key="item.id"
|
||
:label="item.name"
|
||
:value="item.id"
|
||
/>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="出租单位：" prop="czcompanyName">
|
||
<el-input
|
||
v-model.trim="queryParams.czcompanyName"
|
||
clearable
|
||
maxlength="20"
|
||
style="width: 160px"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="承租单位：" prop="companyName">
|
||
<el-input
|
||
v-model.trim="queryParams.companyName"
|
||
clearable
|
||
maxlength="20"
|
||
style="width: 160px"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item prop="lowerBound">
|
||
<span
|
||
style="
|
||
display: flex;
|
||
justify-content: center;
|
||
width: 20px;
|
||
text-align: center;
|
||
margin-left: 25px;
|
||
"
|
||
>——</span
|
||
>
|
||
</el-form-item>
|
||
<el-form-item prop="upperBound"> </el-form-item> -->
|
||
</el-form>
|
||
|
||
<div class="cart-tbody" v-for="(item, index) in cardList" :key="index">
|
||
<el-row style="border-bottom: 1px solid #ccc">
|
||
<el-col :span="1">
|
||
<div style="text-align: center">
|
||
<el-checkbox
|
||
v-model="item.isChecked"
|
||
@change="onChangeCompany($event, index, item)"
|
||
>
|
||
</el-checkbox>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="22">
|
||
<el-row>
|
||
<el-col :span="6">
|
||
<div
|
||
class="item"
|
||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||
>
|
||
<span>订单编号:</span>
|
||
{{ item.code }}
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="7">
|
||
<div
|
||
class="item"
|
||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||
>
|
||
<span>下单时间:</span>
|
||
{{ item.orderTime }}
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="7">
|
||
<div
|
||
class="item"
|
||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||
>
|
||
<span>装备所属公司:</span>
|
||
{{ item.czcompanyName }}
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<div style="flex-shrink: 0; margin-bottom: 1px; font-size: 7px">
|
||
<el-button
|
||
v-if="status == 0"
|
||
class="item"
|
||
type="primary"
|
||
size="small"
|
||
>出库</el-button
|
||
>
|
||
<el-button
|
||
v-if="status == 0"
|
||
class="item"
|
||
type="primary"
|
||
size="small"
|
||
>驳回</el-button
|
||
>
|
||
</div>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row>
|
||
<el-col :span="6">
|
||
<div
|
||
class="item"
|
||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||
>
|
||
<span>出租方电话:</span>
|
||
{{ item.personPhone }}
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="7">
|
||
<div
|
||
class="item"
|
||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||
>
|
||
<span>承租方电话:</span>
|
||
{{ item.phoneNumber }}
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="7">
|
||
<div
|
||
class="item"
|
||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||
>
|
||
<span>承租方地址:</span>
|
||
{{ item.companyName }}
|
||
</div>
|
||
</el-col>
|
||
</el-row>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row class="cart-list" v-for="(goods, j) in item.detailsList" :key="j">
|
||
<el-col :span="1">
|
||
<div style="text-align: center">
|
||
<el-checkbox v-model="goods.isChecked" @change="onChangeGoods(index)">
|
||
</el-checkbox>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="9" class="goods-info">
|
||
<el-col :span="7">
|
||
<img :src="goods.url" alt="" />
|
||
</el-col>
|
||
<div class="goods-code">
|
||
<div style="font-size: 10px; font-weight: bold">{{ goods.deviceName }}</div>
|
||
<div>租期：{{ goods.days }}{{ ' ' + '天' }}</div>
|
||
<div>租金：{{ goods.dayLeasePrice }}{{ ' ' + '元/天' }}</div>
|
||
<div>数量：{{ goods.num }}{{ ' ' + '台' }}</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="2">
|
||
<div style="font-size: 14px; font-weight: bold; margin-bottom: 10px">
|
||
总费用
|
||
</div>
|
||
<div class="red-font">{{ goods.costs }}</div>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<div style="font-size: 14px; font-weight: bold; margin-bottom: 10px">租期</div>
|
||
<div style="color: black; font-weight: bold">
|
||
{{ goods.rentBeginTime }}
|
||
</div>
|
||
<div style="margin-top: 3px; margin-bottom: 3px">{{ '至' }}</div>
|
||
<div style="color: black; font-weight: bold">{{ goods.rentEndTime }}</div>
|
||
</el-col>
|
||
<el-col :span="2">
|
||
<div
|
||
v-if="goods.orderStatus == '0'"
|
||
style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color: blue"
|
||
>
|
||
{{ '未下单' }}
|
||
</div>
|
||
<div
|
||
v-if="goods.orderStatus == '1'"
|
||
style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color: blue"
|
||
>
|
||
{{ '已下单' }}
|
||
</div>
|
||
<div
|
||
v-if="goods.orderStatus == '2'"
|
||
style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color: blue"
|
||
>
|
||
{{ '待出库' }}
|
||
</div>
|
||
<div
|
||
v-if="goods.orderStatus == '3'"
|
||
style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color: blue"
|
||
>
|
||
{{ '待收货' }}
|
||
</div>
|
||
<div
|
||
v-if="goods.orderStatus == '4'"
|
||
style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color: blue"
|
||
>
|
||
{{ '租赁中' }}
|
||
</div>
|
||
<div
|
||
v-if="goods.orderStatus == '5'"
|
||
style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color: blue"
|
||
>
|
||
{{ '已退租' }}
|
||
</div>
|
||
<div
|
||
v-if="goods.orderStatus == '6'"
|
||
style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color: blue"
|
||
>
|
||
{{ '已完成' }}
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="3">
|
||
<div>
|
||
<el-button
|
||
@click="handleViewOrder(j, item.detailsList[j])"
|
||
type="text"
|
||
size="mini"
|
||
style="color: #blue; font-weight: bold"
|
||
>
|
||
订单详情
|
||
</el-button>
|
||
<el-button
|
||
@click="handleViewOrder(j)"
|
||
type="text"
|
||
size="mini"
|
||
style="color: #blue; font-weight: bold"
|
||
>
|
||
租赁协议
|
||
</el-button>
|
||
<el-button
|
||
@click="handleViewBack(j)"
|
||
type="text"
|
||
size="mini"
|
||
style="color: #blue; font-weight: bold"
|
||
>
|
||
退租检修
|
||
</el-button>
|
||
<el-button
|
||
@click="handleViewMoney(j)"
|
||
type="text"
|
||
size="mini"
|
||
style="color: #blue; font-weight: bold"
|
||
>
|
||
费用结算
|
||
</el-button>
|
||
</div>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
<PagingComponent
|
||
@getList="getList"
|
||
:pageSize="pageSize"
|
||
:pageNumber="pageNumber"
|
||
:total="total"
|
||
/>
|
||
|
||
<!-- 退租检修弹框 -->
|
||
<el-dialog
|
||
v-model="dialogFormVisibleSettlein"
|
||
:title="settleinTitle"
|
||
width="60%"
|
||
align-center
|
||
:close-on-click-modal="false"
|
||
>
|
||
<div style="height: 80px">
|
||
<div
|
||
class="info"
|
||
style="margin-top: 5px; margin-bottom: 8px; display: flex; flex-wrap: wrap"
|
||
>
|
||
<div
|
||
class="item"
|
||
style="
|
||
width: 30%;
|
||
flex-shrink: 0;
|
||
margin-bottom: 5px;
|
||
font-size: 16px;
|
||
margin-left: 40px;
|
||
"
|
||
>
|
||
<span>订单编号：10000212135656</span>
|
||
</div>
|
||
|
||
<div
|
||
class="item"
|
||
style="width: 30%; flex-shrink: 0; margin-bottom: 5px; font-size: 16px"
|
||
>
|
||
<span>装备套数：2套</span>
|
||
</div>
|
||
|
||
<div
|
||
class="item"
|
||
style="width: 30%; flex-shrink: 0; margin-bottom: 5px; font-size: 16px"
|
||
>
|
||
<span>退租时间：2024-10-10 10:00:00</span>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="item"
|
||
style="
|
||
width: 30%;
|
||
flex-shrink: 0;
|
||
margin-bottom: 12px;
|
||
font-size: 16px;
|
||
margin-left: 80px;
|
||
"
|
||
>
|
||
<span>装备名称：挖掘机</span>
|
||
</div>
|
||
|
||
<div class="info" style="margin-top: 5px; display: flex; flex-wrap: wrap">
|
||
<div
|
||
class="item"
|
||
style="
|
||
width: 30%;
|
||
flex-shrink: 0;
|
||
margin-bottom: 5px;
|
||
font-size: 16px;
|
||
margin-left: 80px;
|
||
"
|
||
>
|
||
<span>装备编码：10000212135656</span>
|
||
</div>
|
||
<div
|
||
class="item"
|
||
style="width: 30%; flex-shrink: 0; margin-bottom: 5px; font-size: 16px"
|
||
>
|
||
<span>型号：ZJO9777466</span>
|
||
</div>
|
||
|
||
<div
|
||
class="item"
|
||
style="width: 30%; flex-shrink: 0; margin-bottom: 5px; font-size: 16px"
|
||
>
|
||
<span>数量：3</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="title">
|
||
<span class="title-sign"></span>
|
||
<span class="title-text">外观检测</span>
|
||
</div>
|
||
<el-form label-width="160" ref="ruleFormRef" :model="equipmentDeploymentParams">
|
||
<el-row>
|
||
<el-form-item label="是否合格：" prop="pass">
|
||
<el-select
|
||
v-model="equipmentDeploymentParams.pass"
|
||
placeholder="请选择是否合格"
|
||
clearable
|
||
style="width: 350px"
|
||
>
|
||
<el-option label="是" value="0"></el-option>
|
||
<el-option label="否" value="1"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="费用：" prop="fy">
|
||
<el-input
|
||
v-model="equipmentDeploymentParams.fy"
|
||
placeholder="请输入设备数量"
|
||
clearable
|
||
maxlength="20"
|
||
style="width: 350px"
|
||
/>
|
||
</el-form-item>
|
||
</el-row>
|
||
<el-row>
|
||
<el-form-item label="备注：" prop="remark1">
|
||
<el-input
|
||
placeholder="请输入"
|
||
autocomplete="off"
|
||
style="width: 860px"
|
||
maxlength="50"
|
||
v-model="equipmentDeploymentParams.remark1"
|
||
clearable
|
||
/>
|
||
</el-form-item>
|
||
</el-row>
|
||
</el-form>
|
||
<div class="uploadBox">
|
||
<div class="labelBox">
|
||
<div style="margin-left: 40px">
|
||
<span style="font-size: 14px">检验文件: </span>
|
||
</div>
|
||
<div style="margin-left: 20px">
|
||
<el-upload
|
||
ref="upload"
|
||
:limit="6"
|
||
:headers="upload.headers"
|
||
:action="upload.url"
|
||
:show-file-list="false"
|
||
accept=".png, .jpg, .jpeg"
|
||
:on-success="handleFileSuccess"
|
||
:auto-upload="true"
|
||
:before-upload="beforeUpload"
|
||
:on-error="uploadError"
|
||
>
|
||
<el-button icon="el-icon-folder-add">上传文件</el-button>
|
||
</el-upload>
|
||
</div>
|
||
<div style="color: #999; font-size: 12px; margin-left: 20px">
|
||
支持格式：.jpg .png，单个文件大小不能超过2M
|
||
</div>
|
||
</div>
|
||
<div class="imgsBox">
|
||
<div class="imgItem" v-for="(item, index) in mainFileList" :key="index">
|
||
<img class="picture-card" :src="item.fileUrl" alt="" />
|
||
<div class="icon-list">
|
||
<span class="imgItem__icon hide" @click="handleDownload(item)">
|
||
<i class="el-icon-download" />
|
||
</span>
|
||
<span class="imgItem__icon hide" @click="picturePreview(item)">
|
||
<i class="el-icon-zoom-in" />
|
||
</span>
|
||
<span
|
||
class="imgItem__icon hide"
|
||
@click="handleRemove(mainFileList, index)"
|
||
>
|
||
<i class="el-icon-delete" />
|
||
</span>
|
||
</div>
|
||
<p class="file-name">{{ item.fileName }}</p>
|
||
</div>
|
||
</div>
|
||
<div class="tipBox">*注:图片排序为平台展示顺序，不得少于1张，不得多于6张</div>
|
||
</div>
|
||
<div class="title">
|
||
<span class="title-sign"></span>
|
||
<span class="title-text">维修内容</span>
|
||
</div>
|
||
<el-form label-width="160" ref="ruleFormRef" :model="equipmentDeploymentParams">
|
||
<el-row>
|
||
<el-form-item label="是否合格：" prop="pass2">
|
||
<el-select
|
||
v-model="equipmentDeploymentParams.pass2"
|
||
placeholder="请选择是否合格"
|
||
clearable
|
||
style="width: 350px"
|
||
>
|
||
<el-option label="是" value="0"></el-option>
|
||
<el-option label="否" value="1"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="费用：" prop="fy2">
|
||
<el-input
|
||
v-model="equipmentDeploymentParams.fy2"
|
||
placeholder="请输入设备数量"
|
||
clearable
|
||
maxlength="20"
|
||
style="width: 350px"
|
||
/>
|
||
</el-form-item>
|
||
</el-row>
|
||
<el-row>
|
||
<el-form-item label="备注：" prop="remark2">
|
||
<el-input
|
||
placeholder="请输入"
|
||
autocomplete="off"
|
||
style="width: 860px"
|
||
maxlength="50"
|
||
v-model="equipmentDeploymentParams.remark2"
|
||
clearable
|
||
/>
|
||
</el-form-item>
|
||
</el-row>
|
||
</el-form>
|
||
<div class="uploadBox">
|
||
<div class="labelBox">
|
||
<div style="margin-left: 40px">
|
||
<span style="font-size: 14px">检验文件: </span>
|
||
</div>
|
||
<div style="margin-left: 20px">
|
||
<el-upload
|
||
ref="upload2"
|
||
:limit="6"
|
||
:headers="upload.headers"
|
||
:action="upload.url"
|
||
:show-file-list="false"
|
||
accept=".png, .jpg, .jpeg"
|
||
:on-success="handleFileSuccess2"
|
||
:auto-upload="true"
|
||
:before-upload="beforeUpload"
|
||
:on-error="uploadError"
|
||
>
|
||
<el-button icon="el-icon-folder-add">上传文件</el-button>
|
||
</el-upload>
|
||
</div>
|
||
<div style="color: #999; font-size: 12px; margin-left: 20px">
|
||
支持格式：.jpg .png，单个文件大小不能超过2M
|
||
</div>
|
||
</div>
|
||
<div class="imgsBox">
|
||
<div class="imgItem" v-for="(item, index) in detailsFileList" :key="index">
|
||
<img class="picture-card" :src="item.fileUrl" alt="" />
|
||
<div class="icon-list">
|
||
<span class="imgItem__icon hide" @click="handleDownload(item)">
|
||
<i class="el-icon-download" />
|
||
</span>
|
||
<span class="imgItem__icon hide" @click="picturePreview(item)">
|
||
<i class="el-icon-zoom-in" />
|
||
</span>
|
||
<span
|
||
class="imgItem__icon hide"
|
||
@click="handleRemove(detailsFileList, index)"
|
||
>
|
||
<i class="el-icon-delete" />
|
||
</span>
|
||
</div>
|
||
<p class="file-name">{{ item.fileName }}</p>
|
||
</div>
|
||
</div>
|
||
<div class="tipBox">*注:图片排序为平台展示顺序，不得少于1张，不得多于6张</div>
|
||
</div>
|
||
<template #footer>
|
||
<span class="dialog-footer">
|
||
<el-button type="primary" @click="closeDialogBtn">关 闭</el-button>
|
||
<el-button @click="submitBtn" type="success"> 保存 </el-button>
|
||
</span>
|
||
</template>
|
||
</el-dialog>
|
||
</div>
|
||
|
||
<!-- 费用结算弹框 -->
|
||
<el-dialog
|
||
v-model="dialogFormVisibleSettlemoney"
|
||
:title="settlemoneyTitle"
|
||
width="60%"
|
||
align-center
|
||
:close-on-click-modal="false"
|
||
>
|
||
<div style="height: 80px">
|
||
<div
|
||
class="info"
|
||
style="margin-top: 5px; margin-bottom: 8px; display: flex; flex-wrap: wrap"
|
||
>
|
||
<div
|
||
class="item"
|
||
style="
|
||
width: 30%;
|
||
flex-shrink: 0;
|
||
margin-bottom: 5px;
|
||
font-size: 16px;
|
||
margin-left: 40px;
|
||
"
|
||
>
|
||
<span>订单编号：10000212135656</span>
|
||
</div>
|
||
|
||
<div
|
||
class="item"
|
||
style="width: 30%; flex-shrink: 0; margin-bottom: 5px; font-size: 16px"
|
||
>
|
||
<span>装备套数：2套</span>
|
||
</div>
|
||
|
||
<div
|
||
class="item"
|
||
style="width: 30%; flex-shrink: 0; margin-bottom: 5px; font-size: 16px"
|
||
>
|
||
<span>退租时间：2024-10-10 10:00:00</span>
|
||
</div>
|
||
</div>
|
||
<div class="info" style="margin-top: 5px; display: flex; flex-wrap: wrap">
|
||
<div
|
||
class="item"
|
||
style="
|
||
width: 30%;
|
||
flex-shrink: 0;
|
||
margin-bottom: 5px;
|
||
font-size: 16px;
|
||
margin-left: 40px;
|
||
"
|
||
>
|
||
<span>结算单位：安徽送变电公司</span>
|
||
</div>
|
||
<div
|
||
class="item"
|
||
style="width: 30%; flex-shrink: 0; margin-bottom: 5px; font-size: 16px"
|
||
>
|
||
<span>租赁天数：30{{ '/天' }}</span>
|
||
</div>
|
||
|
||
<div
|
||
class="item"
|
||
style="width: 30%; flex-shrink: 0; margin-bottom: 5px; font-size: 16px"
|
||
>
|
||
<span>租赁费用(元)：1800</span>
|
||
</div>
|
||
</div>
|
||
<div class="title">
|
||
<span class="title-sign"></span>
|
||
<span class="title-text">退租检测信息</span>
|
||
</div>
|
||
</div>
|
||
<!-- 表格 -->
|
||
<el-table
|
||
:data="tableData"
|
||
class="table"
|
||
style="margin-left: 50px; width: 1100px"
|
||
row-key="id"
|
||
show-overflow-tooltip
|
||
:header-cell-style="{ background: 'white', color: 'black' }"
|
||
>
|
||
<el-table-column label="序号" align="center" width="80" type="index"></el-table-column>
|
||
<el-table-column align="center" prop="name1" label="机具名称" />
|
||
<el-table-column align="center" prop="name2" label="规格型号" />
|
||
<el-table-column align="center" prop="name3" label="装备编码" />
|
||
<el-table-column align="center" prop="typeName" label="检验内容">
|
||
<el-table-column label="外观检验" align="center" prop="jy1" />
|
||
<el-table-column label="故障检验" align="center" prop="jy2" />
|
||
</el-table-column>
|
||
<el-table-column align="center" prop="typeName" label="维修内容">
|
||
<el-table-column label="外观检验" align="center" prop="jy3" />
|
||
<el-table-column label="故障检验" align="center" prop="jy4" />
|
||
</el-table-column>
|
||
<el-table-column align="center" prop="typeName" label="金额">
|
||
<el-table-column label="外观检验" align="center" prop="jy5" />
|
||
<el-table-column label="故障检验" align="center" prop="jy6" />
|
||
</el-table-column>
|
||
<el-table-column align="center" prop="typeName" label="附件">
|
||
<el-table-column label="外观检验" align="center" prop="jy7" />
|
||
<el-table-column label="故障检验" align="center" prop="jy8" />
|
||
</el-table-column>
|
||
<el-table-column align="center" label="备注" prop="remark" width="80px">
|
||
</el-table-column>
|
||
</el-table>
|
||
<div class="title">
|
||
<span class="title-sign"></span>
|
||
<span class="title-text">费用结算</span>
|
||
</div>
|
||
<div>
|
||
<span style="color: #ff9900; margin-left: 100px">● </span>
|
||
<span class="title-text">维修费用</span>
|
||
</div>
|
||
<el-form label-width="240" ref="ruleFormRef2" :model="moneyParams1">
|
||
<div v-for="(item, index) in partItems1" :key="index" class="dynamic-item">
|
||
<div
|
||
style="
|
||
margin-top: 10px;
|
||
margin-left: 180px;
|
||
margin-bottom: 5px;
|
||
font-size: 18px;
|
||
"
|
||
>
|
||
设备：{{ index + 1 }}
|
||
</div>
|
||
<el-row>
|
||
<el-form-item label="关联装备" prop="partType">
|
||
<el-select
|
||
v-model="item.device"
|
||
placeholder="请选择"
|
||
clearable
|
||
style="width: 300px"
|
||
>
|
||
<el-option label="设备1" value="0"></el-option>
|
||
<el-option label="设备2" value="1"></el-option>
|
||
<el-option label="设备3" value="2"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="维修数量" prop="partNum">
|
||
<el-input
|
||
v-model="item.partNum"
|
||
placeholder="请输入"
|
||
maxlength="20"
|
||
style="width: 300px"
|
||
>
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-row>
|
||
<el-row>
|
||
<el-form-item label="维修费用" prop="partNum">
|
||
<el-input
|
||
v-model="item.partNum"
|
||
placeholder="请输入"
|
||
maxlength="20"
|
||
style="width: 300px"
|
||
>
|
||
</el-input>
|
||
</el-form-item>
|
||
<el-form-item label="维修类型" prop="isCharge">
|
||
<el-select
|
||
v-model="item.isCharge"
|
||
placeholder="请选择"
|
||
filterable
|
||
clearable
|
||
style="width: 300px"
|
||
>
|
||
<el-option label="维修类型1" value="0"></el-option>
|
||
<el-option label="维修类型2" value="1"></el-option>
|
||
<el-option label="维修类型3" value="2"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-row>
|
||
<el-row>
|
||
<div style="margin-left: 130px">
|
||
<el-button @click="addPartItem1" type="success"> 增加维修设备</el-button>
|
||
<el-button @click="removePartItem1(index)" v-if="index != 0" type="danger">
|
||
删除维修设备</el-button
|
||
>
|
||
</div>
|
||
</el-row>
|
||
</div>
|
||
</el-form>
|
||
|
||
<div style="margin-top: 10px">
|
||
<span style="color: #ff9900; margin-left: 100px">● </span>
|
||
<span class="title-text">报废费用</span>
|
||
</div>
|
||
<el-form label-width="240" ref="ruleFormRef3" :model="moneyParams2">
|
||
<div v-for="(item, index) in partItems2" :key="index" class="dynamic-item">
|
||
<div
|
||
style="
|
||
margin-top: 10px;
|
||
margin-left: 180px;
|
||
margin-bottom: 5px;
|
||
font-size: 18px;
|
||
"
|
||
>
|
||
设备：{{ index + 1 }}
|
||
</div>
|
||
<el-row>
|
||
<el-form-item label="关联装备" prop="partType">
|
||
<el-select
|
||
v-model="item.device"
|
||
placeholder="请选择"
|
||
clearable
|
||
style="width: 300px"
|
||
>
|
||
<el-option label="设备1" value="0"></el-option>
|
||
<el-option label="设备2" value="1"></el-option>
|
||
<el-option label="设备3" value="2"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="报废数量" prop="partNum">
|
||
<el-input
|
||
v-model="item.partNum"
|
||
placeholder="请输入"
|
||
maxlength="20"
|
||
style="width: 300px"
|
||
>
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-row>
|
||
<el-row>
|
||
<el-form-item label="报废费用" prop="partNum">
|
||
<el-input
|
||
v-model="item.partNum"
|
||
placeholder="请输入"
|
||
maxlength="20"
|
||
style="width: 300px"
|
||
>
|
||
</el-input>
|
||
</el-form-item>
|
||
<el-form-item label="报废原因" prop="isCharge">
|
||
<el-input
|
||
v-model="item.isCharg"
|
||
placeholder="请输入"
|
||
maxlength="20"
|
||
style="width: 300px"
|
||
>
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-row>
|
||
<el-row>
|
||
<div style="margin-left: 130px">
|
||
<el-button @click="addPartItem2" type="success"> 增加报废设备</el-button>
|
||
<el-button @click="removePartItem2(index)" v-if="index != 0" type="danger">
|
||
删除报废设备</el-button
|
||
>
|
||
</div>
|
||
</el-row>
|
||
</div>
|
||
</el-form>
|
||
|
||
<div style="margin-top: 10px">
|
||
<span style="color: #ff9900; margin-left: 100px">● </span>
|
||
<span class="title-text">丢失费用</span>
|
||
</div>
|
||
<el-form label-width="240" ref="ruleFormRef4" :model="moneyParams3">
|
||
<div v-for="(item, index) in partItems3" :key="index" class="dynamic-item">
|
||
<div
|
||
style="
|
||
margin-top: 10px;
|
||
margin-left: 180px;
|
||
margin-bottom: 5px;
|
||
font-size: 18px;
|
||
"
|
||
>
|
||
设备：{{ index + 1 }}
|
||
</div>
|
||
<el-row>
|
||
<el-form-item label="关联装备" prop="partType">
|
||
<el-select
|
||
v-model="item.device"
|
||
placeholder="请选择"
|
||
clearable
|
||
style="width: 300px"
|
||
>
|
||
<el-option label="设备1" value="0"></el-option>
|
||
<el-option label="设备2" value="1"></el-option>
|
||
<el-option label="设备3" value="2"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="丢失数量" prop="partNum">
|
||
<el-input
|
||
v-model="item.partNum"
|
||
placeholder="请输入"
|
||
maxlength="20"
|
||
style="width: 300px"
|
||
>
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-row>
|
||
<el-row>
|
||
<el-form-item label="丢失费用" prop="partNum">
|
||
<el-input
|
||
v-model="item.partNum"
|
||
placeholder="请输入"
|
||
maxlength="20"
|
||
style="width: 300px"
|
||
>
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-row>
|
||
<el-row>
|
||
<div style="margin-left: 130px">
|
||
<el-button @click="addPartItem3" type="success"> 增加丢失设备</el-button>
|
||
<el-button @click="removePartItem3(index)" v-if="index != 0" type="danger">
|
||
删除丢失设备</el-button
|
||
>
|
||
</div>
|
||
</el-row>
|
||
</div>
|
||
</el-form>
|
||
<template #footer>
|
||
<span class="dialog-footer">
|
||
<el-button type="primary" @click="closeDialogBtn">关 闭</el-button>
|
||
<el-button @click="submitBtn" type="success"> 保存 </el-button>
|
||
</span>
|
||
</template>
|
||
</el-dialog>
|
||
</template>
|
||
|
||
<style lang="scss" scoped>
|
||
.logo {
|
||
padding: 15px 0;
|
||
display: flex;
|
||
margin-left: 80px;
|
||
}
|
||
.title {
|
||
margin: 10px;
|
||
margin-left: 20px;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
.title-sign {
|
||
display: inline-block;
|
||
width: 4px;
|
||
height: 16px;
|
||
background: #409eff;
|
||
margin-left: 45px;
|
||
}
|
||
.title-text {
|
||
font-weight: 700;
|
||
margin-left: 10px;
|
||
}
|
||
.uploadBox {
|
||
margin: 20px 40px;
|
||
}
|
||
.labelBox {
|
||
width: auto;
|
||
height: auto;
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 20px;
|
||
}
|
||
.imgsBox {
|
||
width: auto;
|
||
height: auto;
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 30px;
|
||
margin-left: 20px;
|
||
|
||
.imgItem {
|
||
width: 160px;
|
||
height: 160px;
|
||
margin-right: 40px;
|
||
border: 1px dashed #bbb;
|
||
position: relative;
|
||
.picture-card {
|
||
width: 160px;
|
||
height: 160px;
|
||
}
|
||
.icon-list {
|
||
width: 60px;
|
||
height: 20px;
|
||
position: absolute;
|
||
top: 70px;
|
||
left: 40px;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
.imgItem__icon {
|
||
margin: 0 5px;
|
||
}
|
||
.file-name {
|
||
font-size: 10px;
|
||
}
|
||
}
|
||
|
||
.hide {
|
||
display: none;
|
||
}
|
||
.imgItem:hover .hide {
|
||
display: block;
|
||
}
|
||
}
|
||
.tipBox {
|
||
color: red;
|
||
font-size: 12px;
|
||
margin-left: 20px;
|
||
}
|
||
.container {
|
||
// width: 800px;
|
||
// margin: 0 auto;
|
||
// padding: 10px;
|
||
background: #eeeff6;
|
||
font-size: 14px;
|
||
|
||
.cart-title {
|
||
margin-top: 10px;
|
||
padding: 10px 0;
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 14px;
|
||
font-weight: bold;
|
||
letter-spacing: 1px;
|
||
}
|
||
|
||
.cart-title div:first-child {
|
||
width: 5px;
|
||
height: 20px;
|
||
background-color: #4fabfe;
|
||
}
|
||
|
||
.cart-th {
|
||
margin: 15px 0;
|
||
div {
|
||
text-align: center;
|
||
}
|
||
}
|
||
|
||
.cart-tbody {
|
||
background: #fff;
|
||
padding: 8px 12px;
|
||
margin: 10px;
|
||
|
||
.cart-user-info {
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 13px;
|
||
|
||
.code,
|
||
.orderTime {
|
||
padding: 3px 18px;
|
||
border: 1px solid #ccc;
|
||
}
|
||
|
||
.czcompanyName {
|
||
margin-left: 20px;
|
||
border-right: none;
|
||
}
|
||
}
|
||
|
||
.cart-list {
|
||
margin: 15px 0;
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 13px;
|
||
div {
|
||
text-align: center;
|
||
}
|
||
|
||
.goods-info {
|
||
display: flex;
|
||
align-content: center;
|
||
|
||
img {
|
||
width: 140px;
|
||
height: 80px;
|
||
}
|
||
|
||
.goods-code {
|
||
margin-left: 70px;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-around;
|
||
|
||
div {
|
||
text-align: left;
|
||
}
|
||
}
|
||
}
|
||
|
||
.lease-date {
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
font-size: 12px;
|
||
}
|
||
|
||
.red-font {
|
||
color: #ff4800;
|
||
font-weight: bold;
|
||
}
|
||
}
|
||
}
|
||
|
||
.protocol-handle {
|
||
background: #fff;
|
||
padding: 8px 12px;
|
||
margin: 10px;
|
||
font-size: 13px;
|
||
|
||
.checkbox-container a {
|
||
color: #ff4800;
|
||
text-decoration: underline;
|
||
}
|
||
}
|
||
}
|
||
|
||
:deep .el-form--inline .el-form-item {
|
||
margin-right: 6px;
|
||
width: 95%;
|
||
}
|
||
</style>
|