Skip to content

W
web-ci-test
提交 62732b6e 作者: 翁进城
操作

Merge remote-tracking branch 'origin/caoyun'

上级 3abcf162 822ac16e
正在显示 包含 659 行增加 和 93 行删除
pages/equipmentLeasing/detail/[id].page.tsx
...@@ -64,8 +64,8 @@ export default function EquipmentLeasingDetail() { ...@@ -64,8 +64,8 @@ export default function EquipmentLeasingDetail() {
(item) => item.productSpecList (item) => item.productSpecList
) )
if (wareList) { if (wareList) {
const wareSkuList: GetWebDeviceWareSkuById[] = wareList.flat() const List: GetWebDeviceWareSkuById[] = wareList.flat()
setWareSkuList(wareSkuList) setWareSkuList(List)
} }
}) })
} }
...@@ -391,7 +391,7 @@ export default function EquipmentLeasingDetail() { ...@@ -391,7 +391,7 @@ export default function EquipmentLeasingDetail() {
</div> </div>
<div className="num-right"> <div className="num-right">
<Form.Item style={{ flex: 1, marginRight: 16 }} name="num"> <Form.Item style={{ flex: 1, marginRight: 16 }} name="num">
<InputNumber min={1} max={10} onChange={onChangeNum} /> <InputNumber min={1} max={100} onChange={onChangeNum} />
</Form.Item> </Form.Item>
</div> </div>
</div> </div>
......
pages/equipmentLeasing/detail/components/orderForGoods/index.tsx
...@@ -125,7 +125,6 @@ export default function OrderForGoods(props: PropsBox) { ...@@ -125,7 +125,6 @@ export default function OrderForGoods(props: PropsBox) {
const handleOkPayment = () => { const handleOkPayment = () => {
setLoading(true) setLoading(true)
if (paymentDetail?.orderNo) { if (paymentDetail?.orderNo) {
const date = new FormData()
api.OrderPayment({ orderNo: paymentDetail?.orderNo }).then((res) => { api.OrderPayment({ orderNo: paymentDetail?.orderNo }).then((res) => {
if (res.code === '200') { if (res.code === '200') {
message.success('付款成功') message.success('付款成功')
...@@ -208,7 +207,7 @@ export default function OrderForGoods(props: PropsBox) { ...@@ -208,7 +207,7 @@ export default function OrderForGoods(props: PropsBox) {
<div className="image"> <div className="image">
<Image <Image
preview={{ visible: false }} preview={{ visible: false }}
src={wareSkuList![0].specImage} src={(wareSkuList && wareSkuList![0].specImage) || ''}
onClick={() => setVisible(true)} onClick={() => setVisible(true)}
/> />
<div style={{ display: 'none' }}> <div style={{ display: 'none' }}>
...@@ -218,13 +217,19 @@ export default function OrderForGoods(props: PropsBox) { ...@@ -218,13 +217,19 @@ export default function OrderForGoods(props: PropsBox) {
onVisibleChange: (vis) => setVisible(vis), onVisibleChange: (vis) => setVisible(vis),
}} }}
> >
<Image src={wareSkuList![0].specImage} /> <Image
src={(wareSkuList && wareSkuList![0].specImage) || ''}
/>
</Image.PreviewGroup> </Image.PreviewGroup>
</div> </div>
</div> </div>
<div className="right"> <div className="right">
<div className="top">{wareSkuList![0].specName}</div> <div className="top">
<div className="bottom">{wareSkuList![0].versionDesc}</div> {(wareSkuList && wareSkuList![0].specName) || ''}
</div>
<div className="bottom">
{(wareSkuList && wareSkuList![0].versionDesc) || ''}
</div>
</div> </div>
</div> </div>
<div className="body-item" style={{ width: 130 }}> <div className="body-item" style={{ width: 130 }}>
......
pages/jobServices/detail/[id].page.tsx
...@@ -78,7 +78,6 @@ export default function JobServicesDetail() { ...@@ -78,7 +78,6 @@ export default function JobServicesDetail() {
const [formDate] = Form.useForm() const [formDate] = Form.useForm()
const [isModalOpen, setIsModalOpen] = useState(false) const [isModalOpen, setIsModalOpen] = useState(false)
const [loading, setLoading] = useState(false) const [loading, setLoading] = useState(false)
const [areaValue, setAreaValue] = useState<string>()
const [provinceList, setProvinceList] = useState<RegionResp[]>([]) const [provinceList, setProvinceList] = useState<RegionResp[]>([])
const [isAddressMapShow, setIsAddressMapShow] = useState(false) const [isAddressMapShow, setIsAddressMapShow] = useState(false)
const [addressContent, setAddressContent] = useState<any>() const [addressContent, setAddressContent] = useState<any>()
...@@ -109,7 +108,8 @@ export default function JobServicesDetail() { ...@@ -109,7 +108,8 @@ export default function JobServicesDetail() {
return message.warning('请选择地点') return message.warning('请选择地点')
} }
const res = await api.insertOrderTask({ const res = await api.insertOrderTask({
address: values.address, address: addressContent.addressDteail,
taskDescription: values.taskDescription,
city: addressContent.city, city: addressContent.city,
inspectionId: detail?.id || 1, inspectionId: detail?.id || 1,
lat: addressContent.lat, lat: addressContent.lat,
...@@ -144,6 +144,7 @@ export default function JobServicesDetail() { ...@@ -144,6 +144,7 @@ export default function JobServicesDetail() {
}) })
} }
const handleCancel = () => { const handleCancel = () => {
setAddressContent(undefined)
setIsModalOpen(false) setIsModalOpen(false)
formDate.resetFields() formDate.resetFields()
} }
...@@ -256,42 +257,6 @@ export default function JobServicesDetail() { ...@@ -256,42 +257,6 @@ export default function JobServicesDetail() {
showTime showTime
/> />
</Form.Item> </Form.Item>
{/* <Form.Item
label="经度"
style={{ flex: 1, marginRight: 16 }}
name="lon"
rules={[{ required: true, message: '请输入经度' }]}
>
<Input placeholder="请输入经度" />
</Form.Item>
<Form.Item
label="纬度"
style={{ flex: 1, marginRight: 16 }}
name="lat"
rules={[{ required: true, message: '请输入纬度' }]}
>
<Input placeholder="请输入纬度" />
</Form.Item>
<Form.Item
label="选择省市"
style={{ flex: 1, marginRight: 16 }}
name="province"
rules={[{ required: true, message: '请选择省市' }]}
>
<Cascader
allowClear
placeholder="选择省市"
className="selectItem"
size="large"
fieldNames={{
label: 'name',
value: 'name',
children: 'childInfo',
}}
options={provinceList}
changeOnSelect
/>
</Form.Item> */}
<Form.Item <Form.Item
label="选择地点" label="选择地点"
style={{ flex: 1, marginRight: 16 }} style={{ flex: 1, marginRight: 16 }}
...@@ -299,8 +264,16 @@ export default function JobServicesDetail() { ...@@ -299,8 +264,16 @@ export default function JobServicesDetail() {
rules={[{ required: true, message: '请选择地点' }]} rules={[{ required: true, message: '请选择地点' }]}
> >
{addressContent ? ( {addressContent ? (
<div> <div className="address-map">
已选择：{addressContent.province + addressContent.city} <div className="value">
已选择：{addressContent.addressDteail}
</div>
<Button
onClick={() => setIsAddressMapShow(true)}
type="primary"
>
修改位置
</Button>
</div> </div>
) : ( ) : (
<Button onClick={() => setIsAddressMapShow(true)} type="text"> <Button onClick={() => setIsAddressMapShow(true)} type="text">
...@@ -308,20 +281,6 @@ export default function JobServicesDetail() { ...@@ -308,20 +281,6 @@ export default function JobServicesDetail() {
</Button> </Button>
)} )}
</Form.Item> </Form.Item>
<Form.Item
label="详细地址"
style={{ flex: 1, marginRight: 16 }}
name="address"
rules={[{ required: true, message: '请输入详情地址' }]}
>
<TextArea
value={areaValue}
onChange={(e) => setAreaValue(e.target.value)}
placeholder="请输入详情地址"
autoSize={{ minRows: 3, maxRows: 5 }}
style={{ width: 385, height: 72 }}
/>
</Form.Item>
<div> <div>
任务描述(选填) 项目号、 业务负责人、 任务描述(选填) 项目号、 业务负责人、
客户名称、演示设备(注明飞机、挂载、地面站)、现场联系人及电话 客户名称、演示设备(注明飞机、挂载、地面站)、现场联系人及电话
...@@ -331,8 +290,6 @@ export default function JobServicesDetail() { ...@@ -331,8 +290,6 @@ export default function JobServicesDetail() {
name="taskDescription" name="taskDescription"
> >
<TextArea <TextArea
value={areaValue}
onChange={(e) => setAreaValue(e.target.value)}
placeholder="补充描述有助于方案沟通更高效哦~" placeholder="补充描述有助于方案沟通更高效哦~"
autoSize={{ minRows: 3, maxRows: 5 }} autoSize={{ minRows: 3, maxRows: 5 }}
style={{ width: 385, height: 72 }} style={{ width: 385, height: 72 }}
......
pages/jobServices/detail/components/map/index.tsx
...@@ -109,16 +109,29 @@ export default function MapComponent(props: BoxProps) { ...@@ -109,16 +109,29 @@ export default function MapComponent(props: BoxProps) {
geocoder.getAddress(lnglat, function (status: any, result: any) { geocoder.getAddress(lnglat, function (status: any, result: any) {
if (status === 'complete' && result.regeocode) { if (status === 'complete' && result.regeocode) {
const address = result.regeocode.addressComponent const address = result.regeocode.addressComponent
console.log(address.province) const addressDteail =
console.log(address.city) address.province +
address.city +
address.district +
address.township +
address.street +
address.streetNumber
setAddressContent({ setAddressContent({
province: address.province, province: address.province,
city: address.city, city: address.city,
lon: lnglat.lng, lon: lnglat.lng,
lat: lnglat.lat, lat: lnglat.lat,
addressDteail,
}) })
setIsAddressMapShow(false) setIsAddressMapShow(false)
// console.log(address.province + address.city + address.district) // 打印省市区信息 // console.log(
// address.province +
// address.city +
// address.district +
// address.township +
// address.street +
// address.streetNumber
// ) // 打印省市区信息
} }
}) })
// MAP.off('click', mapGet); // 移除click事件 // MAP.off('click', mapGet); // 移除click事件
......
pages/jobServices/detail/styled.tsx
...@@ -129,4 +129,13 @@ export const Box = styled.div` ...@@ -129,4 +129,13 @@ export const Box = styled.div`
} }
} }
} }
.form-data {
.address-map {
display: flex;
align-items: center;
.value {
margin-right: 20px;
}
}
}
` `
pages/mall/detail/[id].page.tsx
...@@ -25,22 +25,21 @@ export default function MallDetail() { ...@@ -25,22 +25,21 @@ export default function MallDetail() {
const [detail, setDetail] = useState<GetLeaseGoodsDetailResp | null>(null); //详情数据 const [detail, setDetail] = useState<GetLeaseGoodsDetailResp | null>(null); //详情数据
const [intentionModalOpen, setIntentionModalOpen] = useState(false); //意向弹窗 const [intentionModalOpen, setIntentionModalOpen] = useState(false); //意向弹窗
const [productImg, setProductImg] = useState(""); //展示的商品图 const [productImg, setProductImg] = useState(""); //展示的商品图
const [previewIndex, setPreviewIndex] = useState(0); //预览开始索引 const [previewIndex, setPreviewIndex] = useState(0); //预览开始索引
const [checkItems, setCheckItems] = useState<ProductSpecList[]>([]); //选中的规格 const [checkItems, setCheckItems] = useState<ProductSpecList[]>([]); //选中的规格
const [specCount, setSpecCount] = useState(0); //规格数量 const [specCount, setSpecCount] = useState(0); //规格数量
useEffect(() => { useEffect(() => {
if(detail){ if (detail) {
let count = 0; let count = 0;
detail.goodsSpec?.forEach(good => { detail.goodsSpec?.forEach((good) => {
good.productSpecList?.forEach(product => { good.productSpecList?.forEach((product) => {
count++; count++;
}) });
}) });
setSpecCount(count); setSpecCount(count);
} }
}, [detail]) }, [detail]);
//打开意向modal //打开意向modal
const openIntentionModal = () => { const openIntentionModal = () => {
...@@ -91,7 +90,11 @@ export default function MallDetail() { ...@@ -91,7 +90,11 @@ export default function MallDetail() {
<div className="page" style={{ marginTop: 20, backgroundColor: "#fff" }}> <div className="page" style={{ marginTop: 20, backgroundColor: "#fff" }}>
<div style={{ display: "none" }}> <div style={{ display: "none" }}>
<AImage.PreviewGroup <AImage.PreviewGroup
preview={{ visible, onVisibleChange: (vis) => setVisible(vis), current: previewIndex }} preview={{
visible,
onVisibleChange: (vis) => setVisible(vis),
current: previewIndex,
}}
> >
{detail?.images?.map((item) => { {detail?.images?.map((item) => {
return <AImage key={item.id} src={item.imgUrl} />; return <AImage key={item.id} src={item.imgUrl} />;
...@@ -132,7 +135,9 @@ export default function MallDetail() { ...@@ -132,7 +135,9 @@ export default function MallDetail() {
src={item.imgUrl} src={item.imgUrl}
fallback={errImg} fallback={errImg}
style={{ cursor: "pointer" }} style={{ cursor: "pointer" }}
onClick={() => {setProductImg(item.imgUrl), setPreviewIndex(i)}} onClick={() => {
setProductImg(item.imgUrl), setPreviewIndex(i);
}}
/> />
</SwiperSlide> </SwiperSlide>
); );
......
pages/mall/detail/components/intentionModal/api/index.ts
import request from "~/api/request" import request from '~/api/request'
interface CommitMallOrderParams { interface CommitMallOrderParams {
buyNum: number; buyNum: number
directoryId: number; directoryId: number
goodsInfoId: number; goodsInfoId: number
mallSpecIds: any[]; mallSpecIds: any[]
remark?: string; remark?: string
userAddressId: number; userAddressId: number
} }
export default { export default {
//提交订单V1.0.0 //提交订单V1.0.0
commitMallOrder(params: CommitMallOrderParams) { commitMallOrder(params: CommitMallOrderParams) {
return request("/oms/app-order/commitMallOrder", 'post', params); return request('/oms/app-order/confirmMallOrder', 'post', params)
} },
} }
\ No newline at end of file
pages/mall/detail/components/intentionModal/index.module.scss
...@@ -59,6 +59,23 @@ ...@@ -59,6 +59,23 @@
padding: 0 39px 0 38px; padding: 0 39px 0 38px;
height: 364px; height: 364px;
overflow-y: auto; overflow-y: auto;
.numBox {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 10px;
.numLeft {
display: flex;
align-items: center;
.label {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #121212;
margin-right: 5px;
}
}
}
@include scrollbar(); @include scrollbar();
} }
pages/mall/detail/components/intentionModal/index.tsx
...@@ -16,7 +16,7 @@ type Props = { ...@@ -16,7 +16,7 @@ type Props = {
export default function IntentionModal(props: Props) { export default function IntentionModal(props: Props) {
const [checkedMap, setCheckedMap] = useState<{ string?: boolean }>({}); //通过索引记录选中的产品规格 例: {'1,1': true|false} props.detail?.goodsSpec[1].productSpecList[1] const [checkedMap, setCheckedMap] = useState<{ string?: boolean }>({}); //通过索引记录选中的产品规格 例: {'1,1': true|false} props.detail?.goodsSpec[1].productSpecList[1]
const [checkItems, setCheckItems] = useState<ProductSpecList[]>([]); //选中的规格 const [checkItems, setCheckItems] = useState<ProductSpecList[]>([]); //选中的规格
const [loading, setLoading] = useState(false); //下单中 const [loading, setLoading] = useState(false); //下单中
useEffect(() => { useEffect(() => {
let list: ProductSpecList[] = []; let list: ProductSpecList[] = [];
...@@ -83,15 +83,14 @@ export default function IntentionModal(props: Props) { ...@@ -83,15 +83,14 @@ export default function IntentionModal(props: Props) {
//重置为未选中 //重置为未选中
let temp = { let temp = {
...checkedMap ...checkedMap,
}; };
Object.keys(temp).forEach((key) => { Object.keys(temp).forEach((key) => {
temp[key as keyof typeof temp] = false; temp[key as keyof typeof temp] = false;
}); });
setCheckedMap(temp); setCheckedMap(temp);
props.onCancel(); props.onCancel();
}else{ } else {
} }
setLoading(false); setLoading(false);
}) })
......
pages/mall/detail/components/orderForGoods/api/index.tsx 0 → 100644
import request, { Response } from '~/api/request'
export interface GetWebDeviceDetailParams {
buyNum: number
directoryId: number
goodsInfoId: number
mallSpecIds: number[]
remark?: string
userAddressId: number
}
export interface WareImgsType {
id: number
imgUrl: string
imgType: number
}
export interface UserAddress {
id: number
takeName: string
takePhone: string
takeRegion: string
takeAddress: string
type: number
}
export interface GetOrderForGoods {
realityAmount: number
orderNo: string
}
export default {
//web-地址管理-查询用户地址列表-条件查询
listUserAddress: (params: {}): Promise<Response<UserAddress[]>> => {
return request('/oms/user-address/selectList', 'POST', params)
},
//web-产品商城-下单
FeignAddLease: (
params: GetWebDeviceDetailParams
): Promise<Response<GetOrderForGoods>> => {
return request('/oms/app-order/commitMallOrder', 'post', params)
},
//web-产品商城-订单支付
OrderPayment: (params: {
orderNo: string
}): Promise<Response<GetOrderForGoods>> => {
return request(`/payment/repocash/orderPayment`, 'get', params)
},
}
pages/mall/detail/components/orderForGoods/index.tsx 0 → 100644
import React, { useContext, useEffect, useState } from 'react'
import { OrderForGoodsBox } from './styled'
import type { FormInstance, RadioChangeEvent } from 'antd'
import { Button, Radio, Space, Input, message, Modal, Image } from 'antd'
import api, { UserAddress, GetOrderForGoods } from './api'
import moment from 'moment'
// import { ShopDetail } from '../../[id].page'
// import {
// GetWebDeviceDetailResult,
// GetWebDeviceWareSkuById,
// GetLeaseGoodsResult,
// } from '../../api'
import { UserContext } from '~/lib/userProvider'
const { TextArea } = Input
interface PropsBox {
setIsorderForGoods: (boolean: boolean) => void
mallDetail?: any
detailData?: any
shopDetail?: any
wareSkuList?: any
discount?: any
}
export default function OrderForGoods(props: PropsBox) {
const {
setIsorderForGoods,
shopDetail,
detailData,
wareSkuList,
discount,
mallDetail,
} = props
const [value, setValue] = useState(1)
const [areaValue, setAreaValue] = useState<string>()
const [list, setList] = useState<Array<UserAddress> | null>()
const onChange = (e: RadioChangeEvent) => {
console.log('radio checked', e.target.value)
setValue(e.target.value)
}
const onChangeValue = (index: number) => {
setValue(index)
}
const detailSumbit = () => {
if (!list?.length && !value) return message.warning('暂无地址信息')
if (list?.length && !value) return message.warning('请选择地址')
if (detailData && list && mallDetail) {
const pushList = {
buyNum: mallDetail.buyNum,
directoryId: mallDetail.directoryId,
goodsInfoId: mallDetail.goodsInfoId,
mallSpecIds: mallDetail.mallSpecIds,
userAddressId: value,
remark: areaValue,
}
api.FeignAddLease(pushList).then((res) => {
if (res.code === '200') {
message.success('提交成功')
setIsorderForGoods(false)
} else {
message.error(res.message)
}
})
}
}
useEffect(() => {
api
.listUserAddress({})
.then((res) => {
console.log(res)
setList(res.result)
res.result?.map((item, index) => {
if (item.type === 0) {
setValue(item.id)
}
})
})
.catch((err) => {
console.log(err)
})
}, [])
//图片预览
const [visible, setVisible] = useState(false)
return (
<OrderForGoodsBox>
<div className="address">
<div className="top">
<div className="left">确认收货地址</div>
<div className="right">
<Button type="link" style={{ color: '#007aff' }}>
管理收货地址
</Button>
</div>
</div>
<div className="bottom">
{list?.map((item, index) => (
<div
key={item.id}
className={`item ${value === item.id ? 'active' : ''}`}
onClick={() => onChangeValue(item.id)}
>
<div className="left">
<div className="active">
<div className="icon"></div>
<div className="label">寄送至</div>
</div>
<Radio.Group onChange={onChange} value={value}>
<Space direction="vertical">
<Radio value={item.id}>{item.takeAddress}</Radio>
</Space>
</Radio.Group>
</div>
{value === item.id ? (
<div className="right">
<Button type="link" style={{ color: '#007aff' }}>
修改地址
</Button>
</div>
) : null}
</div>
))}
</div>
</div>
<div className="info">
<div className="title">确认订单信息</div>
<div className="table">
<div className="table-title">
<div className="table-item" style={{ width: 290 }}>
宝贝
</div>
<div className="table-item" style={{ width: 130 }}>
单价
</div>
<div className="table-item" style={{ width: 130 }}>
数量
</div>
<div className="table-item" style={{ width: 435 }}>
合计
</div>
</div>
{mallDetail.orderGoodsProdDetailDTOS.map((item: any) => (
<div className="table-body">
<div className="body-item article" style={{ width: 290 }}>
<div className="image">
<Image
preview={{ visible: false }}
src={item.prodSkuSpecImage || ''}
onClick={() => setVisible(true)}
/>
<div style={{ display: 'none' }}>
<Image.PreviewGroup
preview={{
visible,
onVisibleChange: (vis) => setVisible(vis),
}}
>
<Image src={item.prodSkuSpecImage || ''} />
</Image.PreviewGroup>
</div>
</div>
<div className="right">
<div className="top">
{`【${item.productName}】${item.specName}` || ''}
</div>
<div className="bottom">版本：{item.versionDesc || ''}</div>
<div className="bottom">料号：{item.partNo || ''}</div>
</div>
</div>
<div className="body-item" style={{ width: 130 }}>
{item.unitPrice || 0}
</div>
<div className="body-item" style={{ width: 130 }}>
{item.buyNum || 1}
</div>
<div className="body-item total-price" style={{ width: 435 }}>
{item.skuSpecAmount}
</div>
</div>
))}
</div>
</div>
<div className="notes">
<div className="left">
<div className="label">备注：</div>
<TextArea
value={areaValue}
onChange={(e) => setAreaValue(e.target.value)}
placeholder="请输入备注"
autoSize={{ minRows: 3, maxRows: 5 }}
style={{ width: 385, height: 72 }}
/>
</div>
<div className="right">
<div className="top">
<div className="font">
<div className="label">运费：</div>
<div className="value">邮寄到付,由客户自己承担</div>
</div>
<div className="price">0.00</div>
</div>
<div className="bottom">
<div className="font">
<div className="label">押金：</div>
<div className="value">渠道商可免押金</div>
</div>
<div className="price">0.00</div>
</div>
</div>
</div>
<div className="detail-box">
<div className="right-box">
<div className="detail">
<div className="top">
<div className="label">实付款</div>
<div className="price">¥{mallDetail.orderAmount}</div>
</div>
<div className="bottom">
<div className="value">寄送至</div>
{list ? (
<div className="value-content">{list![value]?.takeAddress}</div>
) : null}
</div>
</div>
<div className="detail-sumbit">
<Button className="btn" onClick={detailSumbit}>
提交订单
</Button>
</div>
</div>
</div>
</OrderForGoodsBox>
)
}
pages/mall/detail/components/orderForGoods/styled.tsx 0 → 100644
import styled from 'styled-components'
export const OrderForGoodsBox = styled.div`
box-sizing: border-box;
width: 1000px;
.address {
.top {
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #e6e6e6;
height: 30px;
line-height: 30px;
margin-top: 30px;
.left {
font-size: 14px;
font-family: MicrosoftYaHeiUI-Bold, MicrosoftYaHeiUI;
font-weight: bold;
color: #333333;
line-height: 18px;
}
.right {
.btn {
font-size: 14px;
font-family: MicrosoftYaHei;
color: #007aff;
line-height: 19px;
}
}
}
.bottom {
.item {
display: flex;
justify-content: space-between;
align-items: center;
width: 1000px;
height: 48px;
border: 1px solid transparent;
margin-top: 8px;
&.active {
background: #fff1e8;
border-radius: 6px;
border: 1px solid #ff552d;
}
.left {
display: flex;
align-items: center;
justify-content: space-around;
.active {
margin-right: 18px;
display: flex;
.icon {
width: 15px;
height: 22px;
background: #ff552d;
margin-left: 17px;
}
.label {
font-size: 14px;
font-family: MicrosoftYaHei;
color: #000000;
line-height: 19px;
margin-left: 18px;
}
}
}
.right {
margin-right: 22px;
}
}
}
}
.info {
margin-top: 30px;
.title {
font-size: 14px;
font-family: MicrosoftYaHeiUI-Bold, MicrosoftYaHeiUI;
font-weight: bold;
color: #333333;
line-height: 18px;
}
.table {
.table-title {
display: flex;
align-items: center;
width: 1000px;
border-bottom: 1px solid #e6e6e6;
padding: 10px 0;
margin-top: 20px;
.table-item {
text-align: center;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #000000;
line-height: 19px;
}
}
.table-body {
display: flex;
align-items: center;
height: 100px;
margin-top: 10px;
.body-item {
text-align: center;
&.article {
display: flex;
justify-content: space-between;
.image {
width: 80px;
height: 80px;
background-color: pink;
margin-right: 10px;
}
.right {
.top {
width: 171px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #141414;
line-height: 20px;
}
.bottom {
width: 171px;
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #929295;
line-height: 17px;
}
}
}
&.total-price {
font-size: 14px;
font-family: MicrosoftYaHeiUI-Bold, MicrosoftYaHeiUI;
font-weight: bold;
color: #ff3100;
line-height: 18px;
}
}
}
}
}
.notes {
display: flex;
align-items: center;
justify-content: space-between;
width: 1000px;
height: 110px;
background: #e1efff;
border: 1px solid #d0eaf5;
padding: 0 22px 0 16px;
.left {
display: flex;
align-items: top;
.label {
font-size: 14px;
font-family: MicrosoftYaHei;
color: #000000;
margin-top: 4px;
}
}
.right {
width: 430px;
.top {
display: flex;
align-items: center;
justify-content: space-between;
}
.font {
display: flex;
}
.bottom {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 18px;
}
.label {
font-size: 14px;
font-family: MicrosoftYaHei;
color: #000000;
line-height: 19px;
margin-right: 12px;
}
.value {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #2b2b2b;
line-height: 20px;
}
.price {
font-size: 14px;
font-family: MicrosoftYaHeiUI-Bold, MicrosoftYaHeiUI;
font-weight: bold;
color: #ff3100;
line-height: 18px;
}
}
}
.detail-box {
display: flex;
justify-content: flex-end;
margin-top: 26px;
.right-box {
.detail {
width: 477px;
height: 110px;
border: 1px solid #ff5001;
padding: 16px 19px 19px 19px;
.top {
display: flex;
justify-content: flex-end;
align-items: center;
.label {
font-size: 14px;
font-family: MicrosoftYaHei;
color: #474747;
line-height: 19px;
margin-right: 10px;
}
.price {
font-size: 26px;
font-family: MicrosoftYaHeiUI-Bold, MicrosoftYaHeiUI;
font-weight: bold;
color: #ff552d;
line-height: 33px;
}
}
.bottom {
display: flex;
justify-content: flex-end;
align-items: center;
margin-top: 15px;
.value {
font-size: 12px;
font-family: MicrosoftYaHeiUI-Bold, MicrosoftYaHeiUI;
font-weight: bold;
color: #000000;
line-height: 15px;
margin-right: 10px;
}
.value-content {
font-size: 12px;
font-family: MicrosoftYaHei;
color: #333333;
line-height: 16px;
}
}
}
.detail-sumbit {
display: flex;
justify-content: flex-end;
.btn {
width: 182px;
height: 39px;
background: #ff552d;
border: 1px solid #ff5001;
border-radius: 0;
color: #ffffff;
}
}
}
}
.Payment {
.title {
text-align: center;
font-size: 26px;
font-family: MicrosoftYaHeiUI-Bold, MicrosoftYaHeiUI;
font-weight: bold;
color: #ff552d;
}
}
`
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论