增加价格按需显示问题

This commit is contained in:
BianLzhaoMin 2025-12-12 17:11:49 +08:00
parent 7ea68f3ebc
commit 669c288cd4
5 changed files with 232 additions and 139 deletions

View File

@ -5,7 +5,9 @@
<li style="margin: 10px 0">
<span class="item_1_span"> {{ name }} </span>
<span>{{ typeName }}</span>
<span class="item_2_span"> {{ manageMode == '0' ? statusText : `在库数量: ${deviceCount}` }} </span>
<span class="item_2_span">
{{ manageMode == '0' ? statusText : `在库数量: ${deviceCount}` }}
</span>
</li>
<li style="color: #b6b6b6; font-size: 14px">{{ company }}</li>
<li style="color: #b6b6b6; font-size: 14px">
@ -14,8 +16,8 @@
</li>
</ul>
<div style="margin: 10px 0; padding-right: 15px; text-align: right; ">
<span style="text-align: right; color: #ff4800; display: none">
<div style="margin: 10px 0; padding-right: 15px; text-align: right">
<span style="text-align: right; color: #ff4800" v-if="isShowPrice">
<i style="font-size: 14px"></i>
<i style="margin: 0 6px; font-size: 18px; font-weight: bold">{{ price }}</i>
<i style="font-size: 14px">/ </i>
@ -25,6 +27,8 @@
</template>
<script lang="ts" setup>
import { computed } from 'vue'
import { getPriceShowConfigApi } from 'http/api/common'
const isShowPrice = ref(false) //
const props: any = defineProps({
url: {
type: String,
@ -71,6 +75,10 @@ const props: any = defineProps({
type: [String, Number],
default: '',
},
price: {
type: [String, Number],
default: '',
},
})
const emit = defineEmits(['onClick'])
@ -102,6 +110,12 @@ const statusText = computed(() => {
return '未知'
}
})
const isShowPriceFun = async () => {
const res: any = await getPriceShowConfigApi()
isShowPrice.value = res?.rows[0].status == 0 ? true : false
}
isShowPriceFun()
</script>
<style lang="scss" scoped>
.equipCard {

10
src/http/api/common.ts Normal file
View File

@ -0,0 +1,10 @@
import { post, get, put } from '../index'
// 获取价格控制开关
export const getPriceShowConfigApi = () => {
return get(`/system/dict/type/list`, {
pageNum: 1,
pageSize: 10,
dictType: 'price_normal_disable',
})
}

View File

@ -14,7 +14,13 @@
<div style="margin: 0 8px">预约车</div>
<div>({{ amountNum }})</div>
</div>
<el-form ref="formRef :model="queryForm label-width="105px" :rules="queryFormRules" inline>
<el-form
ref="formRef :model="
queryForm
label-width="105px"
:rules="queryFormRules"
inline
>
<el-form-item prop="address" label="需求单位">
<el-input
v-model="queryForm.useUnitName"
@ -88,21 +94,24 @@
</el-checkbox>
</div>
</el-col>
<el-col :span="9">
<el-col :span="isShowPrice ? 8 : 9">
<div>装备信息</div>
</el-col>
<el-col :span="4">
<div>租期</div>
</el-col>
<el-col :span="2" v-if="isShowPrice">
<div>日租金/</div>
</el-col>
<el-col :span="2">
<div>天数</div>
</el-col>
<el-col :span="4">
<el-col :span="isShowPrice ? 3 : 4">
<div>数量</div>
</el-col>
<!-- <el-col :span="2">-->
<!-- <div>总金额/</div>-->
<!-- </el-col>-->
<!-- <el-col :span="2">-->
<!-- <div>总金额/</div>-->
<!-- </el-col>-->
<el-col :span="2">
<div>操作</div>
</el-col>
@ -139,7 +148,7 @@
</el-checkbox>
</div>
</el-col>
<el-col :span="9" class="goods-info">
<el-col :span="isShowPrice ? 8 : 9" class="goods-info">
<div class="img-box">
<img :src="goods.picUrl" alt="" />
<div class="img-mask" v-if="goods.maStatus != 1">
@ -175,12 +184,17 @@
/>
</div>
</el-col>
<el-col :span="2" v-if="isShowPrice">
<div class="red-font" style="color: #0062ff">
{{ goods.dayLeasePrice }}
</div>
</el-col>
<el-col :span="2">
<div class="red-font" style="color: #0062ff">
{{ goods.days }}
</div>
</el-col>
<el-col :span="4">
<el-col :span="isShowPrice ? 3 : 4">
<div>
<el-input-number
v-model="goods.num"
@ -294,13 +308,13 @@
件装备
</div>
</el-col>
<!-- <el-col :span="3">-->
<!-- <div class="red-font">-->
<!-- 订单总金额<span style="color: #ff4800; font-weight: bold"-->
<!-- >{{ orderAmountPice }} </span-->
<!-- >-->
<!-- </div>-->
<!-- </el-col>-->
<!-- <el-col :span="3">-->
<!-- <div class="red-font">-->
<!-- 订单总金额<span style="color: #ff4800; font-weight: bold"-->
<!-- >{{ orderAmountPice }} </span-->
<!-- >-->
<!-- </div>-->
<!-- </el-col>-->
<el-col :span="2">
<div style="text-align: right">
<el-button
@ -455,7 +469,7 @@ import {
submitBookCarApi,
deleteCartByIdApi,
getBookCarAgreementApi,
getProListApi
getProListApi,
} from 'http/api/cart/index'
import { getAreaApi } from 'http/api/home'
import { getAddressListApi, addAddressInfoApi } from 'http/api/address-manage/index'
@ -468,6 +482,7 @@ import jsPreviewDocx from '@js-preview/docx'
import '@js-preview/docx/lib/index.css'
import { debounce } from 'lodash'
import { mainStore } from '@/store/main'
import { getPriceShowConfigApi } from 'http/api/common'
const store = mainStore()
const userStore = useStore()
const router = useRouter()
@ -1064,6 +1079,14 @@ const onSelectAddress = (address: any) => {
}
getReceiptGoodsAddress()
const isShowPrice = ref(false)
const isShowPriceFun = async () => {
const res: any = await getPriceShowConfigApi()
isShowPrice.value = res?.rows[0].status == 0 ? true : false
}
isShowPriceFun()
</script>
<style lang="scss" scoped>

View File

@ -104,13 +104,13 @@
</div>
<div class="right">
<div class="Top">
<div class="price">
<!-- -->
<!-- <span>{{ pageData.dayLeasePrice }}</span>-->
<!-- /-->
<div class="price" v-if="isShowPrice">
<span>{{ pageData.dayLeasePrice }}</span>
/
</div>
</div>
<div class="phone" style="margin-top: 100px;margin-right: 30px;">
<div class="phone" style="margin-top: 100px; margin-right: 30px">
<svg class="icon" aria-hidden="true" style="width: 24px; height: 24px">
<use xlink:href="#icon-dianhua"></use>
</svg>
@ -144,43 +144,66 @@
</div>
</div>
<div class="detail">
<div class="publicTitle">设备详情</div>
<!-- <div class="publicLine"></div> -->
<div class="list publicContent">
<!-- 动态渲染两栏布局 -->
<template v-for="(row, index) in chunkedEquipDetail" :key="index">
<div class="row">
<!-- 第一组键值对 -->
<div class="item">
<div class="label">{{ row[0].label || row[0].propertyName }}</div>
<div :class="row[0].fn ? 'fnValue' : 'value'"
@click="row[0].fn && handelDetailListClick(row[0].fn, pageData[row[0].arg])">
{{ row[0].key ? pageData[row[0].key] : row[0].propertyValue }}
<div class="detail">
<div class="publicTitle">设备详情</div>
<!-- <div class="publicLine"></div> -->
<div class="list publicContent">
<!-- 动态渲染两栏布局 -->
<template v-for="(row, index) in chunkedEquipDetail" :key="index">
<div class="row">
<!-- 第一组键值对 -->
<div class="item">
<div class="label">{{ row[0].label || row[0].propertyName }}</div>
<div
:class="row[0].fn ? 'fnValue' : 'value'"
@click="
row[0].fn &&
handelDetailListClick(row[0].fn, pageData[row[0].arg])
"
>
{{ row[0].key ? pageData[row[0].key] : row[0].propertyValue }}
</div>
</div>
<!-- 第二组键值对如果存在 -->
<div class="item" v-if="row[1]">
<div class="label">{{ row[1].label || row[1].propertyName }}</div>
<div
:class="row[1].fn ? 'fnValue' : 'value'"
@click="
row[1].fn &&
handelDetailListClick(row[1].fn, pageData[row[1].arg])
"
>
{{ row[1].key ? pageData[row[1].key] : row[1].propertyValue }}
</div>
</div>
</div>
<!-- 第二组键值对如果存在 -->
<div class="item" v-if="row[1]">
<div class="label">{{ row[1].label || row[1].propertyName }}</div>
<div :class="row[1].fn ? 'fnValue' : 'value'"
@click="row[1].fn && handelDetailListClick(row[1].fn, pageData[row[1].arg])">
{{ row[1].key ? pageData[row[1].key] : row[1].propertyValue }}
</div>
</div>
</div>
</template>
</div>
</template>
</div>
</div>
<div class="appearance">
<div class="publicTitle">装备外观</div>
<div class="urlList">
<img :src="v.fileUrl" v-for="(v, i) in pageData.detailsFileList" :key="i" style="width: 500px; height: 500px; object-fit: cover;"/>
<img
:src="v.fileUrl"
v-for="(v, i) in pageData.detailsFileList"
:key="i"
style="width: 500px; height: 500px; object-fit: cover"
/>
</div>
</div>
<div class="appearance">
<div class="publicTitle" v-if="pageData.insurancePdf && pageData.insurancePdf.length > 0">证书展示</div>
<div class="certificate" v-if="pageData.insurancePdf && pageData.insurancePdf.length > 0">
<div
class="publicTitle"
v-if="pageData.insurancePdf && pageData.insurancePdf.length > 0"
>
证书展示
</div>
<div
class="certificate"
v-if="pageData.insurancePdf && pageData.insurancePdf.length > 0"
>
<el-row>
<el-col :span="2">
<div>合格证</div>
@ -544,6 +567,7 @@ import {
apiSubmitLease,
apiGetAddressList,
} from 'http/api/equip'
import { getPriceShowConfigApi } from 'http/api/common'
import { useRoute, useRouter } from 'vue-router'
// import Navmenu from '@/components/Navmenu/index.vue'
import equipDetailTable from '@/components/equipDetailTable.vue'
@ -565,6 +589,8 @@ console.log(pageParams, 'pageParams')
const backPath = ref<any>('')
const backName = ref<any>('')
const currentName = ref<any>('设备详情')
const isShowPrice = ref(false) //
const viewImgUrl = computed(() => {
if (goodsImgList.value.length > 0) {
return goodsImgList.value[activeIndex.value].fileUrl
@ -992,7 +1018,7 @@ const handelDetailListClick = (fnName, arg) => {
//
const getData = async () => {
const res: any = await getCodeNumDetailApi({ id:route.query.id, devType: route.query.devType })
const res: any = await getCodeNumDetailApi({ id: route.query.id, devType: route.query.devType })
res.data.isOperatorCn = res.data.isOperator ? '是' : '否'
res.data.isInsurancePdf = res.data.insurancePdf ? '点击查看' : '暂无'
res.data.isExaminationPdf = res.data.examinationPdf ? '点击查看' : '暂无'
@ -1093,13 +1119,13 @@ const picturesPreview = (row: any) => {
// equipDetailKeyList propertyNames
const chunkedEquipDetail = computed(() => {
const combinedData = [...equipDetailKeyList, ...propertyNames.value];
const chunked = [];
const combinedData = [...equipDetailKeyList, ...propertyNames.value]
const chunked = []
for (let i = 0; i < combinedData.length; i += 2) {
chunked.push(combinedData.slice(i, i + 2));
chunked.push(combinedData.slice(i, i + 2))
}
return chunked;
});
return chunked
})
// const init = async () => {
// await gethotList()
@ -1188,8 +1214,16 @@ const onChat = () => {
})
}
//
const isShowPriceFun = async () => {
const res: any = await getPriceShowConfigApi()
isShowPrice.value = res?.rows[0].status == 0 ? true : false
}
onMounted(() => {
// getUnreadCount()
isShowPriceFun()
})
</script>
<style scoped lang="scss">
@ -1509,22 +1543,22 @@ onMounted(() => {
}
}
.publicTitle {
font-size: 18px;
font-family: PingFangSC, PingFang SC;
color: #fff;
background-color: #1abc9c;
width: 120px;
height: 50px;
// line-height height
line-height: 50px;
text-align: center; //
letter-spacing: 1px;
// 使 flex
display: flex;
align-items: center;
justify-content: center;
}
.publicTitle {
font-size: 18px;
font-family: PingFangSC, PingFang SC;
color: #fff;
background-color: #1abc9c;
width: 120px;
height: 50px;
// line-height height
line-height: 50px;
text-align: center; //
letter-spacing: 1px;
// 使 flex
display: flex;
align-items: center;
justify-content: center;
}
.publicLine {
width: 100%;
height: 12px;
@ -1549,46 +1583,46 @@ onMounted(() => {
border: 1px solid #e0e0e0;
margin-bottom: 20px;
}
.detail.publicTitle{
.detail.publicTitle {
padding: 10px; /* 为标题添加内边距 */
border-bottom: 1px solid #ccc; /* 为标题添加底部边框 */
margin: 0; /* 移除标题的外边距 */
}
.detail .list {
border: 1px solid #ccc;
border-bottom: none; /* 由.row控制底部边框 */
}
.list.publicContent {
display: flex;
flex-wrap: wrap;
// padding: 10px; /* */
padding: 0; /* 移除内容区域的内边距 */
margin: 10px; /* 移除内容区域的外边距 */
gap:0;
}
}
.list.publicContent {
display: flex;
flex-wrap: wrap;
// padding: 10px; /* */
padding: 0; /* 移除内容区域的内边距 */
margin: 10px; /* 移除内容区域的外边距 */
gap: 0;
}
/* 行样式 */
.detail .list .row {
/* 行样式 */
.detail .list .row {
display: flex;
width: 100%;
border-bottom: 1px solid #ccc;
}
}
/* 单元格容器 */
.detail .list .item {
/* 单元格容器 */
.detail .list .item {
display: flex;
width: 50%; /* 两栏平分 */
border-right: 1px solid #ccc;
}
}
/* 最后一列的右边框移除 */
.detail .list .item:last-child {
/* 最后一列的右边框移除 */
.detail .list .item:last-child {
border-right: none;
}
}
/* 标签样式 */
.detail .list .label {
/* 标签样式 */
.detail .list .label {
color: #8e8e8e;
width: 35%; /* 根据内容调整 */
background-color: #f3f6f8;
@ -1598,11 +1632,11 @@ onMounted(() => {
display: flex; /* 开启 Flex 布局 */
align-items: center; /* 垂直居中 */
justify-content: center; /* 水平居中 */
}
}
/* 值样式 */
.detail .list .value,
.detail .list .fnValue {
/* 值样式 */
.detail .list .value,
.detail .list .fnValue {
flex: 1;
padding: 20px 10px;
font-size: 16px;
@ -1610,16 +1644,16 @@ onMounted(() => {
display: flex; /* 开启 Flex 布局 */
align-items: center; /* 垂直居中 */
justify-content: center; /* 水平居中 */
}
}
.detail .list .value {
.detail .list .value {
color: #333;
}
}
.detail .list .fnValue {
.detail .list .fnValue {
color: #0087cd;
cursor: pointer;
}
}
.appearance {
margin-bottom: 20px;
@ -1734,6 +1768,4 @@ onMounted(() => {
flex-wrap: wrap; /* 允许项目换行 */
gap: 10px; /* 设置项目之间的间距 */
}
</style>

View File

@ -15,7 +15,13 @@
<div>({{ amountNum }})</div>
</div>
<el-form ref="formRef :model="queryForm label-width="105px" :rules="queryFormRules" inline>
<el-form
ref="formRef :model="
queryForm
label-width="105px"
:rules="queryFormRules"
inline
>
<el-form-item prop="address" label="需求单位">
<el-input
v-model="queryForm.useUnitName"
@ -95,18 +101,18 @@
<el-col :span="4">
<div>租期</div>
</el-col>
<!-- <el-col :span="2">-->
<!-- <div>日租金/</div>-->
<!-- </el-col>-->
<el-col :span="2" v-if="isShowPrice">
<div>日租金/</div>
</el-col>
<el-col :span="3">
<div>天数</div>
</el-col>
<el-col :span="3">
<div>数量</div>
</el-col>
<!-- <el-col :span="2">-->
<!-- <div>总金额/</div>-->
<!-- </el-col>-->
<!-- <el-col :span="2">-->
<!-- <div>总金额/</div>-->
<!-- </el-col>-->
<el-col :span="3">
<div>操作</div>
</el-col>
@ -174,11 +180,11 @@
/>
</div>
</el-col>
<!-- <el-col :span="2">-->
<!-- <div class="red-font">-->
<!-- {{ item.dayLeasePrice }}-->
<!-- </div>-->
<!-- </el-col>-->
<el-col :span="2" v-if="isShowPrice">
<div class="red-font">
{{ item.dayLeasePrice }}
</div>
</el-col>
<el-col :span="3">
<div class="red-font" style="color: #0062ff">
{{ item.days }}
@ -195,11 +201,11 @@
/>
</div>
</el-col>
<!-- <el-col :span="2">-->
<!-- <div class="red-font" style="margin-left: 20px">-->
<!-- {{ item.num * item.dayLeasePrice * item.days }}-->
<!-- </div>-->
<!-- </el-col>-->
<!-- <el-col :span="2">-->
<!-- <div class="red-font" style="margin-left: 20px">-->
<!-- {{ item.num * item.dayLeasePrice * item.days }}-->
<!-- </div>-->
<!-- </el-col>-->
<el-col :span="3">
<div>
<el-button
@ -252,14 +258,14 @@
</el-row>
<el-row style="display: flex; align-items: center">
<el-col :span="16">
<!-- <div class="checkbox-container">-->
<!-- <el-checkbox v-model="protocolChecked">-->
<!-- 我已阅读并同意签署-->
<!-- </el-checkbox>-->
<!-- <a @click.stop="handleViewWord()">-->
<!-- {{ orderList[0]?.companyName }}公司租赁服务合同-->
<!-- </a>-->
<!-- </div>-->
<!-- <div class="checkbox-container">-->
<!-- <el-checkbox v-model="protocolChecked">-->
<!-- 我已阅读并同意签署-->
<!-- </el-checkbox>-->
<!-- <a @click.stop="handleViewWord()">-->
<!-- {{ orderList[0]?.companyName }}公司租赁服务合同-->
<!-- </a>-->
<!-- </div>-->
</el-col>
<el-col :span="3">
<div>
@ -270,11 +276,11 @@
</div>
</el-col>
<el-col :span="3">
<!-- <div class="red-font">-->
<!-- 订单总金额<span style="color: #ff4800; font-weight: bold"-->
<!-- >{{ orderAmountPice }} </span-->
<!-- >-->
<!-- </div>-->
<!-- <div class="red-font">-->
<!-- 订单总金额<span style="color: #ff4800; font-weight: bold"-->
<!-- >{{ orderAmountPice }} </span-->
<!-- >-->
<!-- </div>-->
</el-col>
<el-col :span="2">
<div style="text-align: right">
@ -333,6 +339,7 @@ import jsPreviewDocx from '@js-preview/docx'
import '@js-preview/docx/lib/index.css'
import { debounce } from 'lodash'
import { mainStore } from '@/store/main'
import { getPriceShowConfigApi } from 'http/api/common'
const store = mainStore()
const userStore = useStore()
const router = useRouter()
@ -386,7 +393,7 @@ const getOrderListData = async () => {
const addParams = {
maId: Number(pageParams.maId),
}
const res: any = await getCodeNumDetailApi({ id: route.query.id, devType: route.query.devType})
const res: any = await getCodeNumDetailApi({ id: route.query.id, devType: route.query.devType })
console.log(res, '装备详情')
orderList.value = []
// orderList.value = res.data
@ -402,7 +409,6 @@ const getOrderListData = async () => {
}
orderList.value.push(orderInfo)
}
onMounted(() => {
@ -549,7 +555,7 @@ const onCartSubmit = debounce(async () => {
// console.log('submitParams', submitParams)
const res: any = await submitBookCarApi({
...queryForm,
orderInfoDto: [submitParams]
orderInfoDto: [submitParams],
})
if (res.code === 200) {
ElMessage({
@ -682,6 +688,14 @@ const handleViewWord = async (index: any) => {
const submitBtn = () => {
window.location.href = wordUrl.value
}
const isShowPrice = ref(false)
const isShowPriceFun = async () => {
const res: any = await getPriceShowConfigApi()
isShowPrice.value = res?.rows[0].status == 0 ? true : false
}
isShowPriceFun()
</script>
<style lang="scss" scoped>