bonus
/
Zlpt_Portal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

购物车

This commit is contained in:
bb_pan 2025-11-20 16:14:08 +08:00
parent ff6363b692
commit 53660c7731
3 changed files with 243 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/http/api/cart/index.ts
View File

@ -16,4 +16,9 @@ export const deleteCartByIdApi = (data: any) => {
// 获取租赁协议
export const getBookCarAgreementApi = (data: any) => {
return post('/material-mall/order/bookCarAgreement', data)
}
// 使用项目
export const getProListApi = (data: any = {}) => {
return post('/material-mall/decChange/getProList', data)
}

119
src/views/cart/index.vue
View File

@ -14,6 +14,71 @@
<div style="margin: 0 8px">预约车</div>
<div>({{ amountNum }})</div>
</div>
<el-form ref="formRef :model="queryForm label-width="105px" :rules="queryFormRules" inline>
<el-form-item prop="address" label="需求单位">
<el-input
v-model="queryForm.useUnitName"
placeholder="需求单位"
readonly
style="width: 240px"
/>
</el-form-item>
<el-form-item prop="proCode" label="使用项目">
<el-select
v-model="queryForm.proCode"
placeholder="请选择使用项目"
style="width: 240px"
@change="onChangeProject"
>
<el-option
v-for="item in projectList"
:key="item.proCode"
:label="item.proName"
:value="item.proCode"
/>
</el-select>
</el-form-item>
<el-form-item label="项目类型" prop="proTypeName">
<el-input
v-model="queryForm.proTypeName"
placeholder="项目类型"
readonly
style="width: 240px"
/>
</el-form-item>
<el-form-item label="电压等级" prop="voltageLevel">
<el-input
v-model="queryForm.voltageLevel"
placeholder="电压等级"
readonly
style="width: 240px"
/>
</el-form-item>
<el-form-item label="项目所在省" prop="proProvince">
<el-input
v-model="queryForm.proProvince"
placeholder="项目所在省"
readonly
style="width: 240px"
/>
</el-form-item>
<el-form-item label="项目所在市" prop="proCity">
<el-input
v-model="queryForm.proCity"
placeholder="项目所在市"
readonly
style="width: 240px"
/>
</el-form-item>
<el-form-item label="项目所在区/县" prop="proCounty">
<el-input
v-model="queryForm.proCounty"
placeholder="项目所在区/县"
readonly
style="width: 240px"
/>
</el-form-item>
</el-form>
<el-row class="cart-th">
<el-col :span="2">
@ -390,6 +455,7 @@ import {
submitBookCarApi,
deleteCartByIdApi,
getBookCarAgreementApi,
getProListApi
} from 'http/api/cart/index'
import { getAreaApi } from 'http/api/home'
import { getAddressListApi, addAddressInfoApi } from 'http/api/address-manage/index'
@ -401,6 +467,8 @@ import { useStore } from '../../store/user'
import jsPreviewDocx from '@js-preview/docx'
import '@js-preview/docx/lib/index.css'
import { debounce } from 'lodash'
import { mainStore } from '@/store/main'
const store = mainStore()
const userStore = useStore()
const router = useRouter()
// const protocolChecked = ref<boolean>(false)
@ -428,6 +496,43 @@ const addOrEditFormRules = reactive({
const areaList = ref<any>([]) // 省
const areaCityList = ref<any>([]) // 市
const areaCountyList = ref<any>([]) // 区/县
const queryForm: any = reactive({
useUnit: store.userInfo.dept.deptId, // 需求单位
useUnitName: store.userInfo.dept.deptName,
proCode: '', // 项目编号
proName: '', // 项目名称
proType: '', // 项目类型
proTypeName: '', // 项目类型名称
voltageLevel: '', // 电压等级
proProvince: '', // 项目所在省
proCity: '', // 项目所在市
proCounty: '', // 项目所在区/县
})
const queryFormRules = reactive({
proCode: [{ required: true, message: '请选择使用项目', trigger: 'blur' }],
})
const projectList: any = ref([])
const getProList = async () => {
try {
const res: any = await getProListApi()
projectList.value = res.data
} catch (error) {
console.log('🚀 ~ getProList ~ error:', error)
}
}
const onChangeProject = (val: any) => {
const current = projectList.value.find((e: any) => e.proCode === val)
console.log('🚀 ~ onChangeProject ~ current:', current)
queryForm.proName = current.proName
queryForm.proType = current.proType
queryForm.proTypeName = current.proTypeName
queryForm.voltageLevel = current.voltage
queryForm.proProvince = current.province
queryForm.proCity = current.city
queryForm.proCounty = current.county
console.log('🚀 ~ onChangeProject ~ queryForm:', queryForm)
}
const getBookCarDetailsData = async () => {
const res: any = await getBookCarDetailsApi()
@ -449,6 +554,7 @@ const getBookCarDetailsData = async () => {
onMounted(() => {
getBookCarDetailsData()
getProList()
})
// 日期change事件
@ -643,6 +749,13 @@ const orderAmountPice = computed(() => {
// 提交按钮
const onCartSubmit = debounce(async () => {
ElMessage.closeAll()
if (!queryForm.proCode) {
ElMessageBox.alert('请选择使用项目', '提示', {
confirmButtonText: '确定',
type: 'error',
})
return
}
if (amountDevice.value < 1) {
ElMessageBox.alert('请选择装备', '提示', {
confirmButtonText: '确定',
@ -711,6 +824,7 @@ const onCartSubmit = debounce(async () => {
j.devInfoVoList.forEach((e: any) => {
if (e.isChecked) {
itemsArray.push({
...e,
maId: e.maId,
id: e.id,
rentBeginTime: e.rentBeginTime + ' ' + '00:00:00',
@ -740,7 +854,10 @@ const onCartSubmit = debounce(async () => {
// detailsList,
// }
const res: any = await submitBookCarApi(paramsList)
const res: any = await submitBookCarApi({
...queryForm,
orderInfoDto: paramsList,
})
if (res.code === 200) {
ElMessage({
showClose: false,

123
src/views/order/index.vue
View File

@ -15,6 +15,72 @@
<div>({{ amountNum }})</div>
</div>
<el-form ref="formRef :model="queryForm label-width="105px" :rules="queryFormRules" inline>
<el-form-item prop="address" label="需求单位">
<el-input
v-model="queryForm.useUnitName"
placeholder="需求单位"
readonly
style="width: 240px"
/>
</el-form-item>
<el-form-item prop="proCode" label="使用项目">
<el-select
v-model="queryForm.proCode"
placeholder="请选择使用项目"
style="width: 240px"
@change="onChangeProject"
>
<el-option
v-for="item in projectList"
:key="item.proCode"
:label="item.proName"
:value="item.proCode"
/>
</el-select>
</el-form-item>
<el-form-item label="项目类型" prop="proTypeName">
<el-input
v-model="queryForm.proTypeName"
placeholder="项目类型"
readonly
style="width: 240px"
/>
</el-form-item>
<el-form-item label="电压等级" prop="voltageLevel">
<el-input
v-model="queryForm.voltageLevel"
placeholder="电压等级"
readonly
style="width: 240px"
/>
</el-form-item>
<el-form-item label="项目所在省" prop="proProvince">
<el-input
v-model="queryForm.proProvince"
placeholder="项目所在省"
readonly
style="width: 240px"
/>
</el-form-item>
<el-form-item label="项目所在市" prop="proCity">
<el-input
v-model="queryForm.proCity"
placeholder="项目所在市"
readonly
style="width: 240px"
/>
</el-form-item>
<el-form-item label="项目所在区/县" prop="proCounty">
<el-input
v-model="queryForm.proCounty"
placeholder="项目所在区/县"
readonly
style="width: 240px"
/>
</el-form-item>
</el-form>
<el-row class="cart-th">
<el-col :span="2">
<!-- <div>
@ -254,9 +320,9 @@
<script setup lang="ts">
import Header from '../../components/header/index.vue'
import FooterInfo from '../../components/FooterInfo/index.vue'
import { ElMessage } from 'element-plus'
import { ElMessage, ElMessageBox } from 'element-plus'
import { getBookCarDetailByMaId, submitBookCarApi } from '../../http/api/order/index'
import { getBookCarAgreementApi } from 'http/api/cart/index'
import { getBookCarAgreementApi, getProListApi } from 'http/api/cart/index'
import CustomDatePickerButton from '../cart/components/date-picker-button.vue'
import { getAddressListApi } from 'http/api/address-manage/index'
import { getCodeNumDetailApi } from 'http/api/equip'
@ -266,6 +332,8 @@ import { useStore } from '../../store/user'
import jsPreviewDocx from '@js-preview/docx'
import '@js-preview/docx/lib/index.css'
import { debounce } from 'lodash'
import { mainStore } from '@/store/main'
const store = mainStore()
const userStore = useStore()
const router = useRouter()
const route = useRoute()
@ -276,6 +344,43 @@ const protocolChecked = ref<boolean>(false)
const orderList = ref<any>([])
const addressTitle = ref('请选择收货地址')
const addressList = ref<any>([])
const queryForm: any = reactive({
useUnit: store.userInfo.dept.deptId, // 需求单位
useUnitName: store.userInfo.dept.deptName,
proCode: '', // 项目编号
proName: '', // 项目名称
proType: '', // 项目类型
proTypeName: '', // 项目类型名称
voltageLevel: '', // 电压等级
proProvince: '', // 项目所在省
proCity: '', // 项目所在市
proCounty: '', // 项目所在区/县
})
const queryFormRules = reactive({
proCode: [{ required: true, message: '请选择使用项目', trigger: 'blur' }],
})
const projectList: any = ref([])
const getProList = async () => {
try {
const res: any = await getProListApi()
projectList.value = res.data
} catch (error) {
console.log('🚀 ~ getProList ~ error:', error)
}
}
const onChangeProject = (val: any) => {
const current = projectList.value.find((e: any) => e.proCode === val)
console.log('🚀 ~ onChangeProject ~ current:', current)
queryForm.proName = current.proName
queryForm.proType = current.proType
queryForm.proTypeName = current.proTypeName
queryForm.voltageLevel = current.voltage
queryForm.proProvince = current.province
queryForm.proCity = current.city
queryForm.proCounty = current.county
console.log('🚀 ~ onChangeProject ~ queryForm:', queryForm)
}
const getOrderListData = async () => {
const addParams = {
@ -303,6 +408,7 @@ const getOrderListData = async () => {
onMounted(() => {
setTimeout(() => {
getOrderListData()
getProList()
}, 500)
})
@ -389,6 +495,13 @@ const orderAmountPice = computed(() => {
// 提交按钮
const onCartSubmit = debounce(async () => {
if (!queryForm.proCode) {
ElMessageBox.alert('请选择使用项目', '提示', {
confirmButtonText: '确定',
type: 'error',
})
return
}
if (orderList.value[0].days < 1) {
ElMessage({
showClose: false,
@ -417,6 +530,7 @@ const onCartSubmit = debounce(async () => {
const orderInfo = orderList.value[0]
const submitInfo = {
...orderInfo,
maId: orderInfo.maId,
id: orderInfo.id,
rentBeginTime: orderInfo.rentBeginTime + ' ' + '00:00:00',
@ -433,7 +547,10 @@ const onCartSubmit = debounce(async () => {
detailsList: [submitInfo],
}
// console.log('submitParams', submitParams)
const res: any = await submitBookCarApi([submitParams])
const res: any = await submitBookCarApi({
...queryForm,
orderInfoDto: [submitParams]
})
if (res.code === 200) {
ElMessage({
showClose: false,