装备新增逻辑完善
This commit is contained in:
BianLzhaoMin
parent
421445f924
commit
141a763be1
|
|
@ -7,8 +7,8 @@ VITE_API_URL = '/proxyApi'
|
|||
# 开发环境接口地址
|
||||
# VITE_proxyTarget = 'http://10.40.92.74:8080' #盛旭
|
||||
|
||||
VITE_proxyTarget = 'http://192.168.2.246:28080' # 马帅
|
||||
# VITE_proxyTarget = 'http://192.168.2.123:28080' # 梁超
|
||||
# VITE_proxyTarget = 'http://192.168.2.246:28080' # 马帅
|
||||
VITE_proxyTarget = 'http://192.168.2.127:28080' # 梁超
|
||||
# VITE_proxyTarget = 'http://192.168.0.244:28580' # 测试服务
|
||||
# VITE_proxyTarget = 'http://192.168.2.129:18080' # 马帅
|
||||
|
||||
|
|
|
|||
|
|
@ -24,6 +24,7 @@ const navMenuList = computed(() => {
|
|||
{ name: '租赁需求大厅', routerName: 'parity' },
|
||||
{ name: '装备管理', routerName: 'goodsManagement' },
|
||||
{ name: '订单管理', routerName: 'orderManagementCz' },
|
||||
{ name: '接单管理', routerName: 'accept-orders' },
|
||||
{ name: '消息通知', routerName: 'enterpriseZone' },
|
||||
]
|
||||
if (isType == 2)
|
||||
|
|
@ -32,12 +33,20 @@ const navMenuList = computed(() => {
|
|||
{ name: '装备共享大厅', routerName: 'equipList' },
|
||||
{ name: '租赁需求大厅', routerName: 'parity' },
|
||||
{ name: '订单管理', routerName: 'orderManagement' },
|
||||
{ name: '需求管理', routerName: 'sourcingNeed' },
|
||||
{ name: '消息通知', routerName: 'enterpriseZone' },
|
||||
]
|
||||
})
|
||||
|
||||
const navMenuClick = (name: any) => {
|
||||
if (name == 'goodsManagement' || name == 'orderManagementCz' || name == 'orderManagement') {
|
||||
const includeList = [
|
||||
'goodsManagement',
|
||||
'orderManagementCz',
|
||||
'orderManagement',
|
||||
'sourcingNeed',
|
||||
'accept-orders',
|
||||
]
|
||||
if (includeList.includes(name)) {
|
||||
store.editcurrentMenuItem(name)
|
||||
setTimeout(() => {
|
||||
router.push({
|
||||
|
|
|
|||
|
|
@ -36,6 +36,7 @@ const handlerLogout = () => {
|
|||
ElMessage({
|
||||
type: 'success',
|
||||
message: '已退出登录',
|
||||
duration: 1000,
|
||||
})
|
||||
})
|
||||
.catch(() => {
|
||||
|
|
@ -150,7 +151,7 @@ const isMyInfoPage = () => {
|
|||
/> -->
|
||||
|
||||
<el-image
|
||||
style="width: 190px; cursor: pointer; margin-right: 55%"
|
||||
style="width: 190px; cursor: pointer; margin-right: 50%"
|
||||
v-if="isMyInfoPage()"
|
||||
:src="headerLogo"
|
||||
fit="cover"
|
||||
|
|
|
|||
|
|
@ -19,7 +19,8 @@
|
|||
:on-remove="(file:any, fileList:any) => removeFile(file, fileList)"
|
||||
:on-preview="(file:any) => preview(file)"
|
||||
:on-progress="(event:any, file:any, fileList:any) => onProgressFn(event, file, fileList)"
|
||||
:list-type="props.listType">
|
||||
:list-type="props.listType"
|
||||
>
|
||||
<!-- 上传的按钮 或者 icon 通过具名插槽的方式 -->
|
||||
<div>
|
||||
<slot name="default"></slot>
|
||||
|
|
@ -31,250 +32,222 @@
|
|||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, nextTick } from 'vue'
|
||||
import { ElMessage } from 'element-plus'
|
||||
// import { Base64 } from 'js-base64'
|
||||
const tmpUploadUrl = import.meta.env.VITE_API_URL + '/zlpt-file/file/cos/upload'
|
||||
console.log(tmpUploadUrl)
|
||||
import { mainStore } from 'store/main'
|
||||
const store = mainStore()
|
||||
const headerInfo = reactive({
|
||||
Authorization: store.token
|
||||
})
|
||||
import { ref, nextTick } from 'vue'
|
||||
import { ElMessage } from 'element-plus'
|
||||
// import { Base64 } from 'js-base64'
|
||||
const tmpUploadUrl = import.meta.env.VITE_API_URL + '/zlpt-file/file/cos/upload'
|
||||
console.log(tmpUploadUrl)
|
||||
import { mainStore } from 'store/main'
|
||||
const store = mainStore()
|
||||
const headerInfo = reactive({
|
||||
Authorization: store.token,
|
||||
})
|
||||
|
||||
console.log('tmpUploadUrl', tmpUploadUrl)
|
||||
const actionUrl = ref(tmpUploadUrl)
|
||||
const props = defineProps({
|
||||
// actionUrl: {
|
||||
// //上传的地址
|
||||
// type: String,
|
||||
// default: ""
|
||||
// },
|
||||
width: {
|
||||
//上传的地址
|
||||
type: String,
|
||||
default: '72px'
|
||||
console.log('tmpUploadUrl', tmpUploadUrl)
|
||||
const actionUrl = ref(tmpUploadUrl)
|
||||
const props = defineProps({
|
||||
// actionUrl: {
|
||||
// //上传的地址
|
||||
// type: String,
|
||||
// default: ""
|
||||
// },
|
||||
width: {
|
||||
//上传的地址
|
||||
type: String,
|
||||
default: '72px',
|
||||
},
|
||||
height: {
|
||||
//上传的地址
|
||||
type: String,
|
||||
default: '72px',
|
||||
},
|
||||
autoUpload: {
|
||||
//是否开启自动上传
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
acceptTypeList: {
|
||||
//接受的文件类型
|
||||
type: Array,
|
||||
default: () => {
|
||||
return ['.jpg', '.jpeg', '.png']
|
||||
// ['doc', 'docx', 'xlsx', 'xls', 'txt', 'pdf','jpg','jpeg','png','zip,'rar']
|
||||
},
|
||||
height: {
|
||||
//上传的地址
|
||||
type: String,
|
||||
default: '72px'
|
||||
},
|
||||
multiple: {
|
||||
//是否开启多图上传
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
maxLimit: {
|
||||
// 最大上传个数限制
|
||||
type: Number || String,
|
||||
default: 1,
|
||||
},
|
||||
maxSize: {
|
||||
// 文件上传的最大体积 M
|
||||
type: Number || String,
|
||||
default: 4,
|
||||
},
|
||||
disabledFlag: {
|
||||
//是否禁用
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
fileList: {
|
||||
//文件列表
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
},
|
||||
autoUpload: {
|
||||
//是否开启自动上传
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
acceptTypeList: {
|
||||
//接受的文件类型
|
||||
type: Array,
|
||||
default: () => {
|
||||
return ['.jpg', '.jpeg', '.png']
|
||||
// ['doc', 'docx', 'xlsx', 'xls', 'txt', 'pdf','jpg','jpeg','png','zip,'rar']
|
||||
}
|
||||
},
|
||||
multiple: {
|
||||
//是否开启多图上传
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
maxLimit: {
|
||||
// 最大上传个数限制
|
||||
type: Number || String,
|
||||
default: 1
|
||||
},
|
||||
maxSize: {
|
||||
// 文件上传的最大体积 M
|
||||
type: Number || String,
|
||||
default: 4
|
||||
},
|
||||
disabledFlag: {
|
||||
//是否禁用
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
fileList: {
|
||||
//文件列表
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
}
|
||||
},
|
||||
listType: {
|
||||
type: String, //'text' | 'picture' | 'picture-card'
|
||||
default: 'picture'
|
||||
},
|
||||
extraData: {}, //上传时的额外参数 如 name等
|
||||
},
|
||||
listType: {
|
||||
type: String, //'text' | 'picture' | 'picture-card'
|
||||
default: 'picture',
|
||||
},
|
||||
extraData: {}, //上传时的额外参数 如 name等
|
||||
|
||||
/*
|
||||
/*
|
||||
{
|
||||
name:'12321'
|
||||
}
|
||||
*/
|
||||
dragFlag: {
|
||||
type: Boolean,
|
||||
default: true //是否启用拖拽上传 此处默认启用 element 官方默认是 不启用的
|
||||
dragFlag: {
|
||||
type: Boolean,
|
||||
default: true, //是否启用拖拽上传 此处默认启用 element 官方默认是 不启用的
|
||||
},
|
||||
downLoadTypeList: {
|
||||
//需要下载的文件类型
|
||||
type: Array,
|
||||
default: () => {
|
||||
return ['doc', 'docx', 'xlsx', 'xls', 'txt']
|
||||
},
|
||||
downLoadTypeList: {
|
||||
//需要下载的文件类型
|
||||
type: Array,
|
||||
default: () => {
|
||||
return ['doc', 'docx', 'xlsx', 'xls', 'txt']
|
||||
}
|
||||
},
|
||||
preveiwTypeList: {
|
||||
//需要预览的文件类型
|
||||
type: Array,
|
||||
default: () => {
|
||||
return ['pdf', 'jpg', 'jpeg', 'png']
|
||||
},
|
||||
preveiwTypeList: {
|
||||
//需要预览的文件类型
|
||||
type: Array,
|
||||
default: () => {
|
||||
return ['pdf', 'jpg', 'jpeg', 'png']
|
||||
}
|
||||
},
|
||||
officePreviewFlag: {
|
||||
//是否启用office在线预览
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
showProcessFlag: {
|
||||
//是否显示进度条
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
scuccesCallback: {
|
||||
type: Function,
|
||||
default: () => {}
|
||||
},
|
||||
successResultCallBack: {
|
||||
type: Function,
|
||||
default: () => {}
|
||||
}
|
||||
},
|
||||
officePreviewFlag: {
|
||||
//是否启用office在线预览
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
showProcessFlag: {
|
||||
//是否显示进度条
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
scuccesCallback: {
|
||||
type: Function,
|
||||
default: () => {},
|
||||
},
|
||||
successResultCallBack: {
|
||||
type: Function,
|
||||
default: () => {},
|
||||
},
|
||||
})
|
||||
// office预览
|
||||
// https://view.officeapps.live.com/op/view.aspx?src=
|
||||
// https://view.officeapps.live.com/op/view.aspx?src=文档地址
|
||||
//
|
||||
|
||||
const officeOnlineAddress = 'https://view.officeapps.live.com/op/view.aspx?src='
|
||||
const officeType = ['doc', 'docx', 'xlsx', 'xls']
|
||||
let processFlag = ref(false) //是否显示进度条
|
||||
let loadProcess = ref(0) //进度条的刻度值
|
||||
|
||||
// 上传图片 成功
|
||||
const successUpload = (response: any, file: any) => {
|
||||
console.log('successUpload', response, file)
|
||||
if (response.code === 200) {
|
||||
props.fileList.push({
|
||||
url: response.data,
|
||||
name: file.name,
|
||||
})
|
||||
props.successResultCallBack(response)
|
||||
} else {
|
||||
ElMessage({
|
||||
type: 'warning',
|
||||
duration: 1000,
|
||||
message: response.data,
|
||||
})
|
||||
}
|
||||
}
|
||||
const errorUpload = (res: any) => {
|
||||
ElMessage({
|
||||
type: 'warning',
|
||||
duration: 1000,
|
||||
message: '上传失败请重试！',
|
||||
})
|
||||
// office预览
|
||||
// https://view.officeapps.live.com/op/view.aspx?src=
|
||||
// https://view.officeapps.live.com/op/view.aspx?src=文档地址
|
||||
//
|
||||
|
||||
const officeOnlineAddress = 'https://view.officeapps.live.com/op/view.aspx?src='
|
||||
const officeType = ['doc', 'docx', 'xlsx', 'xls']
|
||||
let processFlag = ref(false) //是否显示进度条
|
||||
let loadProcess = ref(0) //进度条的刻度值
|
||||
|
||||
// 上传图片 成功
|
||||
const successUpload = (response: any, file: any) => {
|
||||
console.log('successUpload', response, file)
|
||||
if (response.code === 200) {
|
||||
props.fileList.push({
|
||||
url: response.data,
|
||||
name: file.name
|
||||
})
|
||||
props.successResultCallBack(response)
|
||||
} else {
|
||||
ElMessage({
|
||||
type: 'warning',
|
||||
message: response.data
|
||||
})
|
||||
}
|
||||
}
|
||||
const errorUpload = (res: any) => {
|
||||
}
|
||||
const beforeUpload = (file: any) => {
|
||||
console.log('file', file)
|
||||
const { name = '', size } = file
|
||||
if (size > props.maxSize * 1024 * 1000) {
|
||||
ElMessage({
|
||||
type: 'warning',
|
||||
message: '上传失败请重试！'
|
||||
message: `文件最大仅支持${props.maxSize}M`,
|
||||
})
|
||||
return false
|
||||
}
|
||||
const beforeUpload = (file: any) => {
|
||||
console.log('file', file)
|
||||
const { name = '', size } = file
|
||||
if (size > props.maxSize * 1024 * 1000) {
|
||||
ElMessage({
|
||||
type: 'warning',
|
||||
message: `文件最大仅支持${props.maxSize}M`
|
||||
})
|
||||
return false
|
||||
}
|
||||
let names = name.split('.')
|
||||
let currentName = names[names.length - 1]
|
||||
console.log('acceptTypeListacceptTypeList', props.acceptTypeList, currentName)
|
||||
console.log('name.split().pop()')
|
||||
if (!props.acceptTypeList.includes('.' + currentName)) {
|
||||
ElMessage({
|
||||
type: 'warning',
|
||||
message: `文件格式仅支持${props.acceptTypeList.join(',')}`
|
||||
})
|
||||
return false
|
||||
}
|
||||
}
|
||||
const handleExceed = (files: any, fileList: any) => {
|
||||
let names = name.split('.')
|
||||
let currentName = names[names.length - 1]
|
||||
console.log('acceptTypeListacceptTypeList', props.acceptTypeList, currentName)
|
||||
console.log('name.split().pop()')
|
||||
if (!props.acceptTypeList.includes('.' + currentName)) {
|
||||
ElMessage({
|
||||
type: 'warning',
|
||||
message: `当前限制选择 10 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
|
||||
files.length + fileList.length
|
||||
} 个文件`
|
||||
message: `文件格式仅支持${props.acceptTypeList.join(',')}`,
|
||||
})
|
||||
return false
|
||||
}
|
||||
}
|
||||
const handleExceed = (files: any, fileList: any) => {
|
||||
ElMessage({
|
||||
type: 'warning',
|
||||
message: `当前限制选择 10 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
|
||||
files.length + fileList.length
|
||||
} 个文件`,
|
||||
})
|
||||
}
|
||||
// 移除文件
|
||||
const removeFile = (file: any, data: any) => {
|
||||
console.log(file, data)
|
||||
// props.fileList = data
|
||||
}
|
||||
// 预览
|
||||
const preview = (data: any) => {
|
||||
console.log(data, '****预览文件')
|
||||
window.open(data.response.msg)
|
||||
return
|
||||
}
|
||||
|
||||
const onProgressFn = (event: any, file: any, fileList: any) => {
|
||||
processFlag.value = true
|
||||
loadProcess.value = event.percent.toFixed(2)
|
||||
if (loadProcess.value >= 100) {
|
||||
loadProcess.value = 100
|
||||
nextTick(() => {
|
||||
processFlag.value = false
|
||||
})
|
||||
}
|
||||
// 移除文件
|
||||
const removeFile = (file: any, data: any) => {
|
||||
console.log(file, data)
|
||||
// props.fileList = data
|
||||
}
|
||||
// 预览
|
||||
const preview = (data: any) => {
|
||||
console.log(data, '****预览文件')
|
||||
window.open(data.response.msg)
|
||||
return
|
||||
|
||||
const { url, response = {} } = data || {}
|
||||
let name = data.name
|
||||
const downLoadTypeList = props.downLoadTypeList
|
||||
const preveiwTypeList = props.preveiwTypeList
|
||||
if (!name) {
|
||||
name = ''
|
||||
}
|
||||
const suffixFileType = name.split('.').pop()
|
||||
if (downLoadTypeList.includes(suffixFileType)) {
|
||||
//预览 'doc', 'docx', 'xlsx', 'xls', 'txt' 文件
|
||||
name = name.replace(/&/g, '') // & 不兼容
|
||||
const target = encodeURIComponent()
|
||||
// Base64.encode(
|
||||
// `${location.origin}/api/abk/web/v1/resource/file?fileId=${
|
||||
// url || response.data
|
||||
// }&fullfilename=${name}&sid=4AC67ADB4E264AB0A8B899A671072875`
|
||||
// )
|
||||
if (props.officePreviewFlag && officeType.includes(suffixFileType)) {
|
||||
// office预览的
|
||||
const preveiewURL = officeOnlineAddress + target
|
||||
window.open(preveiewURL)
|
||||
} else {
|
||||
// 非office预览
|
||||
window.open(`https://test/preview/onlinePreview?url=${target}`, '_blank')
|
||||
}
|
||||
} else if (preveiwTypeList.includes(suffixFileType)) {
|
||||
//新窗口打开 预览图片文件
|
||||
window.open('/api/abk/web/v1/resource/file?fileId=' + (url || response.data), '_blank')
|
||||
}
|
||||
}
|
||||
|
||||
const onProgressFn = (event: any, file: any, fileList: any) => {
|
||||
processFlag.value = true
|
||||
loadProcess.value = event.percent.toFixed(2)
|
||||
if (loadProcess.value >= 100) {
|
||||
loadProcess.value = 100
|
||||
nextTick(() => {
|
||||
processFlag.value = false
|
||||
})
|
||||
}
|
||||
}
|
||||
const changeFileFn = (ev: any) => {
|
||||
props.scuccesCallback(ev)
|
||||
}
|
||||
}
|
||||
const changeFileFn = (ev: any) => {
|
||||
props.scuccesCallback(ev)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
:deep(.el-upload) {
|
||||
width: v-bind('props.width') !important;
|
||||
height: v-bind('props.height') !important;
|
||||
}
|
||||
:deep(.el-upload-list__item) {
|
||||
width: v-bind('props.width') !important;
|
||||
height: v-bind('props.height') !important;
|
||||
}
|
||||
:deep(.el-upload) {
|
||||
width: v-bind('props.width') !important;
|
||||
height: v-bind('props.height') !important;
|
||||
}
|
||||
:deep(.el-upload-list__item) {
|
||||
width: v-bind('props.width') !important;
|
||||
height: v-bind('props.height') !important;
|
||||
}
|
||||
</style>
|
||||
<style></style>
|
||||
|
|
|
|||
|
|
@ -219,7 +219,7 @@ const beforeUpload = (file: any) => {
|
|||
return false
|
||||
}
|
||||
|
||||
if (fileListNew.value.length + props.minLimit >= 4) {
|
||||
if (fileListNew.value.length + props.minLimit >= props.maxLimit) {
|
||||
ElMessage({
|
||||
type: 'warning',
|
||||
message: `最多只能上传${props.maxLimit}个文件`,
|
||||
|
|
|
|||
|
|
@ -31,7 +31,6 @@ service.interceptors.request.use(
|
|||
)
|
||||
// 响应拦截
|
||||
service.interceptors.response.use(
|
||||
|
||||
(res) => {
|
||||
ElMessage.closeAll()
|
||||
const { data } = res
|
||||
|
|
@ -44,16 +43,19 @@ service.interceptors.response.use(
|
|||
ElMessage.error(data.msg)
|
||||
router.push('/login')
|
||||
} else if (data.code == '500') {
|
||||
ElMessage.error(data.msg)
|
||||
ElMessage({
|
||||
type: 'error',
|
||||
message: data.msg,
|
||||
duration: 1000,
|
||||
})
|
||||
}
|
||||
else {
|
||||
return data
|
||||
}
|
||||
},
|
||||
(error) => {
|
||||
ElMessage.closeAll()
|
||||
ElMessage.error('请求失败')
|
||||
console.log('error-异常', error)
|
||||
// ElMessage.error('请求失败')
|
||||
// console.log('error-异常', error)
|
||||
}
|
||||
)
|
||||
|
||||
|
|
|
|||
|
|
@ -51,21 +51,21 @@
|
|||
</el-col>
|
||||
</el-row> -->
|
||||
|
||||
<div class="label" style="padding: 10px 0; font-size: 16px">需求清单：</div>
|
||||
<!-- <div class="label" style="padding: 10px 0; font-size: 16px">需求清单：</div>
|
||||
<el-row>
|
||||
<el-col
|
||||
:span="12"
|
||||
v-for="item in leaseDetails.fileInfoList"
|
||||
:key="item.id"
|
||||
>
|
||||
<!-- <img :src="img.fileUrl" alt="" style="width: 98%; height: 120px" /> -->
|
||||
|
||||
<el-image
|
||||
style="width: 98%; height: 240px"
|
||||
:src="item.fileUrl"
|
||||
fit="cover"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-row> -->
|
||||
</div>
|
||||
|
||||
<el-row style="padding: 8px 0; font-size: 16px"> 装备需求信息: </el-row>
|
||||
|
|
@ -89,6 +89,14 @@
|
|||
<span>{{ item.leaseNum }}</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="padding: 10px 0">
|
||||
<el-col :span="4">
|
||||
<span class="label">装备描述：</span>
|
||||
</el-col>
|
||||
<el-col :span="20">
|
||||
<span>{{ item.description }}</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="label" style="padding: 10px 0">参考图片/样式：</div>
|
||||
<el-row>
|
||||
<el-col :span="12" v-for="img in item.fileInfoList" :key="img.id">
|
||||
|
|
@ -200,9 +208,17 @@ const equipBaseInfoList = reactive([
|
|||
// label: '预估数量',
|
||||
// key: 'leaseNum',
|
||||
// },
|
||||
// {
|
||||
// label: '预估租赁天数',
|
||||
// key: 'leaseDay',
|
||||
// },
|
||||
{
|
||||
label: '预估租赁天数',
|
||||
key: 'leaseDay',
|
||||
label: '租赁开始日期',
|
||||
key: 'leaseStartTime',
|
||||
},
|
||||
{
|
||||
label: '租赁结束日期',
|
||||
key: 'leaseEndTime',
|
||||
},
|
||||
{
|
||||
label: '发布时间',
|
||||
|
|
|
|||
|
|
@ -22,10 +22,10 @@ const selectOptions = ref<boolean>(false) // 分类
|
|||
const selectOptionsValue = ref<string>('分类筛选')
|
||||
|
||||
const loopList = ref([
|
||||
'https://zlpt-1259760603.cos.ap-nanjing.myqcloud.com/488bab245180ebf9f1f3d7db5301be4.png',
|
||||
// 'https://zlpt-1259760603.cos.ap-nanjing.myqcloud.com/488bab245180ebf9f1f3d7db5301be4.png',
|
||||
// 'https://jmy-pic.baidu.com/0/pic/-1857035387_-1067811148_-1621691324.png',
|
||||
imgSrc,
|
||||
swiper_1,
|
||||
// swiper_1,
|
||||
swiper_2,
|
||||
])
|
||||
// 获取商品分类
|
||||
|
|
|
|||
|
|
@ -106,6 +106,12 @@
|
|||
<el-col :span="5">
|
||||
<div>{{ item.companyName }}</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div>预估数量</div>
|
||||
</el-col>
|
||||
<el-col :span="5">
|
||||
<div>{{ item.leaseTotalNum }}</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="2">
|
||||
|
|
@ -123,16 +129,16 @@
|
|||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="2">
|
||||
<div>预估数量</div>
|
||||
<div>租赁开始日期</div>
|
||||
</el-col>
|
||||
<el-col :span="5">
|
||||
<div>{{ item.leaseTotalNum }}</div>
|
||||
<div>{{ item.leaseStartTime }}</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div>预估租期(天)</div>
|
||||
<div>租赁结束日期</div>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<div>{{ item.leaseDay }}</div>
|
||||
<div>{{ item.leaseEndTime }}</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,665 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import { getOrderListInfoApi } from 'http/api/usercenter/seekorder'
|
||||
|
||||
import TitleTip from 'components/TitleTip/index.vue'
|
||||
const route = useRoute()
|
||||
/* 查询参数 */
|
||||
const cardList = ref<any>({})
|
||||
const orderStatusTemp = ref<number>(0)
|
||||
const idTemp = ref<string>('')
|
||||
const titleStaus = ref<any>('')
|
||||
//描述信息
|
||||
const operationDetails = ref<any>({
|
||||
1: { title: '已出库', preOutboundUser: '', preOutboundTime: '' },
|
||||
2: { title: '已收货', takeOverUser: '', takeOverTime: '' },
|
||||
3: { title: '租赁结束', rentOverUser: '', rentOverTime: '' },
|
||||
})
|
||||
// 根据步骤的 Id 返回对应的标题
|
||||
const getStepTitle = (stepId: number) => {
|
||||
if (orderStatusTemp.value === 2) {
|
||||
titleStaus.value = '待出库'
|
||||
return stepId === 1 ? '待出库' : ''
|
||||
} else if (orderStatusTemp.value === 3) {
|
||||
titleStaus.value = '待收货'
|
||||
return stepId === 1 ? '已出库' : stepId === 2 ? '待收货' : ''
|
||||
} else if (orderStatusTemp.value === 4) {
|
||||
titleStaus.value = '租赁中'
|
||||
return stepId === 1 ? '已出库' : stepId === 2 ? '已收货' : stepId === 3 ? '租赁中' : ''
|
||||
} else if (orderStatusTemp.value === 5) {
|
||||
titleStaus.value = '已退租'
|
||||
return stepId === 1
|
||||
? '已出库'
|
||||
: stepId === 2
|
||||
? '已收货'
|
||||
: stepId === 3
|
||||
? '租赁结束'
|
||||
: stepId === 4
|
||||
? '已退租'
|
||||
: ''
|
||||
} else if (orderStatusTemp.value === 6) {
|
||||
titleStaus.value = '已完成'
|
||||
return stepId === 1
|
||||
? '已出库'
|
||||
: stepId === 2
|
||||
? '已收货'
|
||||
: stepId === 3
|
||||
? '租赁结束'
|
||||
: stepId === 4
|
||||
? '已退租'
|
||||
: stepId === 5
|
||||
? '已完成'
|
||||
: ''
|
||||
} else if (orderStatusTemp.value === 7) {
|
||||
titleStaus.value = '已驳回'
|
||||
return stepId === 1 ? '已驳回' : ''
|
||||
}
|
||||
titleStaus.value = ''
|
||||
return '' // 默认返回空字符串
|
||||
}
|
||||
|
||||
// 根据步骤的 Id 返回对应的描述
|
||||
const getDescription = (desId: number) => {
|
||||
const operation = operationDetails.value[desId]
|
||||
if (operation.title == '已出库' && titleStaus.value != '待出库') {
|
||||
return `
|
||||
操作人：${operation.preOutboundUser == null ? ' ' : operation.preOutboundUser}
|
||||
操作时间：${operation.preOutboundTime == null ? ' ' : operation.preOutboundTime}
|
||||
`
|
||||
} else if (
|
||||
operation.title == '已收货' &&
|
||||
titleStaus.value != '待收货' &&
|
||||
titleStaus.value != '待出库'
|
||||
) {
|
||||
return `
|
||||
操作人：${operation.takeOverUser == null ? ' ' : operation.takeOverUser}
|
||||
操作时间：${operation.takeOverTime == null ? ' ' : operation.takeOverTime}
|
||||
`
|
||||
} else if (
|
||||
operation.title == '租赁结束' &&
|
||||
titleStaus.value != '待收货' &&
|
||||
titleStaus.value != '待出库' &&
|
||||
titleStaus.value != '租赁中'
|
||||
) {
|
||||
return `
|
||||
操作人：${operation.rentOverUser == null ? ' ' : operation.rentOverUser}
|
||||
操作时间：${operation.rentOverTime == null ? ' ' : operation.rentOverTime}
|
||||
`
|
||||
}
|
||||
return '' // 默认返回空描述
|
||||
}
|
||||
|
||||
// 计算是否过期
|
||||
const isExpired = (goods: any) => {
|
||||
// 获取当前日期并去掉时间部分
|
||||
const today = new Date()
|
||||
today.setHours(0, 0, 0, 0)
|
||||
|
||||
// 将endtime转为Date对象
|
||||
const endTime = new Date(goods.endTime.replace(/-/g, '/'))
|
||||
|
||||
// 判断endtime是否早于今天
|
||||
return endTime < today
|
||||
}
|
||||
|
||||
const getId = () => {
|
||||
orderStatusTemp.value = Number(route.query.orderStatusTemp)
|
||||
idTemp.value = String(route.query.idTemp)
|
||||
}
|
||||
const orderDetails = ref<any>({})
|
||||
/** 查询列表 */
|
||||
const getList = async () => {
|
||||
let params = {
|
||||
orderId: idTemp.value,
|
||||
}
|
||||
|
||||
console.log(props.orderId, 'props.orderId')
|
||||
|
||||
const res: any = await getOrderListInfoApi({ orderId: props.orderId })
|
||||
|
||||
// orderDetails.value = res.data
|
||||
console.log(res, '订单详情---')
|
||||
// cardList.value = res.data
|
||||
// operationDetails.value[1].preOutboundUser = res.data.detailsList[0].preOutboundUser
|
||||
// operationDetails.value[1].preOutboundTime = res.data.detailsList[0].preOutboundTime
|
||||
// operationDetails.value[2].takeOverUser = res.data.detailsList[0].takeOverUser
|
||||
// operationDetails.value[2].takeOverTime = res.data.detailsList[0].takeOverTime
|
||||
// operationDetails.value[3].rentOverUser = res.data.detailsList[0].rentOverUser
|
||||
// operationDetails.value[3].rentOverTime = res.data.detailsList[0].rentOverTime
|
||||
}
|
||||
|
||||
onBeforeMount(() => {
|
||||
getId()
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
getList()
|
||||
})
|
||||
|
||||
const props = defineProps({
|
||||
orderStatus: {
|
||||
type: [String, Number],
|
||||
default: () => '',
|
||||
},
|
||||
orderId: {
|
||||
type: [String, Number],
|
||||
default: () => '',
|
||||
},
|
||||
})
|
||||
|
||||
const emit = defineEmits(['onBackOrderHome'])
|
||||
const onOrderManage = () => {
|
||||
emit('onBackOrderHome')
|
||||
}
|
||||
|
||||
console.log(props.orderStatus, 'orderStatus', props.orderId, 'orderId')
|
||||
|
||||
const time = ref([])
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<!-- 订单管理 -->
|
||||
<div class="container">
|
||||
<el-breadcrumb separator="/" style="padding: 15px 0">
|
||||
<el-breadcrumb-item @click="onOrderManage" class="order-title"
|
||||
>订单管理</el-breadcrumb-item
|
||||
>
|
||||
<el-breadcrumb-item>订单明细</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<div class="order-details">
|
||||
<TitleTip :titleText="`订单流程`" />
|
||||
|
||||
<div style="padding: 20px 40px">
|
||||
<el-steps :active="1" finish-status="success" process-status="wait" align-center>
|
||||
<el-step title="Done" />
|
||||
<el-step title="Processing" />
|
||||
<el-step title="Step 3" />
|
||||
<el-step title="Step 3" />
|
||||
<el-step title="Step 3" />
|
||||
</el-steps>
|
||||
</div>
|
||||
<TitleTip :titleText="`租赁信息`" />
|
||||
|
||||
<div class="section">
|
||||
<el-header>
|
||||
<el-row type="flex" justify="space-between" align="middle">
|
||||
<el-col :span="3">
|
||||
<span>订单流程</span>
|
||||
</el-col>
|
||||
<el-col
|
||||
:span="2"
|
||||
style="text-align: right; margin-right: 80px; font-size: 20px"
|
||||
>
|
||||
<div style="color: green">{{ titleStaus }}</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-header>
|
||||
|
||||
<el-steps
|
||||
class="step"
|
||||
:space="600"
|
||||
:active="orderStatusTemp === 7 ? 1 : orderStatusTemp - 2"
|
||||
finish-status="success"
|
||||
>
|
||||
<el-step :title="getStepTitle(1)" :description="getDescription(1)"></el-step>
|
||||
<el-step :title="getStepTitle(2)" :description="getDescription(2)"></el-step>
|
||||
<el-step :title="getStepTitle(3)" :description="getDescription(3)"></el-step>
|
||||
<el-step :title="getStepTitle(4)"></el-step>
|
||||
<el-step :title="getStepTitle(5)"></el-step>
|
||||
</el-steps>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<el-header style="height: 30px">租赁信息 </el-header>
|
||||
<div style="height: 80px">
|
||||
<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: 14px;
|
||||
margin-left: 40px;
|
||||
opacity: 0.7;
|
||||
"
|
||||
>
|
||||
<span>订单编号：{{ orderDetails.code }}</span>
|
||||
</div>
|
||||
<div
|
||||
class="item"
|
||||
style="
|
||||
width: 30%;
|
||||
flex-shrink: 0;
|
||||
margin-bottom: 5px;
|
||||
font-size: 14px;
|
||||
opacity: 0.7;
|
||||
"
|
||||
>
|
||||
<span>下单时间：{{ orderDetails.orderTime }}</span>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="item"
|
||||
style="
|
||||
width: 30%;
|
||||
flex-shrink: 0;
|
||||
margin-bottom: 5px;
|
||||
font-size: 14px;
|
||||
opacity: 0.7;
|
||||
"
|
||||
>
|
||||
<span></span>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="item"
|
||||
style="
|
||||
width: 30%;
|
||||
flex-shrink: 0;
|
||||
margin-bottom: 5px;
|
||||
font-size: 14px;
|
||||
margin-left: 40px;
|
||||
opacity: 0.7;
|
||||
"
|
||||
>
|
||||
<span>出租单位：{{ orderDetails.czcompanyName }}</span>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="item"
|
||||
style="
|
||||
width: 30%;
|
||||
flex-shrink: 0;
|
||||
margin-bottom: 5px;
|
||||
font-size: 14px;
|
||||
opacity: 0.7;
|
||||
"
|
||||
>
|
||||
<span>出租人：{{ orderDetails.person }}</span>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="item"
|
||||
style="
|
||||
width: 30%;
|
||||
flex-shrink: 0;
|
||||
margin-bottom: 5px;
|
||||
font-size: 14px;
|
||||
opacity: 0.7;
|
||||
"
|
||||
>
|
||||
<span>出租人电话：{{ orderDetails.personPhone }}</span>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="item"
|
||||
style="
|
||||
width: 30%;
|
||||
flex-shrink: 0;
|
||||
margin-bottom: 5px;
|
||||
font-size: 14px;
|
||||
margin-left: 40px;
|
||||
opacity: 0.7;
|
||||
"
|
||||
>
|
||||
<span>承租单位：{{ orderDetails.companyName }}</span>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="item"
|
||||
style="
|
||||
width: 30%;
|
||||
flex-shrink: 0;
|
||||
margin-bottom: 5px;
|
||||
font-size: 14px;
|
||||
opacity: 0.7;
|
||||
"
|
||||
>
|
||||
<span>承租人：{{ orderDetails.nickName }}</span>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="item"
|
||||
style="
|
||||
width: 30%;
|
||||
flex-shrink: 0;
|
||||
margin-bottom: 5px;
|
||||
font-size: 14px;
|
||||
opacity: 0.7;
|
||||
"
|
||||
>
|
||||
<span>承租人电话：{{ orderDetails.phoneNumber }}</span>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="item"
|
||||
style="
|
||||
width: 30%;
|
||||
flex-shrink: 0;
|
||||
margin-bottom: 5px;
|
||||
font-size: 14px;
|
||||
margin-left: 40px;
|
||||
opacity: 0.7;
|
||||
"
|
||||
>
|
||||
<span>租赁协议：</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-row
|
||||
class="cart-listAll"
|
||||
:style="{ background: cardList.orderStatus == '6' ? '#EBEEF5' : 'white' }"
|
||||
>
|
||||
<el-col :span="1">
|
||||
<!-- <div style="text-align: center">
|
||||
<el-checkbox :key="numberTemp" v-model="goods.isChecked" @change="onChangeGoods(index)" :disabled="goods.orderStatus!='2'">
|
||||
</el-checkbox>
|
||||
</div> -->
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-row
|
||||
class="cart-list"
|
||||
v-for="(goods, j) in cardList.detailsList"
|
||||
:key="j"
|
||||
>
|
||||
<el-col class="goods-info">
|
||||
<el-col :span="7">
|
||||
<img
|
||||
:src="goods.url"
|
||||
style="width: 160px; height: 120px"
|
||||
alt=""
|
||||
/>
|
||||
</el-col>
|
||||
<div class="goods-code">
|
||||
<div style="font-size: 10px; font-weight: bold">
|
||||
{{ goods.deviceName }}
|
||||
</div>
|
||||
<div>租期：{{ goods.days }}{{ ' ' + '天' }}</div>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
"
|
||||
>
|
||||
<div style="flex: 1; text-align: left; width: 220px">
|
||||
租金：{{ goods.dayLeasePrice }}{{ ' ' + '元/天' }}
|
||||
</div>
|
||||
<div style="flex: 1; text-align: left">
|
||||
数量：{{ goods.num }}{{ ' ' + '台' }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<div style="font-size: 14px; font-weight: bold; margin-bottom: 10px">
|
||||
总费用
|
||||
</div>
|
||||
<div class="red-font">{{ cardList.cost }}</div>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<div style="font-size: 14px; font-weight: bold; margin-bottom: 10px">
|
||||
租期
|
||||
</div>
|
||||
<div style="color: black; font-weight: bold">
|
||||
{{ cardList.startTime }}
|
||||
</div>
|
||||
<div style="margin-top: 3px; margin-bottom: 3px">{{ '至' }}</div>
|
||||
<div style="color: black; font-weight: bold">{{ cardList.endTime }}</div>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<div
|
||||
v-if="cardList.orderStatus == '2'"
|
||||
style="
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
color: blue;
|
||||
"
|
||||
>
|
||||
{{ '待出库' }}
|
||||
</div>
|
||||
<div
|
||||
v-if="cardList.orderStatus == '3'"
|
||||
style="
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
color: #c76f60;
|
||||
"
|
||||
>
|
||||
{{ '待收货' }}
|
||||
</div>
|
||||
<div
|
||||
v-if="cardList.orderStatus == '4' && isExpired(cardList)"
|
||||
style="
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
color: #008d06;
|
||||
"
|
||||
>
|
||||
{{ '租赁中' }}
|
||||
<span style="color: red">(已过期)</span>
|
||||
</div>
|
||||
<div
|
||||
v-if="cardList.orderStatus == '4' && !isExpired(cardList)"
|
||||
style="
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
color: #008d06;
|
||||
"
|
||||
>
|
||||
{{ '租赁中' }}
|
||||
</div>
|
||||
<div
|
||||
v-if="cardList.orderStatus == '5'"
|
||||
style="
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
color: #5b33cc;
|
||||
"
|
||||
>
|
||||
{{ '已退租' }}
|
||||
</div>
|
||||
<div
|
||||
v-if="cardList.orderStatus == '6'"
|
||||
style="
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
color: #c00017;
|
||||
"
|
||||
>
|
||||
{{ '已完成' }}
|
||||
</div>
|
||||
<div
|
||||
v-if="cardList.orderStatus == '7'"
|
||||
style="
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
color: #797979;
|
||||
"
|
||||
>
|
||||
{{ '已驳回' }}
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
// width: 800px;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.order-title {
|
||||
cursor: pointer;
|
||||
color: #00a288;
|
||||
font-weight: bold;
|
||||
:deep .el-breadcrumb__inner {
|
||||
color: #00a288;
|
||||
}
|
||||
}
|
||||
|
||||
.order-details {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
|
||||
padding: 0 12px;
|
||||
}
|
||||
|
||||
.step {
|
||||
margin-left: 80px;
|
||||
}
|
||||
|
||||
.section {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.cart-tbody {
|
||||
background: #fff;
|
||||
padding: 8px 12px;
|
||||
margin: 10px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 20px;
|
||||
.cart-user-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 13px;
|
||||
|
||||
.user-name,
|
||||
.user-phone {
|
||||
padding: 3px 18px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.user-name {
|
||||
margin-left: 20px;
|
||||
border-right: none;
|
||||
}
|
||||
}
|
||||
|
||||
.cart-list {
|
||||
margin: 15px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
div {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.goods-info {
|
||||
display: flex;
|
||||
align-content: center;
|
||||
border-bottom: 1px solid #00a288;
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
.cart-listAll {
|
||||
margin: 15px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 13px;
|
||||
|
||||
div {
|
||||
text-align: center;
|
||||
}
|
||||
.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: 180px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.goods-code {
|
||||
margin-left: 110px;
|
||||
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;
|
||||
}
|
||||
}
|
||||
.lease-date {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.red-font {
|
||||
color: #ff4800;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
|
|
@ -212,13 +212,6 @@
|
|||
:model="addOrEditForm"
|
||||
:rules="addOrEditFormRules"
|
||||
>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="需求名称" prop="leaseName">
|
||||
<el-input v-model="addOrEditForm.leaseName" placeholder="请输入需求名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="项目所在地" style="width: 100%" prop="provinceCode">
|
||||
|
|
@ -291,6 +284,26 @@
|
|||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="需求名称" prop="leaseName">
|
||||
<el-input v-model="addOrEditForm.leaseName" placeholder="请输入需求名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="需求截止日期" prop="endTime">
|
||||
<el-date-picker
|
||||
clearable
|
||||
type="date"
|
||||
style="width: 100%"
|
||||
value-format="YYYY-MM-DD"
|
||||
:disabled-date="disabledDate"
|
||||
v-model="addOrEditForm.endTime"
|
||||
placeholder="请选择需求截止日期"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="联系人" prop="person">
|
||||
|
|
@ -313,33 +326,34 @@
|
|||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="需求截止日期" prop="endTime">
|
||||
<el-form-item label="租赁开始日期" prop="leaseStartTime">
|
||||
<el-date-picker
|
||||
clearable
|
||||
type="date"
|
||||
style="width: 100%"
|
||||
value-format="YYYY-MM-DD"
|
||||
:disabled-date="disabledDate"
|
||||
v-model="addOrEditForm.endTime"
|
||||
v-model="addOrEditForm.leaseStartTime"
|
||||
placeholder="请选择需求截止日期"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="预估租期(天)" prop="leaseDay">
|
||||
<el-input-number
|
||||
:min="1"
|
||||
<el-form-item label="租赁结束日期" prop="leaseEndTime">
|
||||
<el-date-picker
|
||||
clearable
|
||||
:max="9999"
|
||||
type="date"
|
||||
style="width: 100%"
|
||||
placeholder="请输入预估租期"
|
||||
v-model="addOrEditForm.leaseDay"
|
||||
value-format="YYYY-MM-DD"
|
||||
:disabled-date="disabledLeaseEndTime"
|
||||
v-model="addOrEditForm.leaseEndTime"
|
||||
placeholder="请选择需求截止日期"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="20">
|
||||
<!-- <el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="1" style="margin-bottom: 0" class="upload-tip">
|
||||
支持格式：.jpg、.png 单个文件大小不能超过2M，最多可上传4张
|
||||
|
|
@ -383,7 +397,7 @@
|
|||
</UploadComponentNew>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-row> -->
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="需求描述" prop="description">
|
||||
|
|
@ -471,6 +485,19 @@
|
|||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="装备描述">
|
||||
<el-input
|
||||
clearable
|
||||
type="textarea"
|
||||
placeholder="请输入装备描述"
|
||||
v-model="item.description"
|
||||
:autosize="{ minRows: 2, maxRows: 4 }"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="1" style="margin-bottom: 0" class="upload-tip">
|
||||
|
|
@ -602,7 +629,9 @@ const addOrEditForm = ref<any>({
|
|||
companyId: '',
|
||||
person: '',
|
||||
personPhone: '',
|
||||
leaseDay: 1,
|
||||
// leaseDay: 1,
|
||||
leaseStartTime: '',
|
||||
leaseEndTime: '',
|
||||
endTime: '',
|
||||
description: '',
|
||||
isSubmit: '',
|
||||
|
|
@ -619,7 +648,9 @@ const addOrEditFormTemp = ref<any>({
|
|||
companyId: '',
|
||||
person: '',
|
||||
personPhone: '',
|
||||
leaseDay: 1,
|
||||
leaseStartTime: '',
|
||||
leaseEndTime: '',
|
||||
// leaseDay: 1,
|
||||
endTime: '',
|
||||
description: '',
|
||||
isSubmit: '',
|
||||
|
|
@ -632,9 +663,30 @@ const addOrEditFormTemp = ref<any>({
|
|||
detailsList: [],
|
||||
})
|
||||
|
||||
const checkEndTime = (rule: any, value: any, callback: any) => {
|
||||
if (!value) {
|
||||
return callback(new Error('请选择租赁结束日期'))
|
||||
}
|
||||
const startTime = addOrEditForm.value.leaseStartTime
|
||||
if (startTime && new Date(value) <= new Date(startTime)) {
|
||||
return callback(new Error('租赁结束日期必须大于租赁开始日期'))
|
||||
}
|
||||
callback()
|
||||
}
|
||||
const checkStartTime = (rule: any, value: any, callback: any) => {
|
||||
if (!value) {
|
||||
return callback(new Error('请选择租赁开始日期'))
|
||||
}
|
||||
const endTime = addOrEditForm.value.leaseEndTime
|
||||
if (endTime && new Date(value) >= new Date(endTime)) {
|
||||
return callback(new Error('租赁开始日期必须小于租赁结束日期'))
|
||||
}
|
||||
callback()
|
||||
}
|
||||
|
||||
const addOrEditFormRules = reactive({
|
||||
person: [{ required: true, message: '请输入联系人', trigger: 'blur' }],
|
||||
leaseDay: [{ required: true, message: '请输入预估租期', trigger: 'blur' }],
|
||||
// leaseDay: [{ required: true, message: '请输入预估租期', trigger: 'blur' }],
|
||||
leaseName: [{ required: true, message: '请输入需求名称', trigger: 'blur' }],
|
||||
areaCode: [{ required: true, message: '请选择项目所在区/县', trigger: 'change' }],
|
||||
cityCode: [{ required: true, message: '请选择项目所在市', trigger: 'change' }],
|
||||
|
|
@ -643,6 +695,14 @@ const addOrEditFormRules = reactive({
|
|||
companyId: [{ required: true, message: '请选择租赁公司', trigger: 'change' }],
|
||||
fileInfoList: [{ required: true, message: '请上传参考图片', trigger: 'blur' }],
|
||||
endTime: [{ required: true, message: '请选择需求截止日期', trigger: 'change' }],
|
||||
leaseStartTime: [
|
||||
{ required: true, message: '请选择租赁开始日期', trigger: 'change' },
|
||||
{ validator: checkStartTime, trigger: 'blur' },
|
||||
],
|
||||
leaseEndTime: [
|
||||
{ required: true, message: '请选择需租赁结束日期', trigger: 'change' },
|
||||
{ validator: checkEndTime, trigger: 'blur' },
|
||||
],
|
||||
detailsList: [{ required: true, message: '请添加需求装备信息', trigger: 'change' }],
|
||||
personPhone: [
|
||||
{ required: true, message: '请输入联系电话', trigger: 'blur' },
|
||||
|
|
@ -664,6 +724,11 @@ const disabledDate = (date: any) => {
|
|||
return date.getTime() < today.getTime()
|
||||
}
|
||||
|
||||
const disabledLeaseEndTime = (date: any) => {
|
||||
const today = new Date()
|
||||
return date.getTime() < today.getTime()
|
||||
}
|
||||
|
||||
const getClassAndCompanyData = async () => {
|
||||
const classResult: any = await getGoodsClassListApi()
|
||||
const companyResult: any = await getCompanyListApi()
|
||||
|
|
@ -728,7 +793,7 @@ const onRepublish = async (id: any, type: any, leaseStatus: any) => {
|
|||
companyId,
|
||||
person,
|
||||
personPhone,
|
||||
leaseDay,
|
||||
// leaseDay,
|
||||
endTime,
|
||||
description,
|
||||
fileInfoList,
|
||||
|
|
@ -737,6 +802,8 @@ const onRepublish = async (id: any, type: any, leaseStatus: any) => {
|
|||
cityCode,
|
||||
provinceCode,
|
||||
detailsList,
|
||||
leaseStartTime,
|
||||
leaseEndTime,
|
||||
} = res.data
|
||||
|
||||
Object.assign(addOrEditForm.value, {
|
||||
|
|
@ -744,7 +811,7 @@ const onRepublish = async (id: any, type: any, leaseStatus: any) => {
|
|||
companyId,
|
||||
person,
|
||||
personPhone,
|
||||
leaseDay,
|
||||
// leaseDay,
|
||||
endTime,
|
||||
description,
|
||||
id,
|
||||
|
|
@ -754,6 +821,8 @@ const onRepublish = async (id: any, type: any, leaseStatus: any) => {
|
|||
cityCode,
|
||||
provinceCode,
|
||||
detailsList,
|
||||
leaseStartTime,
|
||||
leaseEndTime,
|
||||
})
|
||||
|
||||
detailsList.forEach((e: any) => {
|
||||
|
|
@ -875,6 +944,7 @@ const onAddDemandInfo = () => {
|
|||
leaseNum: 1,
|
||||
fileInfoList: [],
|
||||
fileInfoTempList: [],
|
||||
description: '',
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue