From 3fd787a5f18c803e3357871198dc53c7a4d586b7 Mon Sep 17 00:00:00 2001
From: chenkun <3289431190@qq.com>
Date: Mon, 4 Nov 2024 02:15:42 +0800
Subject: [PATCH] .

---
 api/api.js                                     |   7 +
 components/base/topbar.vue                     |  13 +-
 package.json                                   |   3 +-
 pages/index/clearanceService.vue               |   9 +-
 pages/index/index.vue                          |  51 +-
 pages/index/tradingPlatform.vue                | 451 +++++++-----
 pages_order/components/address/addressList.vue |   2 +
 pages_order/order/offerOrBillLading.vue        | 952 ++++++++++++++-----------
 8 files changed, 883 insertions(+), 605 deletions(-)

diff --git a/api/api.js b/api/api.js
index 3c69dbc..08a20fb 100644
--- a/api/api.js
+++ b/api/api.js
@@ -161,6 +161,13 @@ const config = {
         method: 'GET',
         limit: 500,
     },
+    // 获取banner列表
+    bannerList: {
+        url: '/index/bannerList',
+        method: 'POST',
+        limit: 500,
+    },
+
 
 
 }
diff --git a/components/base/topbar.vue b/components/base/topbar.vue
index f95d60e..996619f 100644
--- a/components/base/topbar.vue
+++ b/components/base/topbar.vue
@@ -15,6 +15,8 @@
 </template>
 
 <script>
+import {mapGetters} from 'vuex'
+
 export default {
   props: {
     showRight: {
@@ -22,14 +24,17 @@ export default {
       type: String,
     }
   },
+  mounted() {
+    console.log(this.$store.state, "this.$store.state")
+  },
   data() {
     return {
 
-
-
     }
-  }
-  ,
+  },
+  computed: {
+    ...mapGetters(['userShop']),
+  },
   methods: {
     // 切换身份
     switchIdentity() {
diff --git a/package.json b/package.json
index 136edbc..06b7fff 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,7 @@
   "license": "ISC",
   "dependencies": {
     "ali-oss": "^6.21.0",
-    "dayjs": "^1.11.12"
+    "dayjs": "^1.11.12",
+    "echarts": "^5.5.1"
   }
 }
diff --git a/pages/index/clearanceService.vue b/pages/index/clearanceService.vue
index 70dd8b9..520f19f 100644
--- a/pages/index/clearanceService.vue
+++ b/pages/index/clearanceService.vue
@@ -6,15 +6,14 @@
 
       <!--内容区域-->
       <view class="content">
-
         <view class="bigImg">
           <!--换成后端后删除对应的图片-->
           <img src="../../static/image/clearanceService.png" alt="" style="width: 100%;height: 100%;">
         </view>
-        <view class="smallImg">
-          <!--换成后端后删除对应的图片-->
-          <img src="../../static/image/1.png" alt="" style="width: 100%;height: 100%;">
-        </view>
+        <!--<view class="smallImg">-->
+        <!--  &lt;!&ndash;换成后端后删除对应的图片&ndash;&gt;-->
+        <!--  <img src="../../static/image/1.png" alt="" style="width: 100%;height: 100%;">-->
+        <!--</view>-->
         <view class="ljsq">
           <span @click="applyClearanceService" class="text">
             {{ $t('components.applyNow') }}&nbsp;&nbsp;>>
diff --git a/pages/index/index.vue b/pages/index/index.vue
index a76c102..84d0dea 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -10,7 +10,12 @@
 			<!--上面第一个-->
 			<view class="topItem">
 				<view class="imageFrame">
-					<img src="../../static/image/index/4.png" style="width:100%;height:100%;">
+          <uv-swiper
+              :list="bannerList[0]"
+              height="320rpx"
+              keyName="image">
+          </uv-swiper>
+          <!--<img src="../../static/image/index/4.png" style="width:100%;height:100%;">-->
 				</view>
 			</view>
 			<!--  下面三个-->
@@ -20,7 +25,7 @@
 					<view class="left">
 						<!--<span>Company Profile</span>-->
 						<span> {{ $t('pages.index.index.companyProfile') }}</span>
-						<span class="subText"> {{ $t('other.aluminumProducts') }}</span>
+            <span class="subText"> {{ $t('pages.index.index.aluminiumProduct') }}</span>
 					</view>
 					<view class="right">
 						随着全球经济的快速发展，我们这家领先的企业公司应运而生，致力于为客户提供卓越的服务和优质的产品。我们公司成立于2001年，总部位于深圳市横岗大厦，拥有广泛的业务领域和专业的团队，专注于实现客户的期望和需求。
@@ -30,10 +35,21 @@
 				<!-- 第二个-->
 				<view class="twoItem">
 					<view class="left">
-						<img src="../../static/image/index/2.png" style="width:100%;height:100%;">
+            <uv-swiper
+                :list="bannerList[1]"
+                keyName="image"
+            >
+            </uv-swiper>
+            <!--<img src="../../static/image/index/2.png" style="width:100%;height:100%;">-->
 					</view>
+
 					<view class="right">
-						<img src="../../static/image/index/3.png" style="width:100%;height:100%;">
+            <uv-swiper
+                :list="bannerList[2]"
+                keyName="image"
+            >
+            </uv-swiper>
+            <!--<img src="../../static/image/index/3.png" style="width:100%;height:100%;">-->
 					</view>
 				</view>
 
@@ -115,15 +131,13 @@
 </template>
 
 <script>
-	import topbar from '@/components/base/topbar.vue'
-	import tabber from '@/components/base/tabbar.vue'
-	import productList from '@/components/user/productList.vue'
-	import {
-		mapGetters
-	} from 'vuex'
-	import changeLanguage from '@/components/base/changeLanguage.vue'
-
-	export default {
+import topbar from '@/components/base/topbar.vue'
+import tabber from '@/components/base/tabbar.vue'
+import productList from '@/components/user/productList.vue'
+import {mapGetters} from 'vuex'
+import changeLanguage from '@/components/base/changeLanguage.vue'
+
+export default {
 		components: {
 			tabber,
 			topbar,
@@ -137,6 +151,7 @@
 					pageSize: 10,
 					title: ''
 				},
+        bannerList: []
 			}
 		},
 		onShow(){
@@ -147,11 +162,19 @@
 				})
 			}
 			this.$store.commit('getUserInfo')
+      this.getBannerList()
 		},
 		computed: {
 			...mapGetters(['userShop']),
 		},
 		methods: {
+
+      getBannerList() {
+        this.$api('bannerList', res => {
+          this.bannerList = res.result
+        })
+      },
+
 			goToPage(titleIndex) {
 				uni.navigateTo({
 					url: '/pages_order/order/offerOrBillLading?titleIndex=' + titleIndex
@@ -223,6 +246,7 @@
 						font-size: 26rpx;
 
 						.subText {
+              text-align: center;
 							width: 80%;
 							background-color: #2e394d;
 							padding: 0 20rpx;
@@ -279,6 +303,7 @@
 						font-size: 26rpx;
 
 						.subText {
+              text-align: center;
 							background-color: #2e394d;
 							width: 80%;
 							padding: 0 20rpx;
diff --git a/pages/index/tradingPlatform.vue b/pages/index/tradingPlatform.vue
index 669a283..f7eb95c 100644
--- a/pages/index/tradingPlatform.vue
+++ b/pages/index/tradingPlatform.vue
@@ -1,181 +1,304 @@
 <template>
-	<view class="trading-platform">
+  <view class="trading-platform">
 
-		<topbar showRight="0"></topbar>
+    <topbar showRight="0"></topbar>
 
-		<view class="frame">
-			<!--顶部栏-->
+    <view class="frame">
+      <!--顶部栏-->
 
 
-			<!--折线图-->
-			<view class="chart">
-				折线图
-			</view>
+      <!--折线图-->
+      <div ref="chartContainer" class="chart" style="width: 100%; height: 300px;">
 
-			<!-- 供应商 -->
-			<view class="supplier" v-if="userShop">
+      </div>
 
-				<view style="" class="purchaser-title">
-					<span class="active"> {{ $t('other.orderList') }}</span>
-				</view>
+      <!-- 供应商 -->
+      <view v-if="userShop" class="supplier">
 
-				<view class="supplierList">
-					<orderList :list="list" />
-				</view>
-			</view>
+        <view class="purchaser-title" style="">
+          <span class="active"> {{ $t('other.orderList') }}</span>
+        </view>
 
-			<!-- 采购商 -->
-			<view class="purchaser" v-else>
+        <view class="supplierList">
+          <orderList :list="list"/>
+        </view>
+      </view>
+
+      <!-- 采购商 -->
+      <view v-else class="purchaser">
         <!--切换现货/期货-->
-				<view style="" class="purchaser-title">
-					<span @click="actionIndexChange(index)" v-for="(item, index) in type" :class="actionIndex == index ? 'active' : 'noactive'">{{ item.name }}</span>
-				</view>
-				<view class="productList">
-					<productList :list="list" />
-				</view>
-			</view>
-		</view>
-		<tabber select="1" />
-	</view>
+        <view class="purchaser-title" style="">
+          <span v-for="(item, index) in type" :class="actionIndex == index ? 'active' : 'noactive'"
+                @click="actionIndexChange(index)">{{ item.name }}</span>
+        </view>
+        <view class="productList">
+          <productList :list="list"/>
+        </view>
+      </view>
+    </view>
+    <tabber select="1"/>
+  </view>
 </template>
 
 <script>
-	import tabber from '@/components/base/tabbar.vue'
-	import topbar from "@/components/base/topbar.vue";
-	import {
-		mapGetters
-	} from 'vuex'
-	import ProductList from "@/components/user/productList.vue";
-	import OrderList from "@/pages_order/components/order/orderList.vue";
-	import mixinList from '@/mixins/list.js'
-	export default {
-		mixins : [mixinList],
-		components: {
-			OrderList,
-			ProductList,
-			topbar,
-			tabber,
-		},
-		computed: {
-			...mapGetters(['userShop']),
-		},
-		data() {
-			return {
-				actionIndex: 0,
-				mixinsListApi : 'getMyProductlist',
-				type : [
-					{
-						name : this.$t('other.spotTrading')
-					},
-					{
-						name : this.$t('other.futuresTrading')
-					},
-				],
-			}
-		},
-		onLoad() {
-			if(this.userShop){
-				// 现货/期货列表
-				this.mixinsListApi = 'productList'
-			}else{
-				// 交易平台挂单列表
-				this.mixinsListApi = 'productlist'
-
-				this.queryParams.productType = this.actionIndex
-			}
-		},
-		methods: {
-			// 切换tab
-			actionIndexChange(index) {
-				// index为0时切换到现货交易，index为1时切换到期货交易
-				this.actionIndex = index;
-				this.queryParams.productType = this.actionIndex
-				this.getData()
-			},
-		}
-	}
+import tabber from '@/components/base/tabbar.vue'
+import topbar from "@/components/base/topbar.vue";
+import {mapGetters} from 'vuex'
+import ProductList from "@/components/user/productList.vue";
+import OrderList from "@/pages_order/components/order/orderList.vue";
+import mixinList from '@/mixins/list.js'
+import * as echarts from 'echarts';
+
+export default {
+  mixins: [mixinList],
+  components: {
+    OrderList,
+    ProductList,
+    topbar,
+    tabber,
+  },
+  computed: {
+    ...mapGetters(['userShop']),
+  },
+  data() {
+    return {
+      actionIndex: 0,
+      mixinsListApi: 'getMyProductlist',
+      type: [
+        {
+          name: this.$t('other.spotTrading')
+        },
+        {
+          name: this.$t('other.futuresTrading')
+        },
+      ],
+      chartData: [
+        // {date: "08/16", value: 10},
+        // {date: "08/17", value: 15},
+        // {date: "08/18", value: 45},
+        // {date: "08/19", value: 20},
+        // {date: "08/20", value: 18},
+        // {date: "08/21", value: 10},
+        // {date: "08/22", value: 15},
+        // {date: "08/23", value: 25},
+        // {date: "08/24", value: 35},
+        // {date: "08/25", value: 30},
+        // {date: "08/26", value: 25},
+        // {date: "08/27", value: 25},
+      ],
+      unit: '元/吨',
+    }
+  },
+  onLoad() {
+    if (this.userShop) {
+      // 现货/期货列表
+      this.mixinsListApi = 'productList'
+    } else {
+      // 交易平台挂单列表
+      this.mixinsListApi = 'productlist'
+      this.queryParams.productType = this.actionIndex
+    }
+  },
+  mounted() {
+    // this.getAlPrice()
+    // setTimeout(() => {
+    //   this.initChart();
+    // })
+  },
+  onShow() {
+    this.getAlPrice()
+  },
+  methods: {
+
+    getAlPrice() {
+
+      this.$api('getAlPrice', res => {
+        this.unit = res.result.unit
+        this.chartData = res.result.data
+        this.initChart(res.result.data)
+      })
+    },
+
+    initChart(data) {
+      var that = this;
+      const chartContainer = this.$refs.chartContainer;
+      if (!chartContainer) {
+        console.error("Chart container not found");
+        return;
+      }
+      const myChart = echarts.init(chartContainer);
+
+      // 提取日期和数值
+      const dates = data.map(item => item.date);
+      const values = data.map(item => item.value);
+
+      // 配置 ECharts
+      const option = {
+        backgroundColor: '#1B263B',
+        title: {
+          text: `${'铝均价' + data[0].value}`,
+          right: '10%',
+          top: '10%',
+          textStyle: {
+            color: '#fff',
+            fontSize: 14
+          }
+        },
+        tooltip: {
+          trigger: 'axis',
+          formatter: '{c0}',
+          backgroundColor: '#3A506B',
+          textStyle: {
+            color: '#fff'
+          }
+        },
+        grid: {
+          left: '10%',
+          right: '10%',
+          bottom: '20%'
+        },
+        xAxis: {
+          type: 'category',
+          data: dates,
+          axisLine: {
+            lineStyle: {
+              color: '#fff'
+            }
+          },
+          axisLabel: {
+            color: '#fff'
+          }
+        },
+        yAxis: {
+          type: 'value',
+          axisLine: {
+            lineStyle: {
+              color: '#fff'
+            }
+          },
+          axisLabel: {
+            color: '#fff',
+            formatter: function (value) {
+              return value;
+            }
+          }
+        },
+        series: [{
+          name: '长江',
+          type: 'line',
+          data: values,
+          smooth: true,
+          symbol: 'circle',
+          symbolSize: 8,
+          itemStyle: {
+            color: '#4ECDC4'
+          },
+          lineStyle: {
+            color: '#4ECDC4',
+            width: 2
+          },
+          areaStyle: {
+            color: 'rgba(78, 205, 196, 0.2)'
+          },
+        }]
+      };
+
+      myChart.setOption(option);
+    },
+
+    // 切换tab
+    actionIndexChange(index) {
+      // index为0时切换到现货交易，index为1时切换到期货交易
+      this.actionIndex = index;
+      this.queryParams.productType = this.actionIndex
+      this.getData()
+    },
+  }
+}
 </script>
 
 <style scoped lang="scss">
-	.trading-platform {
-		background-image: url('../../static/image/index/1.png');
-		.frame {
-
-			display: flex;
-			flex-direction: column;
-			justify-content: center;
-			height: calc(100vh - 120rpx - 120rpx);
-
-			.chart {
-				height: 30%;
-			}
-
-			.supplier {
-				height: 70%;
-				padding: 20rpx 20rpx;
-				background-image: url('../../static/image/index/1.png');
-				color: #FFF;
-				font-size: 32rpx;
-
-				.supplierList {
-					margin-top: 20rpx;
-					height: 92%;
-					overflow: auto;
-				}
-
-				.purchaser-title {
-					height: 8%;
-
-					.active {
-						text-decoration: underline;
-						width: 80rpx;
-						margin: 20rpx 20rpx 20rpx 20rpx;
-						padding: 10rpx 20rpx;
-
-					}
-
-
-					.noactive {
-						width: 80rpx;
-						margin: 20rpx 20rpx 20rpx 20rpx;
-						padding: 10rpx 20rpx;
-					}
-				}
-
-			}
-
-			.purchaser {
-				height: 60%;
-				padding: 20rpx 0;
-				color: #FFF;
-				font-size: 32rpx;
-
-
-				.purchaser-title {
-
-					.active {
-						text-decoration: underline;
-						width: 80rpx;
-						margin: 20rpx 20rpx 20rpx 20rpx;
-						padding: 10rpx 20rpx;
-
-					}
-
-
-					.noactive {
-						width: 80rpx;
-						margin: 20rpx 20rpx 20rpx 20rpx;
-						padding: 10rpx 20rpx;
-					}
-				}
-
-
-				.productList {
-					margin-top: 20rpx;
-					height: 60vh;
-					overflow: auto;
-				}
-			}
-		}
-	}
+.trading-platform {
+  background-image: url('../../static/image/index/1.png');
+
+  .frame {
+
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    height: calc(100vh - 120rpx - 120rpx);
+
+    .chart {
+      height: 300px !important;
+      background-color: #1B263B; /* 背景颜色 */
+    }
+
+    .supplier {
+      height: 70%;
+      padding: 20rpx 20rpx;
+      background-image: url('../../static/image/index/1.png');
+      color: #FFF;
+      font-size: 32rpx;
+
+      .supplierList {
+        margin-top: 20rpx;
+        height: 92%;
+        overflow: auto;
+      }
+
+      .purchaser-title {
+        height: 8%;
+
+        .active {
+          text-decoration: underline;
+          width: 80rpx;
+          margin: 20rpx 20rpx 20rpx 20rpx;
+          padding: 10rpx 20rpx;
+
+        }
+
+
+        .noactive {
+          width: 80rpx;
+          margin: 20rpx 20rpx 20rpx 20rpx;
+          padding: 10rpx 20rpx;
+        }
+      }
+
+    }
+
+    .purchaser {
+      height: 60%;
+      padding: 20rpx 0;
+      color: #FFF;
+      font-size: 32rpx;
+
+
+      .purchaser-title {
+
+        .active {
+          text-decoration: underline;
+          width: 80rpx;
+          margin: 20rpx 20rpx 20rpx 20rpx;
+          padding: 10rpx 20rpx;
+
+        }
+
+
+        .noactive {
+          width: 80rpx;
+          margin: 20rpx 20rpx 20rpx 20rpx;
+          padding: 10rpx 20rpx;
+        }
+      }
+
+
+      .productList {
+        margin-top: 20rpx;
+        height: 60vh;
+        overflow: auto;
+      }
+    }
+  }
+}
 </style>
\ No newline at end of file
diff --git a/pages_order/components/address/addressList.vue b/pages_order/components/address/addressList.vue
index 8a4beb4..9496de9 100644
--- a/pages_order/components/address/addressList.vue
+++ b/pages_order/components/address/addressList.vue
@@ -86,12 +86,14 @@ export default {
       total : 0,
     }
   },
+
   methods: {
     //获取地址列表
     getAddressList() {
       return new Promise((success, fail) => {
         this.$api('addressList', this.queryParams, res => {
           if (res.code == 200) {
+            console.log("res.result.records", res.result.records)
             this.addressList = res.result.records || [];
             this.total = res.result.total || 0;
             this.addressList.forEach(n => { //筛选默认地址
diff --git a/pages_order/order/offerOrBillLading.vue b/pages_order/order/offerOrBillLading.vue
index 83266a9..b6dae24 100644
--- a/pages_order/order/offerOrBillLading.vue
+++ b/pages_order/order/offerOrBillLading.vue
@@ -1,438 +1,554 @@
 <template>
-	<view class="page">
+  <view class="page">
 
-		<navbar :title="titleList[titleIndex]" leftClick @leftClick="$utils.navigateBack" />
+    <navbar :title="titleList[titleIndex]" leftClick @leftClick="$utils.navigateBack"/>
 
-		<view class="frame">
-			<view class="title">
+    <view class="frame">
+      <view class="title">
 				<span
-					style="width: 10rpx;height: 40rpx;background-color: #1f1c39;border-radius: 10rpx;overflow: hidden;"></span>
-				<span>{{ $t('other.aluminumProducts') }}</span>
-			</view>
-
-			<view class="basic-info">
-
-				<!--供应商名称-->
-				<view class="item" v-if="titleIndex == 1">
-					<view>{{ $t('other.supplierName') }}</view>
-					<view>华南铝业有限公司</view>
-				</view>
-
-				<!--商品规格-->
-				<view class="item">
-					<view>{{ $t('components.productSpe') }}</view>
-					<view>铝制品(Al>96%)</view>
-				</view>
-
-				<!--提货地点-->
-				<view class="currentRegion">
-					<view>{{ $t('components.pickupLocation') }}</view>
-					<view @click.stop="selectAddr">
-						<input class="input" disabled v-model="form.currentRegion"
-							:placeholder=" $t('components.selectRegion')">
-						</input>
-						<view class="orientation">
-							<img src="../../static/image/address/selectIcon.png"
-								style="width:30rpx;height: 30rpx;margin:5rpx 5rpx 5rpx 5rpx;">
-						</view>
-					</view>
-				</view>
-
-				<!--详细地址-->
-				<view class="item">
-					<view>{{ $t('components.detailedAddress') }}</view>
-					<view>
-						<input v-model="form.address" :placeholder="$t('components.enterDetailedAddress') "
-							clearable></input>
-					</view>
-				</view>
-
-				<!--交货日期-->
-				<view class="delivery-date">
-					<view>{{ $t('components.deliveryDate') }}</view>
-					<view class="value">
-						<view class="dateTimeCls">
-							<view class="date" @click="startDateOpen">
-								{{ form.deliveryDate }}
-								<uv-datetime-picker ref="startDateRef" v-model="form.deliveryDate" mode="date"
-									@confirm="startDateChange"></uv-datetime-picker>
-							</view>
-							<view class="img">
-								>
-							</view>
-						</view>
-					</view>
-				</view>
-
-				<!--暂定数量-->
-				<view class="tentativeQuantity">
-					<view class="key">{{ $t('other.tentativeQuantity') }}</view>
-					<view class="value">
-						<uv-number-box v-model="form.tentativeQuantity"></uv-number-box>
-					</view>
-				</view>
-
-				<!--单价-->
-				<view class="item">
-					<view>{{ $t('components.unitPrice') }}</view>
-					<view>
-						<input clearable v-model="form.price"></input>
-					</view>
-				</view>
-
-				<!--提交报价和提交审核-->
-				<view class="btns">
+            style="width: 10rpx;height: 40rpx;background-color: #1f1c39;border-radius: 10rpx;overflow: hidden;"></span>
+        <span>{{ $t('other.aluminumProducts') }}</span>
+      </view>
+
+      <view class="basic-info">
+
+        <!--供应商名称-->
+        <view v-if="titleIndex == 1" class="item">
+          <view>{{ $t('other.supplierName') }}</view>
+          <view>华南铝业有限公司</view>
+        </view>
+
+        <!--商品规格-->
+        <view class="item">
+          <view>{{ $t('components.productSpe') }}</view>
+          <view>铝制品(Al>96%)</view>
+        </view>
+
+
+        <view class="addressA" @click="openAddress">
+          <view class="title">{{ $t('components.shippingAddress') }}</view>
+          <view class="address" style="width: 70%">
+            <image mode="" src="/static/image/address/selectIcon.png"></image>
+            <view class="">
+              {{ address.name }}
+            </view>
+            <view class="">
+              {{ address.addressDetail }}
+            </view>
+            <view class="icon">
+              <uv-icon name="arrow-right" size="30rpx"></uv-icon>
+            </view>
+          </view>
+        </view>
+
+
+        <!--提货地点-->
+        <!--<view class="currentRegion">-->
+        <!--	<view>{{ $t('components.pickupLocation') }}</view>-->
+        <!--	<view @click.stop="selectAddr">-->
+        <!--		<input class="input" disabled v-model="form.currentRegion"-->
+        <!--			:placeholder=" $t('components.selectRegion')">-->
+        <!--		</input>-->
+        <!--		<view class="orientation">-->
+        <!--			<img src="../../static/image/address/selectIcon.png"-->
+        <!--				style="width:30rpx;height: 30rpx;margin:5rpx 5rpx 5rpx 5rpx;">-->
+        <!--		</view>-->
+        <!--	</view>-->
+        <!--</view>-->
+
+        <!--详细地址-->
+        <!--<view class="item">-->
+        <!--	<view>{{ $t('components.detailedAddress') }}</view>-->
+        <!--	<view>-->
+        <!--		<input v-model="form.address" :placeholder="$t('components.enterDetailedAddress') "-->
+        <!--			clearable></input>-->
+        <!--	</view>-->
+        <!--</view>-->
+
+        <!--交货日期-->
+        <view class="delivery-date">
+          <view>{{ $t('components.deliveryDate') }}</view>
+          <view class="value">
+            <view class="dateTimeCls">
+              <view class="date" @click="startDateOpen">
+                {{ form.transactionTime }}
+                <uv-datetime-picker ref="startDateRef" v-model="form.transactionTime" mode="date"
+                                    @confirm="startDateChange"></uv-datetime-picker>
+              </view>
+              <view class="img">
+                >
+              </view>
+            </view>
+          </view>
+        </view>
+
+        <!--暂定数量-->
+        <view class="tentativeQuantity">
+          <view class="key">{{ $t('other.tentativeQuantity') }}</view>
+          <view class="value">
+            <uv-number-box v-model="form.num"></uv-number-box>
+          </view>
+        </view>
+
+        <!--单价-->
+        <view class="item">
+          <view>{{ $t('components.unitPrice') }}</view>
+          <view>
+            <input v-model="form.price" clearable></input>
+          </view>
+        </view>
+
+        <!--提交报价和提交审核-->
+        <view class="btns">
 					<span @click="confirmBtn" class="ljxd">
 						{{ titleIndex == 0 ? $t('other.submitQuotation') : $t('other.submitReview') }}
 					</span>
-					<span @click="contactUs" class="lxwm">
+          <span class="lxwm" @click="contactUs">
 						{{ $t('components.contactUs') }}
 					</span>
-					<span class="tip">{{ $t('components.contactTip') }}</span>
-				</view>
+          <span class="tip">{{ $t('components.contactTip') }}</span>
+        </view>
 
-			</view>
-		</view>
+      </view>
+    </view>
 
-		<!-- 联系客服弹框 -->
-		<customerServicePopup ref="customerServicePopup" />
+    <!-- 联系客服弹框 -->
+    <customerServicePopup ref="customerServicePopup"/>
 
-	</view>
+
+    <!-- 地址选择弹框 -->
+    <uv-popup ref="addressPopup" :round="30">
+      <addressList ref="addressList" height="60vh" @select="selectAddress"/>
+    </uv-popup>
+
+  </view>
 </template>
 
 <script>
-	import topbar from "@/components/base/topbar.vue";
-	import tabber from "@/components/base/tabbar.vue";
-	import customerServicePopup from "@/components/config/customerServicePopup.vue";
-	import Position from "@/utils/position";
-	import dayjs from "dayjs";
-
-	export default {
-		name: "offer",
-		components: {
-			customerServicePopup,
-			tabber,
-			topbar
-		},
-		onLoad(options) {
-			this.titleIndex = options.titleIndex;
-		},
-		data() {
-			return {
-				titleIndex: 0,
-				titleList: [
-					// 0 供应商报价
-					this.$t('pages.index.index.supplierQuotation'),
-					this.$t('pages.index.index.supplierBillLading')
-				],
-				form: {
-					address: "",
-					longitude: "",
-					latitude: "",
-					deliveryDate: dayjs(new Date()).format("YYYY-MM-DD"),
-
-				}
-			}
-		},
-		methods: {
-			// 提交报价/提交审核
-			confirmBtn() {
-				console.log(this.form);
-			},
-
-
-			startDateChange(val) {
-				this.$nextTick(() => {
-					this.form.deliveryDate = dayjs(val.value).format("YYYY-MM-DD")
-				});
-			},
-			startDateOpen() {
-				this.$refs.startDateRef.open();
-			},
-
-			// 联系我们
-			contactUs() {
-				this.$refs.customerServicePopup.open()
-			},
-
-			//地图上选择地址
-			selectAddr() {
-				Position.getLocation(res => {
-					Position.selectAddress(res.longitude, res.latitude, success => {
-						this.setAddress(success)
-					})
-				})
-				Position.getLocationDetail(res => {
-					console.log(res);
-					this.form.address = res
-				})
-			},
-		},
-	}
+import topbar from "@/components/base/topbar.vue";
+import tabber from "@/components/base/tabbar.vue";
+import customerServicePopup from "@/components/config/customerServicePopup.vue";
+import Position from "@/utils/position";
+import dayjs from "dayjs";
+import AddressList from "@/pages_order/components/address/addressList.vue";
+
+export default {
+  name: "offer",
+  components: {
+    AddressList,
+    customerServicePopup,
+    tabber,
+    topbar
+  },
+  onLoad(options) {
+    this.titleIndex = options.titleIndex;
+  },
+  data() {
+    return {
+      titleIndex: 0,
+      titleList: [
+        // 0 供应商报价
+        this.$t('pages.index.index.supplierQuotation'),
+        this.$t('pages.index.index.supplierBillLading')
+      ],
+      form: {
+        "addressId": "",
+        "num": 0,
+        "price": 0,
+        "transactionTime": ""
+      },
+      address: {
+        name: '请选择地址',
+        addressDetail: '',
+      },
+      addressTotal: 0,
+    }
+  },
+  onShow() {
+    this.getAddressListA()
+  },
+  methods: {
+
+    //获取地址列表
+    getAddressListA() {
+      this.$refs.addressList.getAddressList()
+    },
+
+    // 提交报价/提交审核
+    confirmBtn() {
+      //TODO
+      this.form.addressId = this.address.id
+      this.$api('addProduct', this.form, res => {
+        if (res.code == 200) {
+          uni.showToast({
+            title: '提交成功',
+            icon: 'none'
+          })
+          setTimeout(() => {
+            uni.navigateTo({
+              url: '/pages/index/index'
+            })
+          }, 1500)
+        }
+      })
+    },
+
+    openAddress() {
+      // if (this.addressTotal == 0) {
+      //   this.$refs.popup.close()
+      //   return uni.navigateTo({
+      //     url: '/pages_order/mine/address?type=back'
+      //   })
+      // }
+      this.$refs.addressPopup.open('bottom')
+      // this.getAddressList()
+    },
+    // 选择地址
+    selectAddress(e) {
+      this.address = e
+      this.$refs.addressPopup.close()
+    },
+
+
+    startDateChange(val) {
+      this.$nextTick(() => {
+        this.form.transactionTime = dayjs(val.value).format("YYYY-MM-DD")
+      });
+    },
+    startDateOpen() {
+      this.$refs.startDateRef.open();
+    },
+
+    // 联系我们
+    contactUs() {
+      this.$refs.customerServicePopup.open()
+    },
+
+    //地图上选择地址
+    selectAddr() {
+      Position.getLocation(res => {
+        Position.selectAddress(res.longitude, res.latitude, success => {
+          this.setAddress(success)
+        })
+      })
+      Position.getLocationDetail(res => {
+        console.log(res);
+        this.form.address = res
+      })
+    },
+  },
+}
 </script>
 
 
 <style scoped lang="scss">
-	.page {
-		height: 100vh;
-
-		.frame {
-			background-color: #FFF;
-
-			.title {
-				display: flex;
-				font-size: 30rpx;
-				font-weight: 700;
-				padding: 0rpx 0 0rpx 20rpx;
-				margin: 20rpx 0 0 0;
-
-				>span:nth-of-type(1) {
-					margin: 4rpx 0 0 8rpx;
-					background-color: #FFF;
-				}
-
-				>span:nth-of-type(2) {
-					margin: 0 0 0 8rpx;
-					background-color: #FFF;
-				}
-			}
-
-			.basic-info {
-				display: flex;
-				flex-direction: column;
-				gap: 10rpx;
-				//margin-top: 20rpx;
-				padding: 20rpx 20rpx 20rpx 20rpx;
-
-				.delivery-date {
-					display: flex;
-					align-items: center;
-					background-color: #FFF;
-					height: 80rpx;
-					// margin: 10rpx 0 0 0;
-					padding: 10rpx 0 0 20rpx;
-
-					>view:nth-of-type(1) {
-						width: 30%;
-						// font-weight: 700;
-					}
-
-
-					.value {
-						width: 70%;
-						border-radius: 10rpx;
-						overflow: hidden;
-
-						.dateTimeCls {
-							display: flex;
-							align-items: center;
-							justify-content: space-between;
-							width: 100%;
-							height: 80%;
-							//border: 1px solid #b0b2b3;
-							padding: 5rpx;
-							border-radius: 20rpx;
-
-							.date {
-								font-size: 30rpx;
-								display: flex;
-								align-items: center;
-								width: 80%;
-								height: 100%;
-								color: #000;
-
-							}
-
-							.img {
-								display: flex;
-								justify-content: center;
-								align-items: center;
-								//margin-left: 50rpx;
-								width: 20%;
-								//height: 100%;
-							}
-						}
-
-					}
-
-
-				}
-
-				.tentativeQuantity {
-					display: flex;
-					align-items: center;
-					background-color: #FFF;
-					height: 80rpx;
-					// margin: 10rpx 0 0 0;
-					padding: 10rpx 0 0 20rpx;
-
-					.key {
-						width: 30%;
-					}
-
-					.value {
-						width: 70%;
-						border-radius: 10rpx;
-						overflow: hidden;
-					}
-
-				}
-
-
-				.Tip {
-					display: flex;
-					align-items: center;
-					justify-content: center;
-
-					.span {
-						color: #999;
-						font-size: 24rpx;
-					}
-				}
-
-				.btns {
-					width: 100%;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					justify-content: center;
-					gap: 20rpx;
-
-					.ljxd {
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						width: 500rpx;
-						height: 70rpx;
-						border-radius: 40rpx;
-						color: #FFF;
-						font-size: 28rpx;
-						margin: 20rpx 10rpx 0 0;
-						background: $uni-color;
-						//margin-top: 20rpx;
-						border-radius: 40rpx;
-					}
-
-					.lxwm {
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						width: 500rpx;
-						height: 70rpx;
-						border-radius: 40rpx;
-						color: #000000;
-						font-size: 28rpx;
-						margin: 20rpx 10rpx 0 0;
-						background: #f1f1f1;
-						//margin-top: 20rpx;
-						border-radius: 40rpx;
-					}
-
-					.tip {
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						font-size: 24rpx;
-						color: #999;
-						//width: 500rpx;
-					}
-				}
-
-				.item {
-					display: flex;
-					align-items: center;
-					background-color: #FFF;
-					height: 80rpx;
-					// margin: 10rpx 0 0 0;
-					padding: 10rpx 0 0 20rpx;
-
-					>view:nth-of-type(1) {
-						width: 30%;
-						// font-weight: 700;
-					}
-
-					>view:nth-of-type(2) {
-						width: 70%;
-						border-radius: 10rpx;
-						overflow: hidden;
-
-
-						input {
-							background-color: #FFF;
-							font-size: 28rpx;
-							padding: 16rpx 8rpx 16rpx 15rpx;
-						}
-					}
-				}
-
-				.performanceBond {
-					display: flex;
-					align-items: center;
-					background-color: #FFF;
-					height: 80rpx;
-					// margin: 10rpx 0 0 0;
-					padding: 10rpx 0 0 20rpx;
-
-					.key {
-						width: 30%;
-						// font-weight: 700;
-					}
-
-					.value {
-						width: 70%;
-						border-radius: 10rpx;
-						overflow: hidden;
-
-
-						input {
-							background-color: #FFF;
-							font-size: 28rpx;
-							padding: 16rpx 8rpx 16rpx 15rpx;
-						}
-					}
-				}
-
-				.currentRegion {
-					display: flex;
-					align-items: center;
-					background-color: #FFF;
-					height: 80rpx;
-					// margin: 10rpx 0 0 0;
-					padding: 10rpx 0 0 20rpx;
-
-					>view:nth-of-type(1) {
-						width: 30%;
-						// font-weight: 700;
-					}
-
-					>view:nth-of-type(2) {
-						width: 70%;
-						padding: 0 20rpx 0 0;
-						display: flex;
-
-						.input {
-							background-color: #f5f5f5;
-							// color: #a4a4a4;
-							font-size: 28rpx;
-							padding: 8rpx 8rpx 8rpx 15rpx;
-							width: 350rpx;
-						}
-
-						.orientation {
-							display: flex;
-							padding: 10rpx 10rpx 10rpx 20rpx;
-							font-size: 30rpx;
-							color: #FBAB32;
-							flex-direction: column;
-							justify-content: center;
-							align-items: center;
-						}
-
-
-					}
-				}
-
-			}
-		}
-	}
+.page {
+  height: 100vh;
+
+  .frame {
+    background-color: #FFF;
+
+    .title {
+      display: flex;
+      font-size: 30rpx;
+      font-weight: 700;
+      padding: 0rpx 0 0rpx 20rpx;
+      margin: 20rpx 0 0 0;
+
+      > span:nth-of-type(1) {
+        margin: 4rpx 0 0 8rpx;
+        background-color: #FFF;
+      }
+
+      > span:nth-of-type(2) {
+        margin: 0 0 0 8rpx;
+        background-color: #FFF;
+      }
+    }
+
+    .basic-info {
+      display: flex;
+      flex-direction: column;
+      gap: 10rpx;
+      //margin-top: 20rpx;
+      padding: 20rpx 20rpx 20rpx 20rpx;
+
+
+      .addressA {
+        display: flex;
+        align-items: center;
+        background-color: #FFF;
+        height: 80rpx;
+        // margin: 10rpx 0 0 0;
+        //padding: 10rpx 0 0 20rpx;
+
+        .title {
+          display: flex;
+          align-items: center;
+          justify-content: flex-start;
+          font-weight: 400;
+          width: 30%;
+        }
+
+        .address {
+          width: 70%;
+          display: flex;
+          padding: 20rpx;
+          background-color: #fff;
+
+          image {
+            width: 30rpx;
+            height: 30rpx;
+            margin: 10rpx;
+          }
+
+          view {
+
+            //margin: 20rpx;
+            overflow: hidden; //超出的文本隐藏
+            text-overflow: ellipsis; //溢出用省略号显示
+            white-space: nowrap; //溢出不换行
+          }
+
+          .icon {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            margin-left: auto;
+          }
+        }
+      }
+
+
+      .delivery-date {
+        display: flex;
+        align-items: center;
+        background-color: #FFF;
+        height: 80rpx;
+        // margin: 10rpx 0 0 0;
+        padding: 10rpx 0 0 20rpx;
+
+        > view:nth-of-type(1) {
+          width: 30%;
+          // font-weight: 700;
+        }
+
+
+        .value {
+          width: 70%;
+          border-radius: 10rpx;
+          overflow: hidden;
+
+          .dateTimeCls {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            width: 100%;
+            height: 80%;
+            //border: 1px solid #b0b2b3;
+            padding: 5rpx;
+            border-radius: 20rpx;
+
+            .date {
+              font-size: 30rpx;
+              display: flex;
+              align-items: center;
+              width: 80%;
+              height: 100%;
+              color: #000;
+
+            }
+
+            .img {
+              display: flex;
+              justify-content: center;
+              align-items: center;
+              //margin-left: 50rpx;
+              width: 20%;
+              //height: 100%;
+            }
+          }
+
+        }
+
+
+      }
+
+      .tentativeQuantity {
+        display: flex;
+        align-items: center;
+        background-color: #FFF;
+        height: 80rpx;
+        // margin: 10rpx 0 0 0;
+        padding: 10rpx 0 0 20rpx;
+
+        .key {
+          width: 30%;
+        }
+
+        .value {
+          width: 70%;
+          border-radius: 10rpx;
+          overflow: hidden;
+        }
+
+      }
+
+
+      .Tip {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+
+        .span {
+          color: #999;
+          font-size: 24rpx;
+        }
+      }
+
+      .btns {
+        width: 100%;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        gap: 20rpx;
+
+        .ljxd {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          width: 500rpx;
+          height: 70rpx;
+          border-radius: 40rpx;
+          color: #FFF;
+          font-size: 28rpx;
+          margin: 20rpx 10rpx 0 0;
+          background: $uni-color;
+          //margin-top: 20rpx;
+          border-radius: 40rpx;
+        }
+
+        .lxwm {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          width: 500rpx;
+          height: 70rpx;
+          border-radius: 40rpx;
+          color: #000000;
+          font-size: 28rpx;
+          margin: 20rpx 10rpx 0 0;
+          background: #f1f1f1;
+          //margin-top: 20rpx;
+          border-radius: 40rpx;
+        }
+
+        .tip {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          font-size: 24rpx;
+          color: #999;
+          //width: 500rpx;
+        }
+      }
+
+      .item {
+        display: flex;
+        align-items: center;
+        background-color: #FFF;
+        height: 80rpx;
+        // margin: 10rpx 0 0 0;
+        padding: 10rpx 0 0 20rpx;
+
+        > view:nth-of-type(1) {
+          width: 30%;
+          // font-weight: 700;
+        }
+
+        > view:nth-of-type(2) {
+          width: 70%;
+          border-radius: 10rpx;
+          overflow: hidden;
+
+
+          input {
+            background-color: #FFF;
+            font-size: 28rpx;
+            padding: 16rpx 8rpx 16rpx 15rpx;
+          }
+        }
+      }
+
+      .performanceBond {
+        display: flex;
+        align-items: center;
+        background-color: #FFF;
+        height: 80rpx;
+        // margin: 10rpx 0 0 0;
+        padding: 10rpx 0 0 20rpx;
+
+        .key {
+          width: 30%;
+          // font-weight: 700;
+        }
+
+        .value {
+          width: 70%;
+          border-radius: 10rpx;
+          overflow: hidden;
+
+
+          input {
+            background-color: #FFF;
+            font-size: 28rpx;
+            padding: 16rpx 8rpx 16rpx 15rpx;
+          }
+        }
+      }
+
+      .currentRegion {
+        display: flex;
+        align-items: center;
+        background-color: #FFF;
+        height: 80rpx;
+        // margin: 10rpx 0 0 0;
+        padding: 10rpx 0 0 20rpx;
+
+        > view:nth-of-type(1) {
+          width: 30%;
+          // font-weight: 700;
+        }
+
+        > view:nth-of-type(2) {
+          width: 70%;
+          padding: 0 20rpx 0 0;
+          display: flex;
+
+          .input {
+            background-color: #f5f5f5;
+            // color: #a4a4a4;
+            font-size: 28rpx;
+            padding: 8rpx 8rpx 8rpx 15rpx;
+            width: 350rpx;
+          }
+
+          .orientation {
+            display: flex;
+            padding: 10rpx 10rpx 10rpx 20rpx;
+            font-size: 30rpx;
+            color: #FBAB32;
+            flex-direction: column;
+            justify-content: center;
+            align-items: center;
+          }
+
+
+        }
+      }
+
+    }
+  }
+}
 </style>
\ No newline at end of file