样式问题调整

This commit is contained in:
BianLzhaoMin 2024-11-27 09:17:00 +08:00
parent f75cc28ec2
commit a7facfd975
4 changed files with 297 additions and 277 deletions

2
auto-imports.d.ts vendored
View File

@ -82,6 +82,6 @@ declare global {
// for type re-export // for type re-export
declare global { declare global {
// @ts-ignore // @ts-ignore
export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue' export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue'
import('vue') import('vue')
} }

11
components.d.ts vendored
View File

@ -9,19 +9,13 @@ declare module 'vue' {
export interface GlobalComponents { export interface GlobalComponents {
Breadcrumb: typeof import('./src/components/Breadcrumb/index.vue')['default'] Breadcrumb: typeof import('./src/components/Breadcrumb/index.vue')['default']
ElButton: typeof import('element-plus/es')['ElButton'] ElButton: typeof import('element-plus/es')['ElButton']
<<<<<<< HEAD
ElCarousel: typeof import('element-plus/es')['ElCarousel'] ElCarousel: typeof import('element-plus/es')['ElCarousel']
ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem'] ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem']
=======
>>>>>>> main
ElCheckbox: typeof import('element-plus/es')['ElCheckbox'] ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
ElCol: typeof import('element-plus/es')['ElCol'] ElCol: typeof import('element-plus/es')['ElCol']
ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider'] ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
ElDatePicker: typeof import('element-plus/es')['ElDatePicker'] ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
<<<<<<< HEAD
ElDialog: typeof import('element-plus/es')['ElDialog'] ElDialog: typeof import('element-plus/es')['ElDialog']
=======
>>>>>>> main
ElForm: typeof import('element-plus/es')['ElForm'] ElForm: typeof import('element-plus/es')['ElForm']
ElFormItem: typeof import('element-plus/es')['ElFormItem'] ElFormItem: typeof import('element-plus/es')['ElFormItem']
ElIcon: typeof import('element-plus/es')['ElIcon'] ElIcon: typeof import('element-plus/es')['ElIcon']
@ -29,7 +23,6 @@ declare module 'vue' {
ElInput: typeof import('element-plus/es')['ElInput'] ElInput: typeof import('element-plus/es')['ElInput']
ElMenu: typeof import('element-plus/es')['ElMenu'] ElMenu: typeof import('element-plus/es')['ElMenu']
ElMenuItem: typeof import('element-plus/es')['ElMenuItem'] ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
<<<<<<< HEAD
ElOption: typeof import('element-plus/es')['ElOption'] ElOption: typeof import('element-plus/es')['ElOption']
ElPagination: typeof import('element-plus/es')['ElPagination'] ElPagination: typeof import('element-plus/es')['ElPagination']
ElProgress: typeof import('element-plus/es')['ElProgress'] ElProgress: typeof import('element-plus/es')['ElProgress']
@ -39,10 +32,6 @@ declare module 'vue' {
ElTableColumn: typeof import('element-plus/es')['ElTableColumn'] ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
ElTag: typeof import('element-plus/es')['ElTag'] ElTag: typeof import('element-plus/es')['ElTag']
ElUpload: typeof import('element-plus/es')['ElUpload'] ElUpload: typeof import('element-plus/es')['ElUpload']
=======
ElPagination: typeof import('element-plus/es')['ElPagination']
ElRow: typeof import('element-plus/es')['ElRow']
>>>>>>> main
EquipCard: typeof import('./src/components/equipCard.vue')['default'] EquipCard: typeof import('./src/components/equipCard.vue')['default']
EquipCardHall: typeof import('./src/components/equipCardHall/index.vue')['default'] EquipCardHall: typeof import('./src/components/equipCardHall/index.vue')['default']
EquipCardNew: typeof import('./src/components/equipCardNew/index.vue')['default'] EquipCardNew: typeof import('./src/components/equipCardNew/index.vue')['default']

View File

@ -168,6 +168,7 @@ onMounted(() => {
.right-content { .right-content {
width: calc(100% - 260px); width: calc(100% - 260px);
height: 100%; height: 100%;
overflow-y: auto;
} }
.active { .active {

View File

@ -1,32 +1,32 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref } from 'vue' import { ref } from 'vue'
import PagingComponent from 'components/PagingComponent/index.vue' import PagingComponent from 'components/PagingComponent/index.vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { getOrderListApi } from 'http/api/usercenter/seekorder' import { getOrderListApi } from 'http/api/usercenter/seekorder'
const queryParams = ref({}) const queryParams = ref({})
const router = useRouter() const router = useRouter()
const pageSize = 10 const pageSize = 10
const pageNumber = 1 const pageNumber = 1
const total: any = ref(0) const total: any = ref(0)
const cardList= ref<any>([]) const cardList = ref<any>([])
const status = 0 const status = 0
// //
// const getList = async () => { // const getList = async () => {
// const res: any = await getOrderListApi() // const res: any = await getOrderListApi()
// console.log('***', res) // console.log('***', res)
// tableData.value = res.rows // tableData.value = res.rows
// total.value = res.total // total.value = res.total
// }
/** 查询列表 */
const getList = async () => {
// if(this.dateRange.length>0){
// this.queryParams.startTime=this.dateRange[0]
// this.queryParams.endTime=this.dateRange[1]
// }else{
// this.queryParams.startTime=undefined
// this.queryParams.endTime=undefined
// } // }
/** 查询列表 */ cardList.value = [
const getList = async()=> {
// if(this.dateRange.length>0){
// this.queryParams.startTime=this.dateRange[0]
// this.queryParams.endTime=this.dateRange[1]
// }else{
// this.queryParams.startTime=undefined
// this.queryParams.endTime=undefined
// }
cardList.value = [
{ {
company_name: '安徽博诺斯有限公司', company_name: '安徽博诺斯有限公司',
user_name: '王先生', user_name: '王先生',
@ -46,188 +46,188 @@
totalAmount: 0, totalAmount: 0,
isChecked: false, isChecked: false,
lease_date_string: '', lease_date_string: '',
}, },
], ],
}, },
{ {
company_name: '安徽博诺斯有限公司', company_name: '安徽博诺斯有限公司',
user_name: '王先生', user_name: '王先生',
user_phone: '18725632356', user_phone: '18725632356',
isChecked: false, isChecked: false,
good_list: [ good_list: [
{ {
goods_pic: goods_pic:
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1', 'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
goods_name: 'W190挖掘机', goods_name: 'W190挖掘机',
goods_code: '995221_JHL', goods_code: '995221_JHL',
goods_type: '挖地型号996', goods_type: '挖地型号996',
lease_date: '', lease_date: '',
lease_pic: 300, lease_pic: 300,
lease_day: 0, lease_day: 0,
goods_num: 0, goods_num: 0,
totalAmount: 0, totalAmount: 0,
isChecked: false, isChecked: false,
lease_date_string: '', lease_date_string: '',
}, },
{ {
goods_pic: goods_pic:
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1', 'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
goods_name: 'W190挖掘机', goods_name: 'W190挖掘机',
goods_code: '995221_JHL', goods_code: '995221_JHL',
goods_type: '挖地型号996', goods_type: '挖地型号996',
lease_date: '', lease_date: '',
lease_pic: 300, lease_pic: 300,
lease_day: 0, lease_day: 0,
goods_num: 0, goods_num: 0,
totalAmount: 0, totalAmount: 0,
isChecked: false, isChecked: false,
lease_date_string: '', lease_date_string: '',
}, },
{ {
goods_pic: goods_pic:
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1', 'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
goods_name: 'W190挖掘机', goods_name: 'W190挖掘机',
goods_code: '995221_JHL', goods_code: '995221_JHL',
goods_type: '挖地型号996', goods_type: '挖地型号996',
lease_date: '', lease_date: '',
lease_pic: 300, lease_pic: 300,
lease_day: 0, lease_day: 0,
goods_num: 0, goods_num: 0,
totalAmount: 0, totalAmount: 0,
isChecked: false, isChecked: false,
lease_date_string: '', lease_date_string: '',
}, },
], ],
}, },
{ {
company_name: '安徽博诺斯有限公司', company_name: '安徽博诺斯有限公司',
user_name: '王先生', user_name: '王先生',
user_phone: '18725632356', user_phone: '18725632356',
isChecked: false, isChecked: false,
good_list: [ good_list: [
{ {
goods_pic: goods_pic:
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1', 'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
goods_name: 'W190挖掘机', goods_name: 'W190挖掘机',
goods_code: '995221_JHL', goods_code: '995221_JHL',
goods_type: '挖地型号996', goods_type: '挖地型号996',
lease_date: '', lease_date: '',
lease_pic: 300, lease_pic: 300,
lease_day: 0, lease_day: 0,
goods_num: 0, goods_num: 0,
totalAmount: 0, totalAmount: 0,
isChecked: false, isChecked: false,
lease_date_string: '', lease_date_string: '',
}, },
{ {
goods_pic: goods_pic:
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1', 'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
goods_name: 'W190挖掘机', goods_name: 'W190挖掘机',
goods_code: '995221_JHL', goods_code: '995221_JHL',
goods_type: '挖地型号996', goods_type: '挖地型号996',
lease_date: '', lease_date: '',
lease_pic: 300, lease_pic: 300,
lease_day: 0, lease_day: 0,
goods_num: 0, goods_num: 0,
totalAmount: 0, totalAmount: 0,
isChecked: false, isChecked: false,
lease_date_string: '', lease_date_string: '',
}, },
], ],
}, },
]; ]
total.value = cardList.value.length; total.value = cardList.value.length
console.log(total.value) console.log(total.value)
} }
onMounted(() => { onMounted(() => {
getList() getList()
})
//
const queryTableList = () => {
getList()
}
const tableData = ref([])
/* 退租按钮 */
const clickRentingTermination = () => {
router.push({ name: 'rentinTermination' })
console.log('退租')
}
/* 查看按钮 */
const clickPreviewDetails = (row: any) => {
console.log('查看', row)
router.push({
name: 'orderDetails',
query: {
orderId: row.orderId,
},
}) })
}
// /* 续租按钮 */
const queryTableList = () => { const clickRenewalOfLease = ({ row }: any) => {
getList() console.log('续租', row)
} router.push({
name: 'renewalOfLease',
query: {
orderId: row.orderId,
},
})
}
const tableData = ref([]) /* 确认收货 */
const clickConfirmReceipt = (row: any) => {
console.log('确认收货')
router.push({
name: 'orderDetails',
query: {
orderId: row.orderId,
confirm: 'true',
},
})
}
/* 退租按钮 */ const time = ref([])
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 time = ref([])
</script> </script>
<template> <template>
<!-- 订单管理 --> <!-- 订单管理 -->
<div class="container"> <div class="container">
<el-form :model="queryParams" :inline="true" size="small"> <el-form :model="queryParams" :inline="true" size="small">
<el-form-item label="订单编号:" prop="menuName"> <el-form-item label="订单编号:" prop="menuName">
<el-input /> <el-input />
</el-form-item> </el-form-item>
<el-form-item label="创建时间:" prop="menuName"> <el-form-item label="创建时间:" prop="menuName">
<el-date-picker <el-date-picker
v-model="time" v-model="time"
type="daterange" type="daterange"
unlink-panels unlink-panels
range-separator="-" range-separator="-"
start-placeholder="开始时间" start-placeholder="开始时间"
end-placeholder="结束时间" end-placeholder="结束时间"
style="width: 180px" /> style="width: 180px"
</el-form-item> />
<el-form-item label="状态:" prop="menuName"> </el-form-item>
<el-input /> <el-form-item label="状态:" prop="menuName">
</el-form-item> <el-input />
<el-form-item label="装备类型:" prop="menuName"> </el-form-item>
<el-input /> <el-form-item label="装备类型:" prop="menuName">
</el-form-item> <el-input />
<el-form-item label="装备名称:" prop="menuName"> </el-form-item>
<el-input /> <el-form-item label="装备名称:" prop="menuName">
</el-form-item> <el-input />
<el-form-item> </el-form-item>
<el-button type="primary" @click="queryTableList">查询</el-button> <el-form-item>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button type="primary" @click="queryTableList">查询</el-button>
</el-form-item> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form> </el-form-item>
</el-form>
<div class="cart-tbody" v-for="(item, index) in cardList" :key="index"> <div class="cart-tbody" v-for="(item, index) in cardList" :key="index">
<el-row style="border-bottom: 1px solid #ccc"> <el-row style="border-bottom: 1px solid #ccc">
<el-col :span="1"> <el-col :span="1">
<div style="text-align: center"> <div style="text-align: center">
@ -239,53 +239,83 @@
</div> </div>
</el-col> </el-col>
<el-col :span="22"> <el-col :span="22">
<el-row> <el-row>
<el-col :span="7"> <el-col :span="7">
<div class="item" style="flex-shrink: 0;margin-bottom: 5px;font-size: 12px;"> <div
<span>订单编号:</span> class="item"
{{ item.company_name }} style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
</div> >
</el-col> <span>订单编号:</span>
<el-col :span="7"> {{ item.company_name }}
<div class="item" style="flex-shrink: 0;margin-bottom: 5px;font-size: 12px;"> </div>
<span class="user-name">下单时间:</span> </el-col>
{{ item.user_name }} <el-col :span="7">
</div> <div
</el-col> class="item"
<el-col :span="7"> style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
<div class="item" style="flex-shrink: 0;margin-bottom: 5px;font-size: 12px;"> >
<span class="user-phone">装备所属公司:</span> <span class="user-name">下单时间:</span>
{{ item.user_phone }} {{ item.user_name }}
</div> </div>
</el-col> </el-col>
<el-col :span="2"> <el-col :span="6">
<div style="flex-shrink: 0;margin-bottom: 1px;font-size: 7px;"> <div
<el-button v-if="status==0" class="item" type="primary" size="small">出库</el-button> class="item"
<el-button v-if="status==0" class="item" type="primary" size="small">驳回</el-button> style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
</div> >
</el-col> <span class="user-phone">装备所属公司:</span>
</el-row> {{ item.user_phone }}
</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-row>
<el-col :span="7"> <el-col :span="7">
<div class="item" style="flex-shrink: 0;margin-bottom: 5px;font-size: 12px;"> <div
<span>出租方联系电话:</span> class="item"
{{ item.company_name }} style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
</div> >
</el-col> <span>出租方联系电话:</span>
<el-col :span="7"> {{ item.company_name }}
<div class="item" style="flex-shrink: 0;margin-bottom: 5px;font-size: 12px;"> </div>
<span class="user-name">承租方联系电话:</span> </el-col>
{{ item.user_name }} <el-col :span="7">
</div> <div
</el-col> class="item"
<el-col :span="7"> style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
<div class="item" style="flex-shrink: 0;margin-bottom: 5px;font-size: 12px;"> >
<span class="user-phone">承租方地址:</span> <span class="user-name">承租方联系电话:</span>
{{ item.user_phone }} {{ item.user_name }}
</div> </div>
</el-col> </el-col>
</el-row> <el-col :span="7">
<div
class="item"
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
>
<span class="user-phone">承租方地址:</span>
{{ item.user_phone }}
</div>
</el-col>
</el-row>
</el-col> </el-col>
</el-row> </el-row>
@ -298,28 +328,30 @@
</el-col> </el-col>
<el-col :span="8" class="goods-info"> <el-col :span="8" class="goods-info">
<el-col :span="7"> <el-col :span="7">
<img :src="goods.goods_pic" alt="" /> <img :src="goods.goods_pic" alt="" />
</el-col> </el-col>
<div class="goods-code"> <div class="goods-code">
<div style="font-size: 12px; font-weight: bold">{{ goods.goods_name }}</div> <div style="font-size: 12px; font-weight: bold">{{ goods.goods_name }}</div>
<div>租期 {{ goods.lease_day }}{{" "+"天"}}</div> <div>租期 {{ goods.lease_day }}{{ ' ' + '天' }}</div>
<div>租金{{ goods.lease_pic }}{{" "+"元/天"}}</div> <div>租金{{ goods.lease_pic }}{{ ' ' + '元/天' }}</div>
<div>数量{{ goods.goods_num }}{{" "+"台"}}</div> <div>数量{{ goods.goods_num }}{{ ' ' + '台' }}</div>
</div> </div>
</el-col> </el-col>
<el-col :span="2"> <el-col :span="2">
<div style="font-size: 14px; font-weight: bold;margin-bottom:10px">总费用</div> <div style="font-size: 14px; font-weight: bold; margin-bottom: 10px">
<div class="red-font">1500</div> 总费用
</div>
<div class="red-font">1500</div>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<div style="font-size: 14px; font-weight: bold;margin-bottom:10px">租期</div> <div style="font-size: 14px; font-weight: bold; margin-bottom: 10px">租期</div>
<div style="color:black;font-weight: bold;"> <div style="color: black; font-weight: bold">
{{ "2024-10-11"+" " }}{{"至"}}{{ " "+"2024-10-11" }} {{ '2024-10-11' + ' ' }}{{ '至' }}{{ ' ' + '2024-10-11' }}
</div> </div>
</el-col> </el-col>
<el-col :span="2"> <el-col :span="2">
<div style="font-size: 14px; font-weight: bold;margin-bottom:10px"> <div style="font-size: 14px; font-weight: bold; margin-bottom: 10px">
{{ "待出租"}} {{ '待出租' }}
</div> </div>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
@ -359,20 +391,18 @@
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
<PagingComponent <PagingComponent
@getList="getList" @getList="getList"
:pageSize="pageSize" :pageSize="pageSize"
:pageNumber="pageNumber" :pageNumber="pageNumber"
:total="total" /> :total="total"
/>
</div> </div>
</div>
</div>
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
.container {
.container {
width: 800px; width: 800px;
margin: 0 auto; margin: 0 auto;
padding: 10px; padding: 10px;
@ -480,5 +510,5 @@
text-decoration: underline; text-decoration: underline;
} }
} }
} }
</style> </style>