WIN-2CJ8FMUT9OF\Administrator 7 ماه پیش
والد
کامیت
c36eb5b6b7

+ 2 - 2
.env.dev.js

@@ -1,6 +1,6 @@
 const config = {
-	baseUrl: 'http://testfood.jhcs888.com',
-	socketUrl: 'http://testfood.jhcs888.com',
+	baseUrl: 'http://testfood.jhcs888.com/',
+	socketUrl: 'http://testfood.jhcs888.com/',
     appName:'开发环境'
 }
 module.exports = config;

+ 365 - 305
common/css/common.css

@@ -1,1079 +1,1139 @@
 body {
-  background-color: #fff;
+	background-color: #fff;
 }
 
 view,
 text {
-  font-size: 24rpx;
-  color: #333;
+	font-size: 24rpx;
+	color: #333;
 }
 
 /* 隐藏scroll-view 滚动条 */
 ::-webkit-scrollbar {
-  display: none;
+	display: none;
 }
 
-.overf-h{
-  overflow: hidden;
+.overf-h {
+	overflow: hidden;
 }
 
 .iPhone-bottom {
-  padding-bottom: constant(safe-area-inset-bottom);
-  padding-bottom: env(safe-area-inset-bottom);
+	padding-bottom: constant(safe-area-inset-bottom);
+	padding-bottom: env(safe-area-inset-bottom);
 }
 
 /* 不换行 */
 .view-nowrap {
-  white-space: nowrap;
+	white-space: nowrap;
 }
 
 .z-index-max {
-  position: relative;
-  z-index: 99999;
+	position: relative;
+	z-index: 99999;
 }
 
 /* 自动换行 */
 .view-word-wrap {
-  white-space: pre-wrap;
-  word-wrap: break-word;
+	white-space: pre-wrap;
+	word-wrap: break-word;
 }
 
 /*超出三行... */
 .text-overflow-ellipsis-t {
-  text-overflow: -o-ellipsis-lastline;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  display: -webkit-box;
-  -webkit-line-clamp: 3;
-  line-clamp: 3;
-  -webkit-box-orient: vertical;
-  white-space: pre-wrap;
-  word-wrap: break-word;
+	text-overflow: -o-ellipsis-lastline;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	display: -webkit-box;
+	-webkit-line-clamp: 3;
+	line-clamp: 3;
+	-webkit-box-orient: vertical;
+	white-space: pre-wrap;
+	word-wrap: break-word;
 }
 
 /*超出两行... */
 .text-overflow-ellipsis {
-  text-overflow: -o-ellipsis-lastline;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  line-clamp: 2;
-  -webkit-box-orient: vertical;
-  white-space: pre-wrap;
-  word-wrap: break-word;
+	text-overflow: -o-ellipsis-lastline;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	display: -webkit-box;
+	-webkit-line-clamp: 2;
+	line-clamp: 2;
+	-webkit-box-orient: vertical;
+	white-space: pre-wrap;
+	word-wrap: break-word;
 }
 
 /*超出一行... */
 .text-overflow-ellipsis-one {
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-  word-break: break-all;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+	overflow: hidden;
+	word-break: break-all;
 }
 
 /* 内部盒子 */
 .box-border-box {
-  box-sizing: border-box;
+	box-sizing: border-box;
 }
 
 .flex-common-css {
-  width: 100%;
-  height: 100vh;
-  display: flex;
-  flex-direction: column;
+	width: 100%;
+	height: 100vh;
+	display: flex;
+	flex-direction: column;
 }
 
 .flex-index-css {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
+	width: 100%;
+	height: 100%;
+	display: flex;
+	flex-direction: column;
 }
 
 .flex-direction {
-  display: flex;
-  flex-direction: column;
+	display: flex;
+	flex-direction: column;
 }
 
 .display-flex {
-  display: flex;
+	display: flex;
 }
 
 .flex-justify-space {
-  display: flex;
-  justify-content: space-between;
+	display: flex;
+	justify-content: space-between;
 }
 
 .flex-justify-around {
-  display: flex;
-  justify-content: space-around;
+	display: flex;
+	justify-content: space-around;
 }
 
 .flex-justify-center {
-  display: flex;
-  justify-content: center;
+	display: flex;
+	justify-content: center;
 }
 
 .flex-justify-end {
-  display: flex;
-  justify-content: flex-end;
+	display: flex;
+	justify-content: flex-end;
 }
 
 .flex-justify-start {
-  display: flex;
-  justify-content: flex-start;
+	display: flex;
+	justify-content: flex-start;
 }
 
 .align-items-center {
-  display: flex;
-  align-items: center;
+	display: flex;
+	align-items: center;
 }
 
 .align-items-baseline {
-  display: flex;
-  align-items: baseline;
+	display: flex;
+	align-items: baseline;
 }
 
 .align-items-flex-end {
-  display: flex;
-  align-items: flex-end;
+	display: flex;
+	align-items: flex-end;
 }
 
 .align-items-flex-start {
-  display: flex;
-  align-items: flex-start;
+	display: flex;
+	align-items: flex-start;
 }
 
 .align-self-flex-end {
-  display: flex;
-  align-self: flex-end;
+	display: flex;
+	align-self: flex-end;
 }
 
 .flex-wrap-wrap {
-  display: flex;
-  flex-wrap: wrap;
+	display: flex;
+	flex-wrap: wrap;
 }
 
 .common-view-css {
-  width: 100%;
-  flex: 1;
+	width: 100%;
+	flex: 1;
 }
 
 .scroll-view-css {
-  width: 100%;
-  flex: 1;
-  overflow: auto;
+	width: 100%;
+	flex: 1;
+	overflow: auto;
 }
 
 .box-sizing-border {
-  box-sizing: border-box;
+	box-sizing: border-box;
 }
 
 .text-align-center {
-  text-align: center;
+	text-align: center;
 }
 
 .text-align-right {
-  text-align: right;
+	text-align: right;
 }
 
 .text-align-left {
-  text-align: left;
+	text-align: left;
 }
 
 .letter-spacing-6 {
-  letter-spacing: 6rpx;
+	letter-spacing: 6rpx;
 }
 
 .letter-spacing-3 {
-  letter-spacing: 3rpx;
+	letter-spacing: 3rpx;
 }
 
 .flex-1 {
-  flex: 1;
+	flex: 1;
 }
 
 .flex-shrink0 {
-  flex-shrink: 0;
+	flex-shrink: 0;
+}
+
+.opacity-4 {
+	opacity: 0.4;
 }
 
 .z-3 {
-  position: relative;
-  z-index: 3;
+	position: relative;
+	z-index: 3;
 }
+
 .z-4 {
-  position: relative;
-  z-index: 4;
+	position: relative;
+	z-index: 4;
 }
+
 /* 字体大小 */
 .fs-18 {
-  font-size: 18rpx;
+	font-size: 18rpx;
 }
 
 .fs-20 {
-  font-size: 20rpx;
+	font-size: 20rpx;
 }
 
 .fs-22 {
-  font-size: 22rpx;
+	font-size: 22rpx;
 }
 
 .fs-24 {
-  font-size: 24rpx;
+	font-size: 24rpx;
 }
 
 .fs-26 {
-  font-size: 26rpx;
+	font-size: 26rpx;
 }
 
 .fs-28 {
-  font-size: 28rpx;
+	font-size: 28rpx;
 }
 
 .fs-30 {
-  font-size: 30rpx;
+	font-size: 30rpx;
 }
 
 .fs-32 {
-  font-size: 32rpx;
+	font-size: 32rpx;
 }
 
 .fs-34 {
-  font-size: 34rpx;
+	font-size: 34rpx;
 }
 
 .fs-36 {
-  font-size: 36rpx;
+	font-size: 36rpx;
 }
 
 .fs-38 {
-  font-size: 38rpx;
+	font-size: 38rpx;
 }
 
 .fs-40 {
-  font-size: 40rpx;
+	font-size: 40rpx;
 }
 
 .fs-44 {
-  font-size: 44rpx;
+	font-size: 44rpx;
 }
 
 .fs-48 {
-  font-size: 48rpx;
+	font-size: 48rpx;
 }
 
 .fs-64 {
-  font-size: 64rpx;
+	font-size: 64rpx;
 }
 
 .fs-52 {
-  font-size: 52rpx
+	font-size: 52rpx
 }
 
 /* 字体下面横线 */
 .text-underline {
-  text-decoration: underline;
+	text-decoration: underline;
 }
 
 /* 字体中间横线 */
 .text-line-through {
-  text-decoration: line-through
+	text-decoration: line-through
 }
 
 /* 斜体 */
 .fs-i {
-  font-style: italic;
+	font-style: italic;
 }
 
 /* 字间距 */
 .l-s-2 {
-  letter-spacing: 4rpx;
+	letter-spacing: 4rpx;
 }
 
 /* 字体粗细 */
 .fw-b {
-  font-weight: bold;
+	font-weight: bold;
 }
 
 .fw-400 {
-  font-weight: 400;
+	font-weight: 400;
 }
 
 .fw-500 {
-  font-weight: 500;
+	font-weight: 500;
 }
 
 .fw-600 {
-  font-weight: 600;
+	font-weight: 600;
 }
 
 /* 字体颜色 */
 .fc-f {
-  color: #fff;
+	color: #fff;
 }
 
 .fc-0 {
-  color: #000;
+	color: #000;
 }
 
 .fc-213C45 {
-  color: #213C45;
+	color: #213C45;
 }
 
 .fc-3 {
-  color: #333;
+	color: #333;
 }
 
 .fc-a {
-  color: #aaa;
+	color: #aaa;
 }
 
-
 .fc-6 {
-  color: #666;
+	color: #666;
 }
 
 .fc-94969A {
-  color: #94969A;
+	color: #94969A;
 }
 
 .fc-9198A2 {
-  color: #9198A2;
+	color: #9198A2;
 }
 
 .fc-9 {
-  color: #999;
+	color: #999;
+}
+
+.fc-7 {
+	color: #777;
 }
 
 .fc-3BB5FE {
-  color: #3BB5FE;
+	color: #3BB5FE;
 }
 
 .fc-41ABF5 {
-  color: #41ABF5;
+	color: #41ABF5;
 }
 
 .fc-1089D1 {
-  color: #1089D1;
+	color: #1089D1;
 }
 
 .fc-57CAFF {
-  color: #57CAFF;
+	color: #57CAFF;
 }
 
 .fc-96ECFB {
-  color: #96ECFB;
+	color: #96ECFB;
 }
 
 .fc-4495FD {
-  color: #4495FD;
+	color: #4495FD;
 }
 
 .fc-FD5D05 {
-  color: #FD5D05;
+	color: #FD5D05;
 }
 
 .fc-FF6320 {
-  color: #FF6320;
+	color: #FF6320;
 }
 
 .fc-FB4845 {
-  color: #FB4845;
+	color: #FB4845;
 }
 
 .fc-FB3D03 {
-  color: #ff3422;
+	color: #ff3422;
 }
 
 .fc-F6ABAC {
-  color: #F6ABAC;
+	color: #F6ABAC;
 }
 
 .fc-ff3939 {
-  color: #ff3939;
+	color: #ff3939;
 }
 
 .fc-FC4642 {
-  color: #FC4642;
+	color: #FC4642;
 }
 
 .fc-F93435 {
-  color: #F93435;
+	color: #F93435;
 }
 
 .fc-F43D04 {
-  color: #F43D04;
+	color: #F43D04;
 }
 
 .fc-F0372F {
-  color: #F0372F;
+	color: #F0372F;
 }
 
 .fc-F75820 {
-  color: #F75820;
+	color: #F75820;
 }
 
 .fc-F5531E {
-  color: #F5531E;
+	color: #F5531E;
 }
 
 .fc-FF7F00 {
-  color: #FF7F00;
+	color: #FF7F00;
 }
 
 .fc-FD5C02 {
-  color: #FD5C02;
+	color: #FD5C02;
 }
 
 .fc-F7663A {
-  color: #F7663A;
+	color: #F7663A;
 }
 
 .fc-ED301D {
-  color: #ED301D;
+	color: #ED301D;
 }
 
 .fc-F6531E {
-  color: #F6531E;
+	color: #F6531E;
+}
+.fc-FF3333 {
+	color: #FF3333;
 }
-
 
 .fc-FF5022 {
-  color: #FF5022;
+	color: #FF5022;
 }
 
 .fc-ADADAD {
-  color: #ADADAD;
+	color: #ADADAD;
 }
 
 .fc-65420c {
-  color: #65420c;
+	color: #65420c;
 }
 
 .fc-FE9E11 {
-  color: #FE9E11;
+	color: #FE9E11;
 }
 
 .fc-FCFBF8 {
-  color: #FCFBF8;
+	color: #FCFBF8;
 }
 
 /* 背景颜色 */
 .bgc-f {
-  background-color: #fff;
+	background-color: #fff;
 }
 
 .bgc-3 {
-  background-color: #333;
+	background-color: #333;
 }
 
 .bgc-3-6 {
-  background-color: rgba(51, 51, 51, .6);
+	background-color: rgba(51, 51, 51, .6);
 }
 
 .bgc-9 {
-  background-color: #999;
+	background-color: #999;
 }
 
 .bgc-D9D9D9 {
-  background-color: #D9D9D9;
+	background-color: #D9D9D9;
 }
 
 .bgc-4FB3EF {
-  background-color: #4FB3EF;
+	background-color: #4FB3EF;
 }
 
 .bgc-5CC2FF {
-  background-color: #5CC2FF;
+	background-color: #5CC2FF;
 }
 
 .bgc-41ABF5 {
-  background-color: #41ABF5;
+	background-color: #41ABF5;
 }
 
 .bgc-E4F3FD {
-  background-color: #E4F3FD;
+	background-color: #E4F3FD;
 }
 
 .bgc-BCEAFF {
-  background-color: #BCEAFF;
+	background-color: #BCEAFF;
 }
 
 .bgc-B3DDFB {
-  background-color: #B3DDFB;
+	background-color: #B3DDFB;
 }
 
 .bgc-ECF7FE {
-  background-color: #ECF7FE;
+	background-color: #ECF7FE;
 }
 
 .bgc-FCE7E2 {
-  background-color: #FCE7E2;
+	background-color: #FCE7E2;
 }
 
 .bgc-F5F5F6 {
-  background-color: #F5F5F6;
+	background-color: #F5F5F6;
 }
 
 .bgc-F4F5F7 {
-  background-color: #F4F5F7;
+	background-color: #F4F5F7;
+}
+
+.bgc-F5F5F5 {
+	background-color: #F5F5F5;
 }
 
 .bgc-F2F2F2 {
-  background-color: #F2F2F2;
+	background-color: #F2F2F2;
 }
 
 .bgc-E6E6E6 {
-  background-color: #E6E6E6;
+	background-color: #E6E6E6;
 }
 
 .bgc-F6F6F6 {
-  background-color: #F6F6F6;
+	background-color: #F6F6F6;
+}
+
+.bgc-FAE9E9 {
+	background-color: #FAE9E9;
 }
 
 .bgc-F5541E {
-  background: linear-gradient(-90deg, #F5811E, #F5541E);
+	background: linear-gradient(-90deg, #F5811E, #F5541E);
 }
 
 .bgc-FF5555 {
-  background: linear-gradient(-90deg, #FF5555, #FF1111);
+	background: linear-gradient(-90deg, #FF5555, #FF1111);
 }
 
 .bgc-48D3C5 {
-  background: linear-gradient(-90deg, #48D3C5, #26B7A7);
+	background: linear-gradient(-90deg, #48D3C5, #26B7A7);
 }
 
 .bgc-4db8ff {
-  background: linear-gradient(-90deg, #4db8ff, #1aa3ff);
+	background: linear-gradient(-90deg, #4db8ff, #1aa3ff);
 }
 
 .bgc-46D1C2 {
-  background-color: #46D1C2;
+	background-color: #46D1C2;
 }
 
 .bgc-EDF6FF {
-  background-color: #EDF6FF;
+	background-color: #EDF6FF;
 }
 
 .bgc-FD492D {
-  background-color: #FD492D;
+	background-color: #FD492D;
 }
 
 .bgc-FF3E5D {
-  background-color: #FF3E5D;
+	background-color: #FF3E5D;
 }
 
 .bgc-EB5127 {
-  background-color: #EB5127;
+	background-color: #EB5127;
 }
 
 .bgc-FF3333 {
-  background-color: #FF3333;
+	background-color: #FF3333;
 }
 
 .bgc-FE6B2C {
-  background-color: #FE6B2C;
+	background-color: #FE6B2C;
 }
 
 .bgc-FCEDED {
-  background-color: #FCEDED;
+	background-color: #FCEDED;
 }
 
 .bgc-FAE5E2 {
-  background-color: #FAE5E2;
+	background-color: #FAE5E2;
 }
 
 .bgc-F7F8FA {
-  background-color: #F7F8FA;
+	background-color: #F7F8FA;
 }
 
 
 .bgc-F5811E {
-  background-color: #F5811E;
+	background-color: #F5811E;
 }
 
 .bgc-FFD977 {
-  background-color: #FFD977;
+	background-color: #FFD977;
 }
 
 .bgc-FDF3EC {
-  background-color: #FDF3EC;
+	background-color: #FDF3EC;
 }
 
 .bgc-16BB5D {
-  background-color: #16BB5D;
+	background-color: #16BB5D;
 }
 
 
 .bgc-F5F4F9 {
-  background-color: #F5F4F9;
+	background-color: #F5F4F9;
 }
 
 .bgc-F3F4F6 {
-  background-color: #F3F4F6;
+	background-color: #F3F4F6;
+}
+
+.bgc-FDFDFD {
+	background-color: #FDFDFD;
 }
 
+.bgc-ECECEC {
+	background-color: #ECECEC;
+}
+
+
 .bgc-D5EDFB {
-  background-color: #D5EDFB;
+	background-color: #D5EDFB;
 }
 
 .b-t-F9F9F9 {
-  border-top: 1rpx solid #F9F9F9;
+	border-top: 1rpx solid #F9F9F9;
 }
 
 .b-b-F9F9F9 {
-  border-bottom: 1rpx solid #F9F9F9;
+	border-bottom: 1rpx solid #F9F9F9;
 }
 
 .b-b-eee {
-  border-bottom: .5rpx solid #eee;
+	border-bottom: .5rpx solid #eee;
 }
 
 .b-b-999 {
-  border-bottom: 1rpx solid #999;
+	border-bottom: 1rpx solid #999;
 }
 
 .b-b-EAEAEC {
-  border-bottom: 1rpx solid #EAEAEC;
+	border-bottom: 1rpx solid #EAEAEC;
 }
 
 .b-b-EDEDF1 {
-  border-bottom: 1rpx solid #EDEDF1;
+	border-bottom: 1rpx solid #EDEDF1;
 }
 
 .b-r-ccc {
-  border: 1rpx solid #ccc;
+	border: 1rpx solid #ccc;
 }
 
 
 /* 圆角 */
 .b-rad-5 {
-  border-radius: 5rpx;
+	border-radius: 5rpx;
 }
 
 .b-rad-12 {
-  border-radius: 12rpx;
+	border-radius: 12rpx;
 }
 
 .b-rad-16 {
-  border-radius: 16rpx;
+	border-radius: 16rpx;
 }
 
 .b-rad-20 {
-  border-radius: 20rpx;
+	border-radius: 20rpx;
 }
 
 .b-rad-24 {
-  border-radius: 24rpx;
+	border-radius: 24rpx;
 }
 
 .b-rad-20-20-0-0 {
-  border-radius: 20rpx 20rpx 0 0;
+	border-radius: 20rpx 20rpx 0 0;
+}
+
+.b-rad-24-24-0-0 {
+	border-radius: 24rpx 24rpx 0 0;
+}
+
+.b-rad-32 {
+	border-radius: 32rpx;
 }
 
 .b-rad-200 {
-  border-radius: 200rpx;
+	border-radius: 200rpx;
 }
 
 .b-rad-50 {
-  border-radius: 50%;
+	border-radius: 50%;
 }
 
 /* 内边距 */
 .p-8 {
-  padding: 8rpx;
+	padding: 8rpx;
 }
 
 .p-12 {
-  padding: 12rpx;
+	padding: 12rpx;
 }
 
 .p-16 {
-  padding: 16rpx;
+	padding: 16rpx;
 }
 
 .p-20 {
-  padding: 20rpx;
+	padding: 20rpx;
 }
 
 .p-24 {
-  padding: 24rpx;
+	padding: 24rpx;
 }
 
 .p-30 {
-  padding: 30rpx;
+	padding: 30rpx;
 }
 
 .p-32 {
-  padding: 32rpx;
+	padding: 32rpx;
 }
 
 .pr-8 {
-  padding-right: 8rpx;
+	padding-right: 8rpx;
 }
 
 .pr-14 {
-  padding-right: 14rpx;
+	padding-right: 14rpx;
 }
 
 .pt-48 {
-  padding-top: 48rpx;
+	padding-top: 48rpx;
 }
 
 .p-t-4 {
-  padding-top: 4rpx;
+	padding-top: 4rpx;
 }
 
 .p-t-10 {
-  padding-top: 10rpx;
+	padding-top: 10rpx;
 }
 
 .p-t-20 {
-  padding-top: 20rpx;
+	padding-top: 20rpx;
 }
 
 .pt-15 {
-  padding-top: 15rpx;
+	padding-top: 15rpx;
+}
+
+.pt-20 {
+	padding-top: 20rpx;
 }
 
 .pt-33 {
-  padding-top: 33rpx;
+	padding-top: 33rpx;
 }
 
 .pt-40 {
-  padding-top: 40rpx;
+	padding-top: 40rpx;
 }
 
 .p-t-80 {
-  padding-top: 80rpx;
+	padding-top: 80rpx;
 }
 
 .pb-5 {
-  padding-bottom: 5rpx;
+	padding-bottom: 5rpx;
 }
 
 .pb-10 {
-  padding-bottom: 10rpx;
+	padding-bottom: 10rpx;
 }
 
 .p-b-20 {
-  padding-bottom: 20rpx;
+	padding-bottom: 20rpx;
 }
 
 .pb-36 {
-  padding-bottom: 36rpx;
+	padding-bottom: 36rpx;
 }
+
 .pb-130 {
-  padding-bottom: 130rpx;
+	padding-bottom: 130rpx;
 }
+
 .plr-12 {
-  padding: 0 12rpx;
+	padding: 0 12rpx;
+}
+
+.plr-16 {
+	padding: 0 16rpx;
 }
 
 .plr-10 {
-  padding: 0 10rpx;
+	padding: 0 10rpx;
 }
 
 .plr-24 {
-  padding: 0 24rpx;
+	padding: 0 24rpx;
 }
 
 .plr-30 {
-  padding: 0 30rpx;
+	padding: 0 30rpx;
 }
 
 .plr-32 {
-  padding: 0 32rpx;
+	padding: 0 32rpx;
 }
 
 .p-12-30 {
-  padding: 12rpx 30rpx;
+	padding: 12rpx 30rpx;
 }
 
 .p-40-32 {
-  padding: 40rpx 32rpx;
+	padding: 40rpx 32rpx;
 }
 
 .p-20-32 {
-  padding: 20rpx 32rpx;
+	padding: 20rpx 32rpx;
 }
 
 .p-40-32-16 {
-  padding: 40rpx 32rpx 16rpx;
+	padding: 40rpx 32rpx 16rpx;
+}
+
+.p-32-32-0 {
+	padding: 32rpx 32rpx 0;
 }
 
 .p-0-32-12 {
-  padding: 0 32rpx 12rpx;
+	padding: 0 32rpx 12rpx;
 }
 
 .ptb-15 {
-  padding: 15rpx 0;
+	padding: 15rpx 0;
 }
 
 .ptb-22 {
-  padding: 22rpx 0;
+	padding: 22rpx 0;
 }
 
 .ptb-24 {
-  padding: 24rpx 0;
+	padding: 24rpx 0;
 }
 
 .ptb-30 {
-  padding: 30rpx 0;
+	padding: 30rpx 0;
 }
 
 .p-12-24 {
-  padding: 12rpx 24rpx;
+	padding: 12rpx 24rpx;
 }
 
 .p-28-20-39 {
-  padding: 28rpx 20rpx 39rpx
+	padding: 28rpx 20rpx 39rpx
 }
 
 .p-38-20-24 {
-  padding: 38rpx 20rpx 24rpx;
+	padding: 38rpx 20rpx 24rpx;
 }
 
 .pl-15 {
-  padding-left: 15rpx;
+	padding-left: 15rpx;
 }
 
 .pl-24 {
-  padding-left: 24rpx;
+	padding-left: 24rpx;
 }
 
-.pl-42 {
-  padding-left: 42rpx;
+.pl-32 {
+	padding-left: 24rpx;
+}
+
+.pl-32 {
+	padding-left: 42rpx;
 }
 
 
 .pr-24 {
-  padding-right: 24rpx;
+	padding-right: 24rpx;
 }
 
 /* 外边距 */
 .m-24 {
-  margin: 24rpx;
+	margin: 24rpx;
 }
 
 .mt-4 {
-  margin-top: 4rpx;
+	margin-top: 4rpx;
 }
 
 .mt-5 {
-  margin-top: 5rpx;
+	margin-top: 5rpx;
 }
 
 .mt-20 {
-  margin-top: 20rpx;
+	margin-top: 20rpx;
 }
 
 .mt-24 {
-  margin-top: 24rpx;
+	margin-top: 24rpx;
 }
 
 .ml-2 {
-  margin-left: 2rpx;
+	margin-left: 2rpx;
 }
 
 .ml-8 {
-  margin-left: 8rpx;
+	margin-left: 8rpx;
 }
 
 .ml-10 {
-  margin-left: 10rpx;
+	margin-left: 10rpx;
 }
 
 .ml-16 {
-  margin-left: 16rpx;
+	margin-left: 16rpx;
 }
 
 .ml-40 {
-  margin-left: 40rpx;
+	margin-left: 40rpx;
 }
 
 .mr-4 {
-  margin-right: 4rpx;
+	margin-right: 4rpx;
 }
 
 .mr-6 {
-  margin-right: 6rpx;
+	margin-right: 6rpx;
 }
 
 .mr-8 {
-  margin-right: 8rpx;
+	margin-right: 8rpx;
 }
 
 .mr-10 {
-  margin-right: 10rpx;
+	margin-right: 10rpx;
 }
 
 .mr-12 {
-  margin-right: 12rpx;
+	margin-right: 12rpx;
 }
 
 .mr-14 {
-  margin-right: 14rpx;
+	margin-right: 14rpx;
 }
 
 .mr-16 {
-  margin-right: 16rpx;
+	margin-right: 16rpx;
 }
 
 .mr-18 {
-  margin-right: 18rpx;
+	margin-right: 18rpx;
 }
 
 .mr-20 {
-  margin-right: 20rpx;
+	margin-right: 20rpx;
 }
 
 .mr-24 {
-  margin-right: 24rpx;
+	margin-right: 24rpx;
 }
 
 .mr-30 {
-  margin-right: 30rpx;
+	margin-right: 30rpx;
 }
 
 .mr-36 {
-  margin-right: 36rpx;
+	margin-right: 36rpx;
 }
 
 .mr-40 {
-  margin-right: 40px;
+	margin-right: 40px;
 }
 
 .mr-46 {
-  margin-right: 46rpx;
+	margin-right: 46rpx;
 }
 
 .mr-50 {
-  margin-right: 50rpx;
+	margin-right: 50rpx;
 }
 
 .mr-64 {
-  margin-right: 64rpx;
+	margin-right: 64rpx;
 }
 
 .mb-2 {
-  margin-bottom: 2rpx;
+	margin-bottom: 2rpx;
 }
 
 .mb-4 {
-  margin-bottom: 4rpx;
+	margin-bottom: 4rpx;
 }
 
 .mb-8 {
-  margin-bottom: 8rpx;
+	margin-bottom: 8rpx;
 }
 
 .mb-10 {
-  margin-bottom: 10rpx;
+	margin-bottom: 10rpx;
 }
 
 .mb-12 {
-  margin-bottom: 12rpx;
+	margin-bottom: 12rpx;
 }
 
 .mb-16 {
-  margin-bottom: 16rpx;
+	margin-bottom: 16rpx;
 }
 
 .mb-18 {
-  margin-bottom: 18rpx;
+	margin-bottom: 18rpx;
 }
 
 .mb-20 {
-  margin-bottom: 20rpx;
+	margin-bottom: 20rpx;
 }
 
 .mb-22 {
-  margin-bottom: 22rpx;
+	margin-bottom: 22rpx;
 }
 
 .mb-24 {
-  margin-bottom: 24rpx;
+	margin-bottom: 24rpx;
 }
 
 .mb-26 {
-  margin-bottom: 26rpx;
+	margin-bottom: 26rpx;
 }
 
 .mb-28 {
-  margin-bottom: 28rpx;
+	margin-bottom: 28rpx;
 }
 
 .mb-30 {
-  margin-bottom: 30rpx;
+	margin-bottom: 30rpx;
 }
 
 .mb-32 {
-  margin-bottom: 32rpx;
+	margin-bottom: 32rpx;
 }
 
 .mb-40 {
-  margin-bottom: 40rpx;
+	margin-bottom: 40rpx;
 }
 
 .mb-48 {
-  margin-bottom: 48rpx;
+	margin-bottom: 48rpx;
 }
 
 .mb-50 {
-  margin-bottom: 50rpx;
+	margin-bottom: 50rpx;
 }
 
 .mb-52 {
-  margin-bottom: 52rpx;
+	margin-bottom: 52rpx;
 }
 
 .mb-60 {
-  margin-bottom: 60rpx;
+	margin-bottom: 60rpx;
 }
 
 .mb-64 {
-  margin-bottom: 64rpx;
+	margin-bottom: 64rpx;
 }
 
 .mb-80 {
-  margin-bottom: 80rpx;
+	margin-bottom: 80rpx;
 }
 
 /* 宽度 */
 .w-100 {
-  width: 100rpx;
+	width: 100rpx;
 }
 
 .w-200 {
-  width: 200rpx;
+	width: 200rpx;
 }
 
 .w-10030 {
-  width: 30%;
+	width: 30%;
 }
 
 .w-100100 {
-  width: 100%;
+	width: 100%;
 }
 
 .b-b-F0 {
-  border-bottom: 1rpx solid #F0F0F0;
+	border-bottom: 1rpx solid #F0F0F0;
 }
 
 .b-b-EFF2F5 {
-  border-bottom: 1rpx solid #EFF2F5;
+	border-bottom: 1rpx solid #EFF2F5;
 }
 
 .b-b-eee {
-  border-bottom: 1rpx solid #eee;
+	border-bottom: 1rpx solid #eee;
 }
 
-.b-F5541E {
-  border: 1rpx solid #F5541E;
+.b-t-eee {
+	border-top: 1rpx solid #eee;
 }
 
-.b-FFD7CC {
-  border: 2rpx solid #FFD7CC;
+.b-F5541E {
+	border: 1rpx solid #F5541E;
 }
+.b-FF3333 {
+	border: 1rpx solid #FF3333;
+}
+.b-FFD7CC {
+	border: 2rpx solid #FFD7CC;
+}

+ 5 - 1
components/en-utils/en-blank/en-blank.vue

@@ -1,5 +1,5 @@
 <template>
-	<view class="blank-page" v-if="showBlank">
+	<view class="blank-page" :style="{backgroundColor:navBackgroundColor}" v-if="showBlank">
 		<view class="blank-img-box">
 			<image src="@/static/img/blank/no-goods.png" mode=""></image>
 		</view>
@@ -28,6 +28,10 @@
 				type: Boolean,
 				default: true
 			},
+			navBackgroundColor: {
+				type: String,
+				default: '#fff'
+			},
 			message: {
 				type: String,
 				default: '暂无数据!'

+ 292 - 276
components/en-utils/new-nav/new-nav.vue

@@ -1,300 +1,316 @@
 <template>
-  <view>
-    <!-- 微信小程序头部导航栏 -->
-    <!-- #ifdef MP-WEIXIN -->
-    <view class="wx-head-mod" :style="{height:navHeight+'rpx',backgroundColor:navBackgroundColor}">
-      <view class="wx-head-mod-nav" :style="{height:navigationBarHeight+'rpx',top:statusBarHeight+'rpx'}">
-        <view class="wx-head-mod-nav-content"
-          :style="{height:customHeight+'rpx',justifyContent:textAlign === 'center'?'center':'left'}">
-          <!-- 文本区 -->
-          <view v-if="textType" class="wx-head-mod-nav-content-mian"
-            :style="{width:navTextWidth,lineHeight:customHeight + 'rpx',paddingLeft:textPaddingLeft*scaleFactor+'rpx',fontSize:fontSize*scaleFactor+'rpx',fontWeight:fontWeight,color:titleColor}">
-            {{textContent}}
-          </view>
-          <view v-else :style="{width:navTextWidth}">
-          	<slot name="textContent"></slot>
-          </view>
-          <!-- 返回按钮 -->
-          <view v-if="leftShow" class="wx-head-mod-nav-content-back" :style="{display:isBackShow?'flex':'none'}" @click="backEvent">
-            <view class="wx-head-mod-nav-content-back-img"
-              :style="{width:backImageWidth*scaleFactor+'rpx',height:backImageHeight*scaleFactor+'rpx'}">
-              <uni-icons type="left" size="25" :color="leftIconColor"></uni-icons>
-              <!-- <image :src="backImageUrl" mode="" style="width: 100%;height: 100%;"></image> -->
-            </view>
-          </view>
-        </view>
-      </view>
-    </view>
-    <view :style="{height:navHeight+'rpx',backgroundColor:navBackgroundColor}">
-      
-    </view>
-    <!-- #endif -->
+	<view>
+		<!-- 微信小程序头部导航栏 -->
+		<!-- #ifdef MP-WEIXIN -->
+		<view class="wx-head-mod" :style="{height:navHeight+'rpx',backgroundColor:navBackgroundColor}">
+			<view class="wx-head-mod-nav" :style="{height:navigationBarHeight+'rpx',top:statusBarHeight+'rpx'}">
+				<view class="wx-head-mod-nav-content"
+					:style="{height:customHeight+'rpx',justifyContent:textAlign === 'center'?'center':'left'}">
+					<!-- 文本区 -->
+					<view v-if="textType" class="wx-head-mod-nav-content-mian"
+						:style="{width:navTextWidth,lineHeight:customHeight + 'rpx',paddingLeft:textPaddingLeft*scaleFactor+'rpx',fontSize:fontSize*scaleFactor+'rpx',fontWeight:fontWeight,color:titleColor}">
+						{{textContent}}
+					</view>
+					<view v-else :style="{width:navTextWidth}">
+						<slot name="textContent"></slot>
+					</view>
+					<!-- 返回按钮 -->
+					<view v-if="leftShow" class="wx-head-mod-nav-content-back"
+						:style="{display:isBackShow?'flex':'none'}" @click="backEvent">
+						<view class="wx-head-mod-nav-content-back-img"
+							:style="{width:backImageWidth*scaleFactor+'rpx',height:backImageHeight*scaleFactor+'rpx'}">
+							<uni-icons type="left" size="25" :color="leftIconColor"></uni-icons>
+							<!-- <image :src="backImageUrl" mode="" style="width: 100%;height: 100%;"></image> -->
+						</view>
+					</view>
+					<view v-else class="wx-head-mod-nav-content-back-slot" :style="{width:leftWidth}">
+						<slot name="leftContent"></slot>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view :style="{height:navHeight+'rpx',backgroundColor:navBackgroundColor}">
 
-    <!-- 除微信小程序之外的其他设备 -->
-    <!-- #ifndef MP-WEIXIN -->
-    <view class="other-head-mod"
-      :style="{height:navHeightValue*scaleFactor+statusBarHeight+'rpx',backgroundColor:navBackgroundColor}">
-      <view class="other-head-mod-mian"
-        :style="{height:navHeightValue*scaleFactor+'rpx',justifyContent:textAlign === 'center'?'center':'left'}">
-        <!-- 返回按钮 -->
-        <view class="other-head-mod-mian-back" v-show="isBackShow" @click="backEvent">
-          <view class="other-head-mod-mian-back-img"
-            :style="{width:backImageWidth*scaleFactor+'rpx',height:backImageHeight*scaleFactor+'rpx'}">
-            <image :src="backImageUrl" mode="" style="width: 100%;height: 100%;"></image>
-          </view>
-        </view>
-        <!-- 标题 -->
-        <view class="other-head-mod-mian-title" :style="{width:windowWidth - 184+'rpx',lineHeight:navHeightValue*scaleFactor+'rpx',
+		</view>
+		<!-- #endif -->
+
+		<!-- 除微信小程序之外的其他设备 -->
+		<!-- #ifndef MP-WEIXIN -->
+		<view class="other-head-mod"
+			:style="{height:navHeightValue*scaleFactor+statusBarHeight+'rpx',backgroundColor:navBackgroundColor}">
+			<view class="other-head-mod-mian"
+				:style="{height:navHeightValue*scaleFactor+'rpx',justifyContent:textAlign === 'center'?'center':'left'}">
+				<!-- 返回按钮 -->
+				<view class="other-head-mod-mian-back" v-show="isBackShow" @click="backEvent">
+					<view class="other-head-mod-mian-back-img"
+						:style="{width:backImageWidth*scaleFactor+'rpx',height:backImageHeight*scaleFactor+'rpx'}">
+						<image :src="backImageUrl" mode="" style="width: 100%;height: 100%;"></image>
+					</view>
+				</view>
+				<!-- 标题 -->
+				<view class="other-head-mod-mian-title" :style="{width:windowWidth - 184+'rpx',lineHeight:navHeightValue*scaleFactor+'rpx',
 					paddingLeft:textPaddingLeft*scaleFactor+'rpx',fontSize:fontSize*scaleFactor+'rpx',
 					fontWeight:fontWeight,color:titleColor}">
-          {{textContent}}
-        </view>
-      </view>
-    </view>
-    <!-- #endif -->
-  </view>
+					{{textContent}}
+				</view>
+			</view>
+		</view>
+		<!-- #endif -->
+	</view>
 </template>
 
 <script>
-  const app = getApp()
-  import {
-    systemInfo
-  } from '@/common/js/system-info.js'
-  export default {
-    name: "HeadView",
-    props: {
-      // 文本区域位置 left:左  center:中  
-      textAlign: {
-        type: String,
-        default: 'center'
-      },
-      // 文本区内容显示状态
-      textType: {
-        type: Boolean,
-        default: true
-      },
-      // 文本区内容
-      textContent: {
-        type: String,
-        default: '哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈就啊哈哈好借好还'
-      },
-      // 文本区离左边的距离
-      textPaddingLeft: {
-        type: Number,
-        default: 16
-      },
-      // 是否需要返回按钮
-      isBackShow: {
-        type: Boolean,
-        default: true
-      },
-      // 文本区字体大小
-      fontSize: {
-        type: Number,
-        default: 20 //px
-      },
-      // 文本区字体粗细
-      fontWeight: {
-        type: Number,
-        default: 700
-      },
-      // 文本区返回按钮图片宽
-      backImageWidth: {
-        type: Number,
-        default: 12 //px
-      },
-      // 文本区返回按钮图片高
-      backImageHeight: {
-        type: Number,
-        default: 24 //px
-      },
-      // 返回按钮是否显示
-      leftShow: {
-        type: Boolean,
-        default: true
-      },
-      // 返回按钮图标颜色
-      leftIconColor: {
-        type: String,
-        default: '#fff' 
-      },
-      // 返回按钮图标路径
-      backImageUrl: {
-        type: String,
-        default: '/static/img/toLeft.png'
-      },
-      // 导航栏整体背景颜色
-      navBackgroundColor: {
-        type: String,
-        default: 'transparent'
-      },
-      // 标题字体颜色
-      titleColor: {
-        type: String,
-        default: '#ffffff',
-      },
+	const app = getApp()
+	import {
+		systemInfo
+	} from '@/common/js/system-info.js'
+	export default {
+		name: "HeadView",
+		props: {
+			// 文本区域位置 left:左  center:中  
+			textAlign: {
+				type: String,
+				default: 'center'
+			},
+			// 文本区内容显示状态
+			textType: {
+				type: Boolean,
+				default: true
+			},
+			// 文本区内容
+			textContent: {
+				type: String,
+				default: '哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈就啊哈哈好借好还'
+			},
+			// 文本区离左边的距离
+			textPaddingLeft: {
+				type: Number,
+				default: 16
+			},
+			// 是否需要返回按钮
+			isBackShow: {
+				type: Boolean,
+				default: true
+			},
+			// 文本区字体大小
+			fontSize: {
+				type: Number,
+				default: 20 //px
+			},
+			// 文本区字体粗细
+			fontWeight: {
+				type: Number,
+				default: 700
+			},
+			// 文本区返回按钮图片宽
+			backImageWidth: {
+				type: Number,
+				default: 12 //px
+			},
+			// 文本区返回按钮图片高
+			backImageHeight: {
+				type: Number,
+				default: 24 //px
+			},
+			// 返回按钮是否显示
+			leftShow: {
+				type: Boolean,
+				default: true
+			},
+			// 返回按钮图标颜色
+			leftIconColor: {
+				type: String,
+				default: '#fff'
+			},
+			// 返回按钮图标路径
+			backImageUrl: {
+				type: String,
+				default: '/static/img/toLeft.png'
+			},
+			// 导航栏整体背景颜色
+			navBackgroundColor: {
+				type: String,
+				default: 'transparent'
+			},
+			// 标题字体颜色
+			titleColor: {
+				type: String,
+				default: '#ffffff',
+			},
 
-      /******** h5端,app端需要传入自定义导航栏高度 *******/
-      navHeightValue: {
-        type: Number,
-        default: 44 //px
-      }
-    },
-    computed: {
-      // 文本区宽度
-      navTextWidth() {
-        if (this.textAlign === 'center') {
-          return (this.windowWidth - (this.windowWidth - this.menubarLeft) * 2) + 'rpx'
-        } else {
-          return this.menubarLeft + 'rpx'
-        }
-      },
-      // 文本区paddingLeft
-      textPaddingleft() {
-        if (this.textAlign === 'center') {
-          return '0'
-        } else {
-          return this.textPaddingLeft + 'rpx'
-        }
-      }
-    },
-    data() {
-      return {
-        statusBarHeight: app.globalData.statusBarHeight, //状态栏高度
-        navHeight: app.globalData.navHeight, //头部导航栏总体高度
-        navigationBarHeight: app.globalData.navigationBarHeight, //导航栏高度
-        customHeight: app.globalData.customHeight, //胶囊高度
-        scaleFactor: app.globalData.scaleFactor, //比例系数
-        menubarLeft: app.globalData.menubarLeft, //胶囊定位的左边left
-        windowWidth: app.globalData.windowWidth * app.globalData.scaleFactor
-      };
-    },
-    methods: {
-      backEvent() {
-        uni.navigateBack({
-          delta: 1
-        })
-      }
-    },
-    created() {
-      /* 获取设备信息 */
-      const SystemInfomations = systemInfo()
-      /* 通用平台 */
-      this.statusBarHeight = SystemInfomations.statusBarHeight //状态栏高度
-      this.scaleFactor = SystemInfomations.scaleFactor //比例系数
-      this.windowWidth = SystemInfomations.windowWidth //当前设备的屏幕宽度
-      /* 微信小程序平台 */
-      // #ifdef MP-WEIXIN
-      this.navHeight = SystemInfomations.navHeight + SystemInfomations.statusBarHeight //头部导航栏总高度
-      this.$emit('navHeight', this.navHeight)
-      this.navigationBarHeight = SystemInfomations.navHeight //头部导航栏高度
-      this.customHeight = SystemInfomations.menuButtonHeight //胶囊高度
-      this.menubarLeft = SystemInfomations.menuButtonLeft //胶囊左边界距离左上角的距离
-      // #endif
+			/******** h5端,app端需要传入自定义导航栏高度 *******/
+			navHeightValue: {
+				type: Number,
+				default: 44 //px
+			}
+		},
+		computed: {
+			// 文本区宽度
+			navTextWidth() {
+				if (this.textAlign === 'center') {
+					return (this.windowWidth - (this.windowWidth - this.menubarLeft) * 2) + 'rpx'
+				} else {
+					return this.menubarLeft + 'rpx'
+				}
+			},
+			// 自定义返回宽度
+			leftWidth() {
+				return this.menubarLeft + 'rpx'
+			},
+			// 文本区paddingLeft
+			textPaddingleft() {
+				if (this.textAlign === 'center') {
+					return '0'
+				} else {
+					return this.textPaddingLeft + 'rpx'
+				}
+			}
+		},
+		data() {
+			return {
+				statusBarHeight: app.globalData.statusBarHeight, //状态栏高度
+				navHeight: app.globalData.navHeight, //头部导航栏总体高度
+				navigationBarHeight: app.globalData.navigationBarHeight, //导航栏高度
+				customHeight: app.globalData.customHeight, //胶囊高度
+				scaleFactor: app.globalData.scaleFactor, //比例系数
+				menubarLeft: app.globalData.menubarLeft, //胶囊定位的左边left
+				windowWidth: app.globalData.windowWidth * app.globalData.scaleFactor
+			};
+		},
+		methods: {
+			backEvent() {
+				uni.navigateBack({
+					delta: 1
+				})
+			}
+		},
+		created() {
+			/* 获取设备信息 */
+			const SystemInfomations = systemInfo()
+			/* 通用平台 */
+			this.statusBarHeight = SystemInfomations.statusBarHeight //状态栏高度
+			this.scaleFactor = SystemInfomations.scaleFactor //比例系数
+			this.windowWidth = SystemInfomations.windowWidth //当前设备的屏幕宽度
+			/* 微信小程序平台 */
+			// #ifdef MP-WEIXIN
+			this.navHeight = SystemInfomations.navHeight + SystemInfomations.statusBarHeight //头部导航栏总高度
+			this.$emit('navHeight', this.navHeight)
+			this.navigationBarHeight = SystemInfomations.navHeight //头部导航栏高度
+			this.customHeight = SystemInfomations.menuButtonHeight //胶囊高度
+			this.menubarLeft = SystemInfomations.menuButtonLeft //胶囊左边界距离左上角的距离
+			// #endif
 
-    }
-  }
+		}
+	}
 </script>
 
 <style>
-  /* #ifdef MP-WEIXIN */
-  .wx-head-mod {
-    box-sizing: border-box;
-    width: 100%;
-    position: fixed;
-    top: 0;
-    left: 0;
-  }
+	/* #ifdef MP-WEIXIN */
+	.wx-head-mod {
+		box-sizing: border-box;
+		width: 100%;
+		position: fixed;
+		top: 0;
+		left: 0;
+	}
+
+	.wx-head-mod-nav {
+		box-sizing: border-box;
+		width: 100%;
+		position: absolute;
+		left: 0;
+		display: flex;
+		justify-content: center;
+		align-items: center;
 
-  .wx-head-mod-nav {
-    box-sizing: border-box;
-    width: 100%;
-    position: absolute;
-    left: 0;
-    display: flex;
-    justify-content: center;
-    align-items: center;
+	}
 
-  }
+	.wx-head-mod-nav-content {
+		box-sizing: border-box;
+		width: 100%;
+		display: flex;
+		justify-content: left;
+		align-items: center;
+		position: relative;
+	}
 
-  .wx-head-mod-nav-content {
-    box-sizing: border-box;
-    width: 100%;
-    display: flex;
-    justify-content: left;
-    align-items: center;
-    position: relative;
-  }
+	/* 文本区 */
+	.wx-head-mod-nav-content-mian {
+		box-sizing: border-box;
+		height: 100%;
+		white-space: nowrap;
+		text-overflow: ellipsis;
+		overflow: hidden;
+	}
 
-  /* 文本区 */
-  .wx-head-mod-nav-content-mian {
-    box-sizing: border-box;
-    height: 100%;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    overflow: hidden;
-  }
+	/* 返回按钮 */
+	.wx-head-mod-nav-content-back {
+		box-sizing: border-box;
+		width: 60rpx;
+		height: 100%;
+		/* background-color: aqua; */
+		position: absolute;
+		top: 0;
+		left: 32rpx;
+		display: flex;
+		align-items: center;
+		justify-content: left;
+	}
 
-  /* 返回按钮 */
-  .wx-head-mod-nav-content-back {
-    box-sizing: border-box;
-    width: 60rpx;
-    height: 100%;
-    /* background-color: aqua; */
-    position: absolute;
-    top: 0;
-    left: 32rpx;
-    display: flex;
-    align-items: center;
-    justify-content: left;
-  }
+	.wx-head-mod-nav-content-back-img {
+		box-sizing: border-box;
+	}
 
-  .wx-head-mod-nav-content-back-img {
-    box-sizing: border-box;
-  }
+	.wx-head-mod-nav-content-back-slot {
+		height: 100%;
+		/* background-color: aqua; */
+		position: absolute;
+		top: 0;
+		left: 0;
+	}
 
-  /* #endif */
+	/* #endif */
 
-  /* #ifndef MP-WEIXIN */
-  .other-head-mod {
-    box-sizing: border-box;
-    width: 100%;
-    position: fixed;
-    top: 0;
-    left: 0;
-  }
+	/* #ifndef MP-WEIXIN */
+	.other-head-mod {
+		box-sizing: border-box;
+		width: 100%;
+		position: fixed;
+		top: 0;
+		left: 0;
+	}
 
-  .other-head-mod-mian {
-    box-sizing: border-box;
-    width: 100%;
-    display: flex;
-    align-items: center;
-    justify-content: left;
-    position: absolute;
-    left: 0;
-    bottom: 0;
-  }
+	.other-head-mod-mian {
+		box-sizing: border-box;
+		width: 100%;
+		display: flex;
+		align-items: center;
+		justify-content: left;
+		position: absolute;
+		left: 0;
+		bottom: 0;
+	}
 
-  /* 返回按钮 */
-  .other-head-mod-mian-back {
-    box-sizing: border-box;
-    height: 100%;
-    width: 60rpx;
-    position: absolute;
-    left: 32rpx;
-    top: 0;
-    display: flex;
-    align-items: center;
-  }
+	/* 返回按钮 */
+	.other-head-mod-mian-back {
+		box-sizing: border-box;
+		height: 100%;
+		width: 60rpx;
+		position: absolute;
+		left: 32rpx;
+		top: 0;
+		display: flex;
+		align-items: center;
+	}
 
-  /* 标题 */
-  .other-head-mod-mian-title {
-    box-sizing: border-box;
-    height: 100%;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    overflow: hidden;
-  }
+	/* 标题 */
+	.other-head-mod-mian-title {
+		box-sizing: border-box;
+		height: 100%;
+		white-space: nowrap;
+		text-overflow: ellipsis;
+		overflow: hidden;
+	}
 
-  /* #endif */
-</style>
+	/* #endif */
+</style>

+ 1208 - 1049
pages-takeout/new-shop.vue

@@ -1,1056 +1,1215 @@
 <template>
-  <view class="shop-index iPhone-bottom flex-direction box-border-box">
-
-    <image v-show="!navBgType" class="bg-img" src="@/static/img/order-food/shop-top.png" mode="aspectFill"
-      :class="scrollTop > newNavHeight?'z-4':'z-3'"></image>
-    <image v-show="navBgType" class="bg-img-type z-4" src="@/static/img/order-food/shop-top.png" mode="aspectFill"
-      :style="{height:newNavHeight+'rpx',opacity:opacity}"></image>
-
-    <newNav :leftShow="false" :textType='false' class="z-4 mb-32" @navHeight='navHeight'>
-      <view slot="textContent" class="align-items-center flex-justify-end">
-        <view class="ss-box b-rad-50 mr-24 align-items-center flex-justify-center">
-          <image class="shop-search" src="@/static/img/order-food/shop-search.png" mode=""></image>
-        </view>
-        <view class="dd-box align-items-center flex-justify-center b-rad-200 mr-24">
-          <image class="shp-list-img mr-8" src="@/static/img/order-food/shp-list.png" mode=""></image>
-          <view class="fs-28 fc-f">
-            订单
-          </view>
-        </view>
-      </view>
-    </newNav>
-
-    <view class="bgc-f box-border-box plr-32 mb-32 shop-info">
-      <view class="shop-info-box bgc-f box-border-box p-24 z-3 b-rad-20">
-        <view class="fs-40 fw-600 text-overflow-ellipsis mb-16">
-          {{shopsInfo.shop_name || "山海鲜熬老灶麻辣火锅辣火锅辣火11 世家匠心传承店川"}}
-        </view>
-        <view class="fs-24 fw-400 fc-9 text-overflow-ellipsis-one">
-          公告:{{shopsInfo.notice||"第二份半价是同时下相同商品的第二份可享受半价受"}}
-        </view>
-      </view>
-    </view>
-
-    <view class="b-b-eee bgc-f box-border-box p-0-32-12 align-items-center flex-justify-space z-3 shop-type-box">
-      <view class="align-items-center shop-type-list">
-        <view class="shop-item fs-36 mb-8 mr-64" @click="seletShopType(item)"
-          :class="shopType === item.id?'fc-3 fw-600':'fc-6'" v-for="(item,i) in shopTypeList" :key="i">
-          {{item.name}}
-        </view>
-        <view class="shop-item-bs bgc-FF3333" :style="{left:shopTypeBsLeft+'rpx'}"></view>
-      </view>
-      <view class="align-items-center">
-        <image class="zh-icon mr-8" src="@/static/img/order-food/zh-icon.png" mode="aspectFill"></image>
-        <view class="fw-600 fs-32 fc-3">
-          桌号:17
-        </view>
-      </view>
-    </view>
-
-    <!-- <view class="bgc-f sticky-nav" :style="{ height: navBgType?`calc(100vh - ${newNavHeight}rpx - ${48}rpx)`:'auto'}"> -->
-    <view class="bgc-F7F8FA">
-      <view class="menu-box box-border-box align-items-flex-start pb-130" v-if="shopType === 1">
-
-        <view class="menu-box-left" :style="{top: newNavHeight + 'rpx'}">
-          <view class="menu-box-left-box"
-            :style="{height: menuLeftType?`calc(100vh - ${newNavHeight}rpx - ${68}rpx)`:''}">
-            <view class="menu-type-list fs-26 box-border-box align-items-center flex-justify-center"
-              v-for="(item,i) in categoryData" :key="i" @click="selectType(item)"
-              :class="type ===  item.type?'bgc-f fc-3 fw-600':'fc-6 fw-400'" :id="'left-scroll'+ item.type">
-              {{item.name}}
-              <view class="menu-type-num fc-f" v-show="item.num > 0">{{item.num > 99?'99+':item.num}}</view>
-            </view>
-          </view>
-        </view>
-
-        <view class="menu-box-only bgc-f">
-          <view class="" v-for="(item,i) in categoryData" :key="i" :id="'scroll'+ item.type">
-            <view class="fs-28 fw-600 fc-3 sticky-nav bgc-f p-20 box-border-box" :style="{top: newNavHeight + 'rpx'}">
-              {{item.name}}
-            </view>
-            <view class="menu-list flex-justify-space box-border-box" v-for="(info,k) in item.list" :key="k"
-              :id="'goods_id'+ info.goods_id">
-              <image class="flex-shrink0 goods_img" :src="info.goods_image" mode="scaleToFill"></image>
-              <view class="menu-list-right flex-direction flex-justify-space">
-                <view class="mb-8">
-                  <view class="mb-4 goods-name text-overflow-ellipsis fs-32 fw-600">{{info.goods_name}}
-                  </view>
-                  <view class="text-overflow-ellipsis-one fw-400 fc-9 fs-24 mb-2 goods-name" v-if="info.spec_type == 1">
-                    {{info.goods_desc?info.goods_desc:''}}
-                  </view>
-                  <view class="fw-400 fc-9 fs-24">月销{{info.sales}}</view>
-                </view>
-                <view class="flex-justify-space align-items-flex-end">
-                  <view class="">
-                    <span class="fs-24 fw-400 fc-FB3D03">¥</span>
-                    <span class="fs-40 fw-b fc-FB3D03">{{info.seckill_money>0?info.seckill_money:info.price}}</span>
-                  </view>
-                  <view class="display-flex align-items-center" v-if="info.spec_type == 1">
-                    <image v-show="info.num > 0" class="wh-44" @click="addred(1,i,k,info)"
-                      src="@/static/img/takeout/j.png" mode=""></image>
-                    <view v-show="info.num > 0" class="right-only-right-2 text-align-center fs-28 fw-400">{{info.num}}
-                    </view>
-                    <image class="wh-44" src="@/static/img/takeout/add.png" @click="addred(2,i,k,info)" mode=""></image>
-                  </view>
-                  <view v-else class="right-only-right text-align-center" @click="addred(3,i,k,info)">
-                    <view class="fw-600 fs-28 fc-f">
-                      选规格
-                    </view>
-                    <view class="selectedNum" v-if="info.num>0">
-                      {{info.num}}
-                    </view>
-                  </view>
-                </view>
-              </view>
-            </view>
-          </view>
-        </view>
-
-      </view>
-      <!--      <newMenu style="height: 100%;" v-if="shopType === 1" :menuLeftType='menuLeftType' :newNavHeight='newNavHeight'
-        :shop_id="shop_id" @setCartData="setCartData" @scrollToCategory='handleCategoryScroll' ref="goodsMenu">
-      </newMenu> -->
-      <ShopInfo style="height: 100%;" :shopId='shop_id' v-else-if="shopType === 2"></ShopInfo>
-    </view>
-
-    <view v-if="shopType === 1" class="shop-buttom-money box-border-box" @click="openBuyCrad()">
-      <view class="shop-buttom-money-1 bgc-f flex-justify-space align-items-center pl-24 box-border-box pr-8">
-        <view class="align-items-center">
-          <image class="gwc-img mr-36" src="@/static/img/order-food/gwc-img.png" mode="scaleToFill"></image>
-          <view class="shop-buttom-num bgc-FE6B2C fs-24 fc-f text-align-center">{{cartData.total_num}}</view>
-          <view class="align-items-baseline">
-            <view class="fw-600 fs-28 fc-3 mr-4">¥</view>
-            <view class="fw-600 fs-48 fc-3">{{cartData.total_price}}</view>
-          </view>
-        </view>
-        
-        <view class="shop-buttom-money-2 text-align-center fc-f fs-32 fw-600 b-rad-200"
-          @click.stop="toConfirmOrder()">去结算
-        </view>
-      </view>
-    </view>
-  </view>
+	<view class="shop-index iPhone-bottom flex-direction box-border-box">
+
+		<image v-show="!navBgType" class="bg-img" src="@/static/img/order-food/shop-top.png" mode="aspectFill"
+			:class="scrollTop > newNavHeight?'z-4':'z-3'"></image>
+		<image v-show="navBgType" class="bg-img-type z-4" src="@/static/img/order-food/shop-top.png" mode="aspectFill"
+			:style="{height:newNavHeight+'rpx',opacity:opacity}"></image>
+
+		<newNav :leftShow="false" :textType='false' class="z-4 mb-32" @navHeight='navHeight'>
+			<view slot="textContent" class="align-items-center flex-justify-end">
+				<view class="ss-box b-rad-50 mr-24 align-items-center flex-justify-center">
+					<image class="shop-search" src="@/static/img/order-food/shop-search.png" mode=""></image>
+				</view>
+				<view class="dd-box align-items-center flex-justify-center b-rad-200 mr-24">
+					<image class="shp-list-img mr-8" src="@/static/img/order-food/shp-list.png" mode=""></image>
+					<view class="fs-28 fc-f">
+						订单
+					</view>
+				</view>
+			</view>
+		</newNav>
+
+		<view class="bgc-f box-border-box plr-32 mb-32 shop-info">
+			<view class="shop-info-box bgc-f box-border-box p-24 z-3 b-rad-20">
+				<view class="fs-40 fw-600 text-overflow-ellipsis mb-16">
+					{{shopsInfo.shop_name || "山海鲜熬老灶麻辣火锅辣火锅辣火11 世家匠心传承店川"}}
+				</view>
+				<view class="fs-24 fw-400 fc-9 text-overflow-ellipsis-one">
+					公告:{{shopsInfo.notice||"第二份半价是同时下相同商品的第二份可享受半价受"}}
+				</view>
+			</view>
+		</view>
+
+		<view class="b-b-eee bgc-f box-border-box p-0-32-12 align-items-center flex-justify-space z-3 shop-type-box">
+			<view class="align-items-center shop-type-list">
+				<view class="shop-item fs-36 mb-8 mr-64" @click="seletShopType(item)"
+					:class="shopType === item.id?'fc-3 fw-600':'fc-6'" v-for="(item,i) in shopTypeList" :key="i">
+					{{item.name}}
+				</view>
+				<view class="shop-item-bs bgc-FF3333" :style="{left:shopTypeBsLeft+'rpx'}"></view>
+			</view>
+			<view class="align-items-center">
+				<image class="zh-icon mr-8" src="@/static/img/order-food/zh-icon.png" mode="aspectFill"></image>
+				<view class="fw-600 fs-32 fc-3">
+					桌号:17
+				</view>
+			</view>
+		</view>
+
+		<!-- <view class="bgc-f sticky-nav" :style="{ height: navBgType?`calc(100vh - ${newNavHeight}rpx - ${48}rpx)`:'auto'}"> -->
+		<view class="bgc-F7F8FA">
+			<view class="menu-box box-border-box align-items-flex-start pb-130" v-if="shopType === 1">
+
+				<view class="menu-box-left" :style="{top: newNavHeight + 'rpx'}">
+					<view class="menu-box-left-box"
+						:style="{height: menuLeftType?`calc(100vh - ${newNavHeight}rpx - ${68}rpx)`:''}">
+						<view class="menu-type-list fs-26 box-border-box align-items-center flex-justify-center"
+							v-for="(item,i) in categoryData" :key="i" @click="selectType(item)"
+							:class="type ===  item.type?'bgc-f fc-3 fw-600':'fc-6 fw-400'"
+							:id="'left-scroll'+ item.type">
+							{{item.name}}
+							<view class="menu-type-num fc-f" v-show="item.num > 0">{{item.num > 99?'99+':item.num}}
+							</view>
+						</view>
+					</view>
+				</view>
+
+				<view class="menu-box-only bgc-f">
+					<view class="" v-for="(item,i) in categoryData" :key="i" :id="'scroll'+ item.type">
+						<view class="fs-28 fw-600 fc-3 sticky-nav bgc-f p-20 box-border-box"
+							:style="{top: newNavHeight + 'rpx'}">
+							{{item.name}}
+						</view>
+						<view class="menu-list flex-justify-space box-border-box" v-for="(info,k) in item.list" :key="k"
+							:id="'goods_id'+ info.goods_id">
+							<image class="flex-shrink0 goods_img" :src="info.goods_image" mode="scaleToFill"></image>
+							<view class="menu-list-right flex-direction flex-justify-space">
+								<view class="mb-8">
+									<view class="mb-4 goods-name text-overflow-ellipsis fs-32 fw-600">
+										{{info.goods_name}}
+									</view>
+									<view class="text-overflow-ellipsis-one fw-400 fc-9 fs-24 mb-2 goods-name"
+										v-if="info.spec_type == 1">
+										{{info.goods_desc?info.goods_desc:''}}
+									</view>
+								</view>
+								<view class="flex-justify-space align-items-flex-end">
+									<view class="">
+										<span class="fs-24 fw-400 fc-FB3D03">¥</span>
+										<span
+											class="fs-40 fw-b fc-FB3D03">{{info.seckill_money>0?info.seckill_money:info.price}}</span>
+									</view>
+									<view class="display-flex align-items-center" v-if="info.spec_type == 1">
+										<image v-show="info.num > 0" class="wh-44" @click="addred(1,info)"
+											src="@/static/img/order-food/reduce-img.png" mode=""></image>
+										<view v-show="info.num > 0"
+											class="right-only-right-2 text-align-center fs-28 fw-400">{{info.num}}
+										</view>
+										<image class="wh-44" src="@/static/img/order-food/add-img.png"
+											@click="addred(2,info)" mode=""></image>
+									</view>
+									<view v-else class="right-only-right text-align-center" @click="addred(3,info)">
+										<view class="fw-600 fs-28 fc-f">
+											选规格
+										</view>
+										<view class="selectedNum" v-if="info.num>0">
+											{{info.num}}
+										</view>
+									</view>
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+
+			<ShopInfo style="height: 100%;" :shopId='shop_id' v-else-if="shopType === 2"></ShopInfo>
+			
+		</view>
+
+		<view v-if="shopType === 1" class="shop-buttom-money box-border-box" @click="openBuyCrad()">
+			<view class="shop-buttom-money-1 bgc-f flex-justify-space align-items-center pl-24 box-border-box pr-8 b-rad-200">
+				<view class="align-items-center">
+					<image class="gwc-img mr-36" src="@/static/img/order-food/gwc-img.png" mode="scaleToFill"></image>
+					<view class="shop-buttom-num bgc-FE6B2C fs-24 fc-f text-align-center">{{cartData.total_num}}</view>
+					<view class="align-items-baseline">
+						<view class="fw-600 fs-28 fc-3 mr-4">¥</view>
+						<view class="fw-600 fs-48 fc-3">{{cartData.total_price}}</view>
+					</view>
+				</view>
+
+				<view class="shop-buttom-money-2 text-align-center fc-f fs-32 fw-600 b-rad-200"
+					:class="cartData.total_num>0?'':'opacity-4'" @click.stop="toConfirmOrder()">去结算
+				</view>
+			</view>
+		</view>
+
+		<uni-popup ref="popupBuy" type="bottom" background-color="transparent" borderRadius='20px 20rpx 0 0'>
+			<view class="buy-card flex-index-css">
+				<view class="buy-card-top box-border-box plr-32 flex-justify-space align-items-center b-rad-20-20-0-0">
+					<view class="">
+						<span class="fs-32 fc-3 mr-12">已选商品</span>
+					</view>
+					<view class="fs-28 fw-400 fc-9 align-items-center" @click.stop="setShopIngDel">
+						<view class="">
+							<uni-icons type="trash" size="18" color="#999"></uni-icons>
+						</view>
+						<view class="fs-28 fw-400 fc-9">清空</view>
+					</view>
+				</view>
+				<view class="scroll-view-css bgc-ECECEC box-border-box p-32">
+					<view class="buy-card-item display-flex" v-for="(goods,i) in cartData.goods_list" :key="i">
+						<image class="goods_img" :src="goods.goods_image" mode="scaleToFill"></image>
+						<view class="flex-1">
+							<view class="w-514 text-overflow-ellipsis-one fs-34 fw-600 mb-12">
+								{{goods.goods_name}}
+							</view>
+							<view class="w-514 text-overflow-ellipsis-one fs-24 fw-400 mb-18"
+								:class="goods.status_str?'fc-FD5C02':'fc-9'">
+								{{goods.status_str?goods.status_str:goods.goods_attr}}
+							</view>
+							<view class="flex-justify-space">
+								<view class="">
+									<span class="fs-24 fc-FB3D03 fw-400">¥</span>
+									<span class="fs-40 fc-FB3D03 fw-b">{{goods.price}}</span>
+								</view>
+								<view class="display-flex align-items-center">
+									<image class="wh-44" @click.stop="setShoppingSave(goods,2)"
+										src="@/static/img/takeout/j.png" mode="">
+									</image>
+									<view class="right-only-right-2 text-align-center fs-28 fw-400">
+										{{goods.goods_number}}
+									</view>
+									<image class="wh-44" src="@/static/img/takeout/add.png"
+										@click.stop="setShoppingSave(goods,1)" mode=""></image>
+								</view>
+							</view>
+						</view>
+					</view>
+					<en-blank navBackgroundColor='#ECECEC' v-if="cartData.goods_list.length<=0"
+						message="快去选购商品吧!~"></en-blank>
+				</view>
+				<view class="pop-shop-buttom-money box-border-box" @click="openBuyCrad()">
+					<view class="shop-buttom-money-1 bgc-f flex-justify-space align-items-center pl-24 box-border-box pr-8 b-rad-200">
+						<view class="align-items-center">
+							<image class="gwc-img mr-36" src="@/static/img/order-food/gwc-img.png" mode="scaleToFill">
+							</image>
+							<view class="shop-buttom-num bgc-FE6B2C fs-24 fc-f text-align-center">{{cartData.total_num}}
+							</view>
+							<view class="align-items-baseline">
+								<view class="fw-600 fs-28 fc-3 mr-4">¥</view>
+								<view class="fw-600 fs-48 fc-3">{{cartData.total_price}}</view>
+							</view>
+						</view>
+
+						<view class="shop-buttom-money-2 text-align-center fc-f fs-32 fw-600 b-rad-200"
+							:class="cartData.total_num>0?'':'opacity-4'" @click.stop="toConfirmOrder()">去结算
+						</view>
+					</view>
+				</view>
+			</view>
+		</uni-popup>
+	</view>
 </template>
 
 <script>
-  import newMenu from './shop-mod/new-menu.vue';
-  import ShopInfo from './shop-mod/info.vue';
-  import tools from "@/service/tools";
-  import EnBlank from "@/components/en-utils/en-blank/en-blank";
-  import {
-    receiveCoupon
-  } from "@/api/coupon.js"
-  import {
-    shopInfo
-  } from "@/api/shop.js"
-  import {
-    getDeliveryMoney
-  } from "@/api/common";
-  import {
-    getShopIngList,
-    setShopIngDel,
-    shoppingSave
-  } from "@/api/shopping";
-  export default {
-    components: {
-      newMenu,
-      ShopInfo,
-      EnBlank
-    },
-    data() {
-      return {
-        domHeigjt: 0,
-        shopTypeList: [{
-          name: "点单",
-          id: 1
-        }, {
-          name: "商家",
-          id: 2
-        }],
-        shopType: 1, //组件类型
-        shopTypeBsLeft: 12,
-        shop_id: '',
-        operate_id: '',
-        shopsInfo: {},
-        cartData: {
-          total_price: 0,
-          total_num: 0,
-          total_goods_money: 0,
-          pack_price: 0,
-          must_category: 0,
-          is_place_order: 0,
-          err_msg: 0,
-          goods_list: [],
-        },
-        isAjax: false,
-        newNavHeight: '',
-        navBgType: false,
-        menuLeftType: false,
-        scrollTop: 0,
-        opacity: 0,
-        heightOne: '',
-        heightTwo: '',
-        topHeight: '',
-        idMark: '', //滚动自适应参数
-        idMarkTwo: '', //滚动自适应参数
-        type: 0, //分类标识
-        typeList: [],
-        categoryData: [{
-            type: 0,
-            name: '测试1',
-            list: [{
-              goods_id: 1,
-              goods_name: '测试商品1-1',
-              price: '10',
-              goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
-            }, {
-              goods_id: 2,
-              goods_name: '测试商品1-2',
-              price: '10',
-              goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
-            }, {
-              goods_id: 3,
-              goods_name: '测试商品1-3',
-              price: '10',
-              goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
-            }]
-          }, {
-            type: 1,
-            name: '测试2',
-            list: [{
-              goods_id: 4,
-              goods_name: '测试商品2-1',
-              price: '10',
-              goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
-            }, {
-              goods_id: 5,
-              goods_name: '测试商品2-2',
-              price: '10',
-              goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
-            }, {
-              goods_id: 6,
-              goods_name: '测试商品2-3',
-              price: '10',
-              goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
-            }]
-          }, {
-            type: 2,
-            name: '测试3',
-            list: [{
-              goods_id: 7,
-              goods_name: '测试商品3',
-              price: '10',
-              goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
-            }]
-          }, {
-            type: 3,
-            name: '测试4',
-            list: [{
-              goods_id: 8,
-              goods_name: '测试商品4',
-              price: '10',
-              goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
-            }]
-          }, {
-            type: 4,
-            name: '测试5',
-            list: [{
-              goods_id: 9,
-              goods_name: '测试商品5',
-              price: '10',
-              goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
-            }]
-          },
-          {
-            type: 5,
-            name: '测试6',
-            list: [{
-              goods_id: 10,
-              goods_name: '测试商品6',
-              price: '10',
-              goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
-            }]
-          },
-          {
-            type: 6,
-            name: '测试7',
-            list: [{
-              goods_id: 11,
-              goods_name: '测试商品7',
-              price: '10',
-              goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
-            }]
-          },
-          {
-            type: 7,
-            name: '测试8',
-            list: [{
-              goods_id: 12,
-              goods_name: '测试商品8',
-              price: '10',
-              goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
-            }]
-          },
-          {
-            type: 8,
-            name: '测试9',
-            list: [{
-              goods_id: 13,
-              goods_name: '测试商品9',
-              price: '10',
-              goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
-            }]
-          },
-        ],
-      }
-    },
-    onShow() {},
-    onLoad(e) {},
-    mounted() {},
-    onReachBottom(e) {
-      console.log(e, '页面触底了');
-      // uni.$emit('shopBottom',true)
-    },
-    // 监听页面滚动
-    onPageScroll(e) {
-      // e.scrollTop 获取滚动条距离页面顶部的距离
-      this.scrollTop = e.scrollTop
-      this.opacity = (Number(this.scrollTop) - 30)
-      // 可以根据滚动位置执行相应逻辑
-      if (e.scrollTop > 25) {
-        this.navBgType = true
-      } else {
-        this.navBgType = false
-      }
-      if (e.scrollTop > (Number(this.newNavHeight) - 4)) {
-        this.menuLeftType = true
-      } else {
-        this.menuLeftType = false
-      }
-    },
-    methods: {
-      selectType(item, itemTwo) {
-        if (this.type != item.type) {
-          this.type = item.type;
-          this.idMark = 'scroll' + item.type
-
-          // 立即更新
-          this.$forceUpdate();
-
-          // 延迟执行滚动
-          setTimeout(() => {
-            this.scrollToCategorySimple(item.type);
-          }, 100);
-        }
-      },
-
-      // 滚动方法
-      scrollToCategorySimple(type) {
-        const query = uni.createSelectorQuery();
-        const selector = `#scroll${type}`;
-        uni.pageScrollTo({
-          selector: selector,
-          duration: 300,
-        });
-        return
-        let targetScrollTop = 0
-        query.select('.shop-info').boundingClientRect(rect => {
-          console.log('商家详情', rect);
-          targetScrollTop += rect.height
-        })
-        query.select('.shop-type-box').boundingClientRect(rect => {
-          console.log('详情切换', rect);
-          targetScrollTop += rect.height + this.newNavHeight
-          console.log('固定上部分位置', targetScrollTop);
-        })
-        query.select(selector).boundingClientRect(rect => {
-          console.log('id找到元素,top:', rect);
-          uni.pageScrollTo({
-            scrollTop: targetScrollTop,
-            duration: 300,
-            success: () => {
-              console.log('滚动完成');
-            }
-          });
-          // 获取当前滚动位置
-          // query.selectViewport().scrollOffset(res => {
-          //   // 计算目标滚动位置
-          //   // 减去固定元素的高度:导航栏 + 店铺信息 + 分类栏
-          //   const navHeight = this.newNavHeight ? uni.upx2px(this.newNavHeight) : 0;
-          //   const fixedOffset = navHeight + 200 + 100; // 可以根据实际情况调整
-
-          //   const targetScrollTop = res.scrollTop + rect.top - fixedOffset;
-
-          //   console.log('当前scrollTop:', res.scrollTop, '目标scrollTop:', targetScrollTop);
-
-          //   // 滚动到目标位置
-          //   uni.pageScrollTo({
-          //     scrollTop: targetScrollTop,
-          //     duration: 300,
-          //     success: () => {
-          //       console.log('滚动完成');
-          //     }
-          //   });
-          // }).exec();
-        }).exec();
-      },
-      getHeight() {
-        const query = uni.createSelectorQuery();
-        query.select('.shop-info').boundingClientRect(data => {
-          this.heightOne = data.height;
-          console.log(this.heightOne, '0000000000');
-        }).exec();
-        query.select('.shop-type-box').boundingClientRect(data => {
-          this.heightTwo = data.height;
-          this.topHeight = this.heightOne + this.heightTwo + this.newNavHeight
-          console.log(this.topHeight, '111111');
-        }).exec();
-      },
-      navHeight(e) {
-        this.newNavHeight = e
-        console.log(e, '000000000');
-      },
-      mustBut() {
-        // 未点必选品
-        const item = {
-          type: this.cartData.must_category
-        }
-        this.$refs.goodsMenu.selectType(item)
-      },
-      setShopIngDel() {
-        uni.showModal({
-          title: '提示',
-          content: '是否清除购物车商品?',
-          success: (res) => {
-            console.log(res)
-            if (res.confirm) {
-              setShopIngDel({
-                'shop_id': this.shop_id,
-                'type': 1,
-              }).then((res) => {
-                if (res.code === 1) {
-                  tools.success(res.msg)
-                  this.getShopIngList()
-                  this.$refs.popupBuy.close()
-                } else {
-                  tools.error(res.msg)
-                }
-              })
-            }
-          }
-        });
-      },
-      setShoppingSave(item, type) {
-        if (type === 1) {
-          // 加
-          item.goods_number = item.goods_number + 1
-        } else {
-          // 减
-          if (item.goods_number < 0) {
-            return
-          }
-          item.goods_number = item.goods_number - 1
-        }
-        if (this.isAjax) {
-          return
-        }
-        this.isAjax = true
-        shoppingSave({
-          'type': 1,
-          'goods_id': item.goods_id,
-          'shop_id': this.shop_id,
-          'category_id': item.category_id,
-          'goods_spec_id': item.goods_spec_id,
-          'number': item.goods_number,
-        }).then(res => {
-          if (res.code == 1) {
-            this.isAjax = false
-            this.getShopIngList()
-          }
-        }).catch(() => {
-          this.isAjax = false
-        })
-      },
-      getShopIngList() {
-        getShopIngList({
-          'shop_id': 111,
-        }).then(res => {
-          if (res.code === 1) {
-            this.cartData = res.data
-            if (this.shopType === 1) {
-              setTimeout(() => {
-                console.log('我的数据执行了')
-                // this.$refs.goodsMenu.setShopIngList(this.cartData)
-              }, 1000)
-
-            }
-          }
-        })
-      },
-      setCartData(cartData) {
-        this.cartData = cartData
-        this.getDeliveryMoney()
-      },
-      getDeliveryMoney() {
-        getDeliveryMoney({
-          'school_id': this.operate_id,
-          'shop_id': this.shop_id,
-        }).then(res => {
-          if (res.code === 1) {
-            this.delivery_money = res.data.delivery_money * 1
-          }
-        })
-      },
-      toBack() {
-        tools.leftClick()
-      },
-      getDomH(num) {
-        this.$nextTick(() => {
-          let info = uni.createSelectorQuery().select('#shopInfoBox');
-          info.boundingClientRect((data) => {
-            if (num === 1) {
-              this.domHeigjt = data.height + 72
-            } else {
-              this.domHeigjt = data.height + 72 + 48
-            }
-          }).exec()
-        })
-        // setTimeout(() => {
-
-        // }, 500)
-      },
-
-      scrolltolower() {
-        console.log('触底');
-      },
-      seletShopType(item) {
-        if (this.shopType != item.id) {
-          this.shopType = item.id;
-          if (this.shopType == 1) {
-            this.shopTypeBsLeft = 12
-          } else if (this.shopType == 2) {
-            this.shopTypeBsLeft = 150
-          } else {
-            this.shopTypeBsLeft = 160 * 2
-          }
-        }
-      },
-      openBuyCrad() {
-        this.$refs.popupBuy.open()
-      },
-      createOrder() {
-        this.$refs.popupBuy.close()
-      },
-      openCoupon() {
-        this.$refs.popupCoupon.open()
-      },
-      closeCoupon() {
-        this.$refs.popupCoupon.close()
-      },
-      toConfirmOrder() {
-        uni.navigateTo({
-          url: '/pages-takeout/goods-order?shop_id=' + this.shop_id
-        })
-      },
-      shopInfo() {
-        const operate_id = uni.getStorageSync('operate_id')
-        shopInfo({
-          operate_id: operate_id,
-          shop_id: this.shop_id
-        }).then((res) => {
-          if (res.code == 1) {
-            this.shopsInfo = res.data
-          } else {
-            tools.error(res.msg)
-            setTimeout(() => {
-              uni.navigateBack({
-                delta: 1
-              })
-            }, 1500)
-          }
-        })
-      }
-    },
-  }
+	import newMenu from './shop-mod/new-menu.vue';
+	import ShopInfo from './shop-mod/info.vue';
+	import tools from "@/service/tools";
+	import EnBlank from "@/components/en-utils/en-blank/en-blank";
+	import {
+		receiveCoupon
+	} from "@/api/coupon.js"
+	import {
+		shopInfo
+	} from "@/api/shop.js"
+	import {
+		getDeliveryMoney
+	} from "@/api/common";
+	import {
+		getShopIngList,
+		setShopIngDel,
+		shoppingSave
+	} from "@/api/shopping";
+	export default {
+		components: {
+			newMenu,
+			ShopInfo,
+			EnBlank
+		},
+		data() {
+			return {
+				domHeigjt: 0,
+				shopTypeList: [{
+					name: "点单",
+					id: 1
+				}, {
+					name: "商家",
+					id: 2
+				}],
+				shopType: 1, //组件类型
+				shopTypeBsLeft: 12,
+				shop_id: '',
+				operate_id: '',
+				shopsInfo: {},
+				cartData: {
+					total_price: 0,
+					total_num: 0,
+					total_goods_money: 0,
+					pack_price: 0,
+					must_category: 0,
+					is_place_order: 0,
+					err_msg: 0,
+					goods_list: [],
+				},
+				isAjax: false,
+				newNavHeight: '',
+				navBgType: false,
+				menuLeftType: false,
+				scrollTop: 0,
+				opacity: 0,
+				heightOne: '',
+				heightTwo: '',
+				topHeight: '',
+				idMark: '', //滚动自适应参数
+				idMarkTwo: '', //滚动自适应参数
+				type: 0, //分类标识
+				typeList: [],
+				categoryData: [{
+						type: 0,
+						name: '测试1',
+						list: [{
+							goods_id: 1,
+							goods_name: '测试商品1-1',
+							price: '10',
+							spec_type: 1,
+							goods_number: 0,
+							goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
+						}, {
+							goods_id: 2,
+							goods_name: '测试商品1-2',
+							price: '10',
+							goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
+						}, {
+							goods_id: 3,
+							goods_name: '测试商品1-3',
+							price: '10',
+							goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
+						}]
+					}, {
+						type: 1,
+						name: '测试2',
+						list: [{
+							goods_id: 4,
+							goods_name: '测试商品2-1',
+							price: '10',
+							goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
+						}, {
+							goods_id: 5,
+							goods_name: '测试商品2-2',
+							price: '10',
+							goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
+						}, {
+							goods_id: 6,
+							goods_name: '测试商品2-3',
+							price: '10',
+							goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
+						}]
+					}, {
+						type: 2,
+						name: '测试3',
+						list: [{
+							goods_id: 7,
+							goods_name: '测试商品3',
+							price: '10',
+							goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
+						}]
+					}, {
+						type: 3,
+						name: '测试4',
+						list: [{
+							goods_id: 8,
+							goods_name: '测试商品4',
+							price: '10',
+							goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
+						}]
+					}, {
+						type: 4,
+						name: '测试5',
+						list: [{
+							goods_id: 9,
+							goods_name: '测试商品5',
+							price: '10',
+							goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
+						}]
+					},
+					{
+						type: 5,
+						name: '测试6',
+						list: [{
+							goods_id: 10,
+							goods_name: '测试商品6',
+							price: '10',
+							goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
+						}]
+					},
+					{
+						type: 6,
+						name: '测试7',
+						list: [{
+							goods_id: 11,
+							goods_name: '测试商品7',
+							price: '10',
+							goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
+						}]
+					},
+					{
+						type: 7,
+						name: '测试8',
+						list: [{
+							goods_id: 12,
+							goods_name: '测试商品8',
+							price: '10',
+							goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
+						}]
+					},
+					{
+						type: 8,
+						name: '测试9',
+						list: [{
+							goods_id: 13,
+							goods_name: '测试商品9',
+							price: '10',
+							goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
+						}]
+					},
+				],
+			}
+		},
+		onShow() {},
+		onLoad(e) {},
+		mounted() {},
+		onReachBottom(e) {
+			console.log(e, '页面触底了');
+			// uni.$emit('shopBottom',true)
+		},
+		// 监听页面滚动
+		onPageScroll(e) {
+			// e.scrollTop 获取滚动条距离页面顶部的距离
+			this.scrollTop = e.scrollTop
+			this.opacity = (Number(this.scrollTop) - 30)
+			// 可以根据滚动位置执行相应逻辑
+			if (e.scrollTop > 25) {
+				this.navBgType = true
+			} else {
+				this.navBgType = false
+			}
+			if (e.scrollTop > (Number(this.newNavHeight) - 4)) {
+				this.menuLeftType = true
+			} else {
+				this.menuLeftType = false
+			}
+		},
+		methods: {
+			selectType(item, itemTwo) {
+				if (this.type != item.type) {
+					this.type = item.type;
+					this.idMark = 'scroll' + item.type
+
+					// 立即更新
+					this.$forceUpdate();
+
+					// 延迟执行滚动
+					setTimeout(() => {
+						this.scrollToCategorySimple(item.type);
+					}, 100);
+				}
+			},
+
+			// 滚动方法
+			scrollToCategorySimple(type) {
+				const query = uni.createSelectorQuery();
+				const selector = `#scroll${type}`;
+				uni.pageScrollTo({
+					selector: selector,
+					duration: 300,
+				});
+				return
+				let targetScrollTop = 0
+				query.select('.shop-info').boundingClientRect(rect => {
+					console.log('商家详情', rect);
+					targetScrollTop += rect.height
+				})
+				query.select('.shop-type-box').boundingClientRect(rect => {
+					console.log('详情切换', rect);
+					targetScrollTop += rect.height + this.newNavHeight
+					console.log('固定上部分位置', targetScrollTop);
+				})
+				query.select(selector).boundingClientRect(rect => {
+					console.log('id找到元素,top:', rect);
+					uni.pageScrollTo({
+						scrollTop: targetScrollTop,
+						duration: 300,
+						success: () => {
+							console.log('滚动完成');
+						}
+					});
+					// 获取当前滚动位置
+					// query.selectViewport().scrollOffset(res => {
+					//   // 计算目标滚动位置
+					//   // 减去固定元素的高度:导航栏 + 店铺信息 + 分类栏
+					//   const navHeight = this.newNavHeight ? uni.upx2px(this.newNavHeight) : 0;
+					//   const fixedOffset = navHeight + 200 + 100; // 可以根据实际情况调整
+
+					//   const targetScrollTop = res.scrollTop + rect.top - fixedOffset;
+
+					//   console.log('当前scrollTop:', res.scrollTop, '目标scrollTop:', targetScrollTop);
+
+					//   // 滚动到目标位置
+					//   uni.pageScrollTo({
+					//     scrollTop: targetScrollTop,
+					//     duration: 300,
+					//     success: () => {
+					//       console.log('滚动完成');
+					//     }
+					//   });
+					// }).exec();
+				}).exec();
+			},
+			addred(type, item) {
+				if (this.isAjax) {
+					return
+				}
+				this.isAjax = true
+				if (type === 1) {
+					// 减
+					--item.num;
+					if (item.num >= 0) {
+						this.addShoppingSave(item, item.num, type)
+					} else {
+						this.isAjax = false
+					}
+				} else if (type === 2) {
+					// 加
+					++item.num;
+					if (item.is_infinite === 0 && item.num > item.stock) {
+						--item.num
+						this.isAjax = false
+					} else if (item.is_quota > 0 && item.num > item.quota_num) {
+						--item.num
+						this.isAjax = false
+					} else {
+						this.addShoppingSave(item, item.num, type)
+					}
+			
+				} else if (type === 3) {
+					// 选规格
+					console.log(item, '000000000')
+					console.log(this.selectedSpecification, '1111111111111');
+					this.selectedSpecification.forEach((v, k) => {
+						if (v.goods_id === item.goods_id) {
+							v.quota_num = item.quota_num
+							v.payNum = item.num
+							v.stock = item.stock
+						}
+					})
+					this.popData.is_quota = item.is_quota
+					this.popData.quota_num = item.quota_num
+					this.popData.is_infinite = item.is_infinite
+					this.popData.payNum = item.num
+					this.popData.stock = item.stock
+					this.getShopGoodsSpec(item)
+				} else {
+					let data = JSON.parse(JSON.stringify(this.popData))
+					this.selectedSpecification.push(data)
+					console.log(this.popData, "666666666666666666")
+					console.log('1', this.popData.goods_id, this.shop_id, this.popData.goodsItem.category_id, this.popData
+						.spec_key, this.popData.num);
+					this.setShoppingSave()
+					this.isAjax = false
+				}
+			},
+			addShoppingSave(item, num, type) {
+				shoppingSave({
+					type: 1,
+					goods_id: item.goods_id,
+					shop_id: this.shop_id,
+					category_id: item.category_id,
+					goods_spec_id: '',
+					number: num
+				}).then((res) => {
+					if (res.code === 1) {
+						if (type === 1) {
+							tools.success('操作成功')
+						} else {
+							tools.success(res.msg)
+						}
+						this.isAjax = false
+						this.getShopIngList()
+					} else {
+						this.isAjax = false
+						tools.error(res.msg)
+					}
+				})
+			},
+			getHeight() {
+				const query = uni.createSelectorQuery();
+				query.select('.shop-info').boundingClientRect(data => {
+					this.heightOne = data.height;
+					console.log(this.heightOne, '0000000000');
+				}).exec();
+				query.select('.shop-type-box').boundingClientRect(data => {
+					this.heightTwo = data.height;
+					this.topHeight = this.heightOne + this.heightTwo + this.newNavHeight
+					console.log(this.topHeight, '111111');
+				}).exec();
+			},
+			navHeight(e) {
+				this.newNavHeight = e
+			},
+			mustBut() {
+				// 未点必选品
+				const item = {
+					type: this.cartData.must_category
+				}
+				this.$refs.goodsMenu.selectType(item)
+			},
+			setShopIngDel() {
+				uni.showModal({
+					title: '提示',
+					content: '是否清除购物车商品?',
+					success: (res) => {
+						console.log(res)
+						if (res.confirm) {
+							setShopIngDel({
+								'shop_id': this.shop_id,
+								'type': 1,
+							}).then((res) => {
+								if (res.code === 1) {
+									tools.success(res.msg)
+									this.getShopIngList()
+									this.$refs.popupBuy.close()
+								} else {
+									tools.error(res.msg)
+								}
+							})
+						}
+					}
+				});
+			},
+			setShoppingSave(item, type) {
+				console.log(item,'11111111');
+				if (type === 1) {
+					// 加
+					item.goods_number = item.goods_number + 1
+				} else {
+					// 减
+					if (item.goods_number < 0) {
+						return
+					}
+					item.goods_number = item.goods_number - 1
+				}
+				return
+				if (this.isAjax) {
+					return
+				}
+				this.isAjax = true
+				shoppingSave({
+					'type': 1,
+					'goods_id': item.goods_id,
+					'shop_id': this.shop_id,
+					'category_id': item.category_id,
+					'goods_spec_id': item.goods_spec_id,
+					'number': item.goods_number,
+				}).then(res => {
+					if (res.code == 1) {
+						this.isAjax = false
+						this.getShopIngList()
+					}
+				}).catch(() => {
+					this.isAjax = false
+				})
+			},
+			getShopIngList() {
+				getShopIngList({
+					'shop_id': 111,
+				}).then(res => {
+					if (res.code === 1) {
+						this.cartData = res.data
+						if (this.shopType === 1) {
+							setTimeout(() => {
+								console.log('我的数据执行了')
+								// this.$refs.goodsMenu.setShopIngList(this.cartData)
+							}, 1000)
+
+						}
+					}
+				})
+			},
+			setCartData(cartData) {
+				this.cartData = cartData
+				this.getDeliveryMoney()
+			},
+			getDeliveryMoney() {
+				getDeliveryMoney({
+					'school_id': this.operate_id,
+					'shop_id': this.shop_id,
+				}).then(res => {
+					if (res.code === 1) {
+						this.delivery_money = res.data.delivery_money * 1
+					}
+				})
+			},
+			toBack() {
+				tools.leftClick()
+			},
+			getDomH(num) {
+				this.$nextTick(() => {
+					let info = uni.createSelectorQuery().select('#shopInfoBox');
+					info.boundingClientRect((data) => {
+						if (num === 1) {
+							this.domHeigjt = data.height + 72
+						} else {
+							this.domHeigjt = data.height + 72 + 48
+						}
+					}).exec()
+				})
+				// setTimeout(() => {
+
+				// }, 500)
+			},
+			seletShopType(item) {
+				if (this.shopType != item.id) {
+					this.shopType = item.id;
+					if (this.shopType == 1) {
+						this.shopTypeBsLeft = 12
+					} else if (this.shopType == 2) {
+						this.shopTypeBsLeft = 150
+					} else {
+						this.shopTypeBsLeft = 160 * 2
+					}
+				}
+			},
+			openBuyCrad() {
+				this.$refs.popupBuy.open()
+			},
+			createOrder() {
+				this.$refs.popupBuy.close()
+			},
+			openCoupon() {
+				this.$refs.popupCoupon.open()
+			},
+			closeCoupon() {
+				this.$refs.popupCoupon.close()
+			},
+			toConfirmOrder() {
+				uni.navigateTo({
+					url: '/pages-takeout/goods-order?shop_id=' + this.shop_id
+				})
+			},
+			shopInfo() {
+				const operate_id = uni.getStorageSync('operate_id')
+				shopInfo({
+					operate_id: operate_id,
+					shop_id: this.shop_id
+				}).then((res) => {
+					if (res.code == 1) {
+						this.shopsInfo = res.data
+					} else {
+						tools.error(res.msg)
+						setTimeout(() => {
+							uni.navigateBack({
+								delta: 1
+							})
+						}, 1500)
+					}
+				})
+			}
+		},
+	}
 </script>
 
 <style scoped lang="scss">
-  .zh-icon {
-    width: 32rpx;
-    height: 32rpx;
-  }
-
-  .shp-list-img {
-    width: 40rpx;
-    height: 40rpx;
-  }
-
-  .dd-box {
-    width: 144rpx;
-    padding: 12rpx 0;
-    background: rgba(0, 0, 0, 0.14);
-  }
-
-  .ss-box {
-    width: 64rpx;
-    height: 64rpx;
-    background: rgba(0, 0, 0, 0.14);
-  }
-
-  .shop-search {
-    width: 40rpx;
-    height: 40rpx;
-  }
-
-  .wh-44 {
-    width: 44rpx;
-    height: 44rpx;
-  }
-
-  .blank-text {
-    line-height: 32vh;
-  }
-
-  .box-title {
-    position: relative;
-  }
-
-  .box-close {
-    position: absolute;
-    right: 22rpx;
-  }
-
-  .pop-coupon {
-    width: 100%;
-    height: 42vh;
-    background-color: #F5F4F9;
-    border-radius: 24rpx 24rpx 0rpx 0rpx;
-    padding-top: 32rpx !important;
-    display: flex;
-    flex-direction: column;
-  }
-
-  .item-right {
-    padding: 24rpx;
-    box-sizing: border-box;
-    border-radius: 20rpx 0 0 20rpx;
-    position: relative;
-  }
-
-  .item-hr {
-    width: 0px;
-    height: auto;
-    border-right: 1rpx dashed #FB7850;
-  }
-
-  .item-hr-two {
-    width: 0px;
-    height: auto;
-    border-right: 1rpx dashed #999;
-  }
-
-  .item-left {
-    width: 220rpx;
-    height: auto;
-    padding: 20rpx 24rpx;
-    box-sizing: border-box;
-    position: relative;
-    border-radius: 0 20rpx 20rpx 0;
-  }
-
-  .but-box {
-    width: 152rpx;
-    height: 52rpx;
-    line-height: 52rpx;
-    text-align: center;
-    background: linear-gradient(225deg, #FB3D03 0%, #FF6901 100%);
-    border-radius: 200rpx;
-  }
-
-  .ball {
-    width: 24rpx;
-    height: 24rpx;
-    border-radius: 50%;
-    position: absolute;
-    top: -12rpx;
-    left: -12rpx;
-    background: #F5F5F5;
-    z-index: 2;
-  }
-
-  .ball-two {
-    width: 24rpx;
-    height: 24rpx;
-    border-radius: 50%;
-    position: absolute;
-    background: #F5F5F5;
-    z-index: 10;
-    bottom: -12rpx;
-    left: -12rpx;
-  }
-
-  .shop-index {
-    width: 100%;
-    min-height: 100vh;
-    height: auto;
-    position: relative;
-  }
-
-  .right-only-right-red {
-    width: 44rpx;
-    height: 44rpx;
-    line-height: 40rpx;
-    border-radius: 12rpx;
-    border: 1rpx solid #41ABF5;
-    color: #41ABF5;
-  }
-
-  .right-only-right-add {
-    width: 44rpx;
-    height: 44rpx;
-    line-height: 40rpx;
-    background: linear-gradient(117deg, #57CAFF 0%, #41ABF5 100%);
-    border-radius: 12rpx;
-  }
-
-  .right-only-right-2 {
-    min-width: 50rpx;
-  }
-
-  .w-514 {
-    width: 514rpx;
-  }
-
-  .bg-img {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 300rpx;
-    transition: linear .3s all;
-    // height: 300rpx;
-  }
-
-  .bg-img-type {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    // opacity: 100;
-    transition: linear .3s all;
-  }
-
-  .mb-box {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 300rpx;
-    z-index: -1;
-  }
-
-
-  .nav-img {
-    width: 56rpx;
-    height: 56rpx;
-  }
-
-  .shop-buttom-money {
-    width: 100%;
-    // height: 140rpx;
-    background: rgba(255, 255, 255, 0.8);
-    padding-left: 24rpx;
-    padding-right: 24rpx;
-    padding-bottom: calc(env(safe-area-inset-bottom) + 12rpx);
-    padding-top: 22rpx;
-    // padding: 20rpx 24rpx;
-    position: fixed;
-    left: 0;
-    bottom: 0;
-    z-index: 5;
-  }
-
-  .shop-buttom-num {
-    width: 32rpx;
-    height: 32rpx;
-    line-height: 32rpx;
-    border-radius: 50%;
-    position: absolute;
-    top: 0rpx;
-    left: 85rpx;
-    border: 1rpx solid #FFFFFF;
-  }
-
-  .shop-buttom-money-2 {
-    width: 200rpx;
-    height: 80rpx;
-    line-height: 80rpx;
-    background: linear-gradient(270deg, #FF3333 0%, #FE6122 100%);
-  }
-
-  .info-box-top {}
-
-  .box-top-right {
-    width: 100rpx;
-    height: 100rpx;
-    border-radius: 12rpx;
-  }
-
-  .box-top-left {}
-
-  .top-left-1 {
-    width: 480rpx;
-    margin-bottom: 8rpx;
-  }
-
-  .img-x {
-    width: 24rpx;
-    height: 24rpx;
-  }
-
-  .buy-card {
-    height: 828rpx;
-    background-color: #fff;
-    border-radius: 24rpx 24rpx 0rpx 0rpx;
-  }
-
-  .buy-card-top {
-    width: 100%;
-    height: 92rpx;
-    background: #FCF5DB;
-    border-radius: 24rpx 24rpx 0rpx 0rpx;
-  }
-
-  .buy-card-item {
-    width: 100%;
-    height: 176rpx;
-    margin-bottom: 32rpx;
-  }
-
-  .goods_img {
-    width: 152rpx;
-    height: 152rpx;
-    border-radius: 12rpx;
-    margin-right: 20rpx;
-  }
-
-  .shop-buttom-money-1 {
-    width: 100%;
-    height: 96rpx;
-    position: relative;
-  }
-
-  .gwc-img {
-    width: 88rpx;
-    height: 88rpx;
-  }
-
-  .head-box {
-    width: 100%;
-    position: relative;
-  }
-
-  .shop-info-box {
-    box-shadow: 0rpx 8rpx 56rpx 0rpx rgba(154, 152, 152, 0.34);
-  }
-
-  .info-box-quan-list {
-    width: 164rpx;
-    height: 48rpx;
-    margin: 0 8rpx 8rpx 0;
-    position: relative;
-
-    image {
-      width: 164rpx;
-      height: 48rpx;
-      position: absolute;
-      top: 0;
-      left: 0;
-      z-index: 1;
-    }
-  }
-
-  .quan-list-1 {
-    position: absolute;
-    top: 3rpx;
-    left: 8rpx;
-    z-index: 2;
-  }
-
-  .quan-list-2 {
-    position: absolute;
-    top: 8rpx;
-    right: 22rpx;
-    z-index: 2;
-  }
-
-  .shop-type-list {
-    // height: 88rpx;
-    position: relative;
-  }
-
-  .shop-item {
-    position: relative;
-  }
-
-  .pj-num {
-    position: absolute;
-    right: -80rpx;
-    top: 0;
-    text-align: left;
-    width: 80rpx;
-  }
-
-  .shop-item-bs {
-    position: absolute;
-    bottom: 0;
-    width: 40rpx;
-    height: 6rpx;
-    border-radius: 20rpx;
-    transition: left 0.5s;
-  }
-
-  .sticky-nav {
-    width: 100%;
-    position: sticky;
-    z-index: 3;
-  }
-
-  .wh-44 {
-    width: 44rpx;
-    height: 44rpx;
-  }
-
-  .menu-box-left-f {
-    position: sticky;
-    // transition: all .3s ease;
-    // overflow: auto;
-  }
-
-  .menu-box-left {
-    width: 160rpx;
-    height: auto;
-    position: sticky;
-    overflow: auto;
-    // transition: all .3s ease;
-    // height: 100%;
-    // background-color: #F7F8FA;
-    // position: absolute;
-    // left: 0;
-    // top: 0;
-    // border-radius: 0rpx 20rpx 0 0rpx;
-  }
-
-  .menu-box-left-box {
-    overflow-y: auto;
-  }
-
-  .menu-type-list {
-    width: 160rpx;
-    min-height: 108rpx;
-    padding: 18rpx 28rpx;
-    position: relative;
-    z-index: 10;
-
-    .menu-type-num {
-      position: absolute;
-      top: 2rpx;
-      right: 8rpx;
-      padding: 0 6rpx;
-      min-width: 20rpx;
-      height: 32rpx;
-      text-align: center;
-      line-height: 32rpx;
-      background: #FB3D03;
-      border-radius: 50%;
-    }
-  }
-
-  .menu-type-list-f {
-    // width: 160rpx;
-    background-color: #007AFF;
-
-    width: 100%;
-    height: 100%;
-    overflow-y: auto;
-    /* 如果分类项很多,允许内部滚动 */
-    -webkit-overflow-scrolling: touch;
-    /* 改善移动端滚动体验 */
-    // height: 100%;
-  }
-
-  .menu-box-only {
-    // flex: 1;
-    width: calc(100% - 160rpx);
-  }
-
-  .menu-box-right {
-    // flex: 1;
-    width: 100%;
-    height: 100%;
-    // padding: 16rpx 0;
-    // box-sizing: border-box;
-    // position: relative;
-  }
-
-  .menu-list {
-    width: 100%;
-    padding: 0 20rpx 40rpx;
-    // height: 200rpx;
-    // margin-bottom: 40rpx;
-
-    .goods_img {
-      width: 200rpx;
-      height: 200rpx;
-      border-radius: 12rpx;
-      margin-right: 16rpx;
-    }
-
-    .menu-list-right {
-      flex: 1;
-
-      .right-only-right {
-        width: 100rpx;
-        height: 44rpx;
-        background: linear-gradient(117deg, #57CAFF 0%, #41ABF5 100%);
-        border-radius: 12rpx;
-        line-height: 44rpx;
-        position: relative;
-
-        .selectedNum {
-          position: absolute;
-          right: 2rpx;
-          top: -22rpx;
-          font-size: 24rpx;
-          color: #fff;
-          width: 32rpx;
-          height: 32rpx;
-          line-height: 32rpx;
-          background: #FB3D03;
-          border-radius: 50%;
-        }
-      }
-
-      .right-only-right-red {
-        width: 44rpx;
-        height: 44rpx;
-        line-height: 40rpx;
-        border-radius: 12rpx;
-        border: 1rpx solid #41ABF5;
-        color: #41ABF5;
-      }
-
-      .right-only-right-add {
-        width: 44rpx;
-        height: 44rpx;
-        line-height: 40rpx;
-        background: linear-gradient(117deg, #57CAFF 0%, #41ABF5 100%);
-        border-radius: 12rpx;
-      }
-
-      .right-only-right-2 {
-        min-width: 50rpx;
-      }
-    }
-  }
-</style>
+	.zh-icon {
+		width: 32rpx;
+		height: 32rpx;
+	}
+
+	.shp-list-img {
+		width: 40rpx;
+		height: 40rpx;
+	}
+
+	.dd-box {
+		width: 144rpx;
+		padding: 12rpx 0;
+		background: rgba(0, 0, 0, 0.14);
+	}
+
+	.ss-box {
+		width: 64rpx;
+		height: 64rpx;
+		background: rgba(0, 0, 0, 0.14);
+	}
+
+	.shop-search {
+		width: 40rpx;
+		height: 40rpx;
+	}
+
+	.wh-44 {
+		width: 44rpx;
+		height: 44rpx;
+	}
+
+	.blank-text {
+		line-height: 32vh;
+	}
+
+	.box-title {
+		position: relative;
+	}
+
+	.box-close {
+		position: absolute;
+		right: 22rpx;
+	}
+
+	.pop-coupon {
+		width: 100%;
+		height: 42vh;
+		background-color: #F5F4F9;
+		border-radius: 24rpx 24rpx 0rpx 0rpx;
+		padding-top: 32rpx !important;
+		display: flex;
+		flex-direction: column;
+	}
+
+	.item-right {
+		padding: 24rpx;
+		box-sizing: border-box;
+		border-radius: 20rpx 0 0 20rpx;
+		position: relative;
+	}
+
+	.item-hr {
+		width: 0px;
+		height: auto;
+		border-right: 1rpx dashed #FB7850;
+	}
+
+	.item-hr-two {
+		width: 0px;
+		height: auto;
+		border-right: 1rpx dashed #999;
+	}
+
+	.item-left {
+		width: 220rpx;
+		height: auto;
+		padding: 20rpx 24rpx;
+		box-sizing: border-box;
+		position: relative;
+		border-radius: 0 20rpx 20rpx 0;
+	}
+
+	.but-box {
+		width: 152rpx;
+		height: 52rpx;
+		line-height: 52rpx;
+		text-align: center;
+		background: linear-gradient(225deg, #FB3D03 0%, #FF6901 100%);
+		border-radius: 200rpx;
+	}
+
+	.ball {
+		width: 24rpx;
+		height: 24rpx;
+		border-radius: 50%;
+		position: absolute;
+		top: -12rpx;
+		left: -12rpx;
+		background: #F5F5F5;
+		z-index: 2;
+	}
+
+	.ball-two {
+		width: 24rpx;
+		height: 24rpx;
+		border-radius: 50%;
+		position: absolute;
+		background: #F5F5F5;
+		z-index: 10;
+		bottom: -12rpx;
+		left: -12rpx;
+	}
+
+	.shop-index {
+		width: 100%;
+		min-height: 100vh;
+		height: auto;
+		position: relative;
+	}
+
+	.right-only-right-red {
+		width: 44rpx;
+		height: 44rpx;
+		line-height: 40rpx;
+		border-radius: 12rpx;
+		border: 1rpx solid #41ABF5;
+		color: #41ABF5;
+	}
+
+	.right-only-right-add {
+		width: 44rpx;
+		height: 44rpx;
+		line-height: 40rpx;
+		background: linear-gradient(117deg, #57CAFF 0%, #41ABF5 100%);
+		border-radius: 12rpx;
+	}
+
+	.right-only-right-2 {
+		min-width: 50rpx;
+	}
+
+	.w-514 {
+		width: 514rpx;
+	}
+
+	.bg-img {
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 300rpx;
+		transition: linear .3s all;
+		// height: 300rpx;
+	}
+
+	.bg-img-type {
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		// opacity: 100;
+		transition: linear .3s all;
+	}
+
+	.mb-box {
+		position: absolute;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 300rpx;
+		z-index: -1;
+	}
+
+
+	.nav-img {
+		width: 56rpx;
+		height: 56rpx;
+	}
+
+	.shop-buttom-money {
+		width: 100%;
+		// height: 140rpx;
+		background: rgba(255, 255, 255, 0.8);
+		padding-left: 24rpx;
+		padding-right: 24rpx;
+		padding-bottom: calc(env(safe-area-inset-bottom) + 12rpx);
+		padding-top: 22rpx;
+		// padding: 20rpx 24rpx;
+		position: fixed;
+		left: 0;
+		bottom: 0;
+		z-index: 5;
+	}
+
+	.pop-shop-buttom-money {
+		width: 100%;
+		// height: 140rpx;
+		background: #ECECEC;
+		padding-left: 24rpx;
+		padding-right: 24rpx;
+		padding-bottom: calc(env(safe-area-inset-bottom) + 12rpx);
+		padding-top: 22rpx;
+		position: fixed;
+		left: 0;
+		bottom: 0;
+		z-index: 5;
+	}
+
+	.shop-buttom-num {
+		width: 32rpx;
+		height: 32rpx;
+		line-height: 32rpx;
+		border-radius: 50%;
+		position: absolute;
+		top: 0rpx;
+		left: 85rpx;
+		border: 1rpx solid #FFFFFF;
+	}
+
+	.shop-buttom-money-2 {
+		width: 200rpx;
+		height: 80rpx;
+		line-height: 80rpx;
+		background: linear-gradient(270deg, #FF3333 0%, #FE6122 100%);
+	}
+
+	.info-box-top {}
+
+	.box-top-right {
+		width: 100rpx;
+		height: 100rpx;
+		border-radius: 12rpx;
+	}
+
+	.box-top-left {}
+
+	.top-left-1 {
+		width: 480rpx;
+		margin-bottom: 8rpx;
+	}
+
+	.img-x {
+		width: 24rpx;
+		height: 24rpx;
+	}
+
+	.buy-card {
+		height: 920rpx;
+		border-radius: 24rpx 24rpx 0rpx 0rpx;
+	}
+
+	.buy-card-top {
+		width: 100%;
+		height: 92rpx;
+		background: #FCF5DB;
+		border-radius: 24rpx 24rpx 0rpx 0rpx;
+	}
+
+	.buy-card-item {
+		width: 100%;
+		height: 176rpx;
+		margin-bottom: 32rpx;
+	}
+
+	.goods_img {
+		width: 152rpx;
+		height: 152rpx;
+		border-radius: 12rpx;
+		margin-right: 20rpx;
+	}
+
+	.shop-buttom-money-1 {
+		width: 100%;
+		height: 96rpx;
+		position: relative;
+	}
+
+	.gwc-img {
+		width: 88rpx;
+		height: 88rpx;
+	}
+
+	.head-box {
+		width: 100%;
+		position: relative;
+	}
+
+	.shop-info-box {
+		box-shadow: 0rpx 8rpx 56rpx 0rpx rgba(154, 152, 152, 0.34);
+	}
+
+	.info-box-quan-list {
+		width: 164rpx;
+		height: 48rpx;
+		margin: 0 8rpx 8rpx 0;
+		position: relative;
+
+		image {
+			width: 164rpx;
+			height: 48rpx;
+			position: absolute;
+			top: 0;
+			left: 0;
+			z-index: 1;
+		}
+	}
+
+	.quan-list-1 {
+		position: absolute;
+		top: 3rpx;
+		left: 8rpx;
+		z-index: 2;
+	}
+
+	.quan-list-2 {
+		position: absolute;
+		top: 8rpx;
+		right: 22rpx;
+		z-index: 2;
+	}
+
+	.shop-type-list {
+		// height: 88rpx;
+		position: relative;
+	}
+
+	.shop-item {
+		position: relative;
+	}
+
+	.pj-num {
+		position: absolute;
+		right: -80rpx;
+		top: 0;
+		text-align: left;
+		width: 80rpx;
+	}
+
+	.shop-item-bs {
+		position: absolute;
+		bottom: 0;
+		width: 40rpx;
+		height: 6rpx;
+		border-radius: 20rpx;
+		transition: left 0.5s;
+	}
+
+	.sticky-nav {
+		width: 100%;
+		position: sticky;
+		z-index: 3;
+	}
+
+	.wh-44 {
+		width: 44rpx;
+		height: 44rpx;
+	}
+
+	.menu-box-left-f {
+		position: sticky;
+		// transition: all .3s ease;
+		// overflow: auto;
+	}
+
+	.menu-box-left {
+		width: 160rpx;
+		height: auto;
+		position: sticky;
+		overflow: auto;
+		// transition: all .3s ease;
+		// height: 100%;
+		// background-color: #F7F8FA;
+		// position: absolute;
+		// left: 0;
+		// top: 0;
+		// border-radius: 0rpx 20rpx 0 0rpx;
+	}
+
+	.menu-box-left-box {
+		overflow-y: auto;
+	}
+
+	.menu-type-list {
+		width: 160rpx;
+		min-height: 108rpx;
+		padding: 18rpx 28rpx;
+		position: relative;
+		z-index: 10;
+
+		.menu-type-num {
+			position: absolute;
+			top: 2rpx;
+			right: 8rpx;
+			padding: 0 6rpx;
+			min-width: 20rpx;
+			height: 32rpx;
+			text-align: center;
+			line-height: 32rpx;
+			background: #FB3D03;
+			border-radius: 50%;
+		}
+	}
+
+	.menu-type-list-f {
+		// width: 160rpx;
+		background-color: #007AFF;
+
+		width: 100%;
+		height: 100%;
+		overflow-y: auto;
+		/* 如果分类项很多,允许内部滚动 */
+		-webkit-overflow-scrolling: touch;
+		/* 改善移动端滚动体验 */
+		// height: 100%;
+	}
+
+	.menu-box-only {
+		// flex: 1;
+		width: calc(100% - 160rpx);
+	}
+
+	.menu-box-right {
+		// flex: 1;
+		width: 100%;
+		height: 100%;
+		// padding: 16rpx 0;
+		// box-sizing: border-box;
+		// position: relative;
+	}
+
+	.menu-list {
+		width: 100%;
+		padding: 0 20rpx 40rpx;
+		// height: 200rpx;
+		// margin-bottom: 40rpx;
+
+		.goods_img {
+			width: 200rpx;
+			height: 200rpx;
+			border-radius: 12rpx;
+			margin-right: 16rpx;
+		}
+
+		.menu-list-right {
+			flex: 1;
+
+			.right-only-right {
+				width: 100rpx;
+				height: 44rpx;
+				background: linear-gradient(117deg, #57CAFF 0%, #41ABF5 100%);
+				border-radius: 12rpx;
+				line-height: 44rpx;
+				position: relative;
+
+				.selectedNum {
+					position: absolute;
+					right: 2rpx;
+					top: -22rpx;
+					font-size: 24rpx;
+					color: #fff;
+					width: 32rpx;
+					height: 32rpx;
+					line-height: 32rpx;
+					background: #FB3D03;
+					border-radius: 50%;
+				}
+			}
+
+			.right-only-right-red {
+				width: 44rpx;
+				height: 44rpx;
+				line-height: 40rpx;
+				border-radius: 12rpx;
+				border: 1rpx solid #41ABF5;
+				color: #41ABF5;
+			}
+
+			.right-only-right-add {
+				width: 44rpx;
+				height: 44rpx;
+				line-height: 40rpx;
+				background: linear-gradient(117deg, #57CAFF 0%, #41ABF5 100%);
+				border-radius: 12rpx;
+			}
+
+			.right-only-right-2 {
+				min-width: 50rpx;
+			}
+		}
+	}
+</style>

+ 275 - 0
pages-takeout/new-specs-info.vue

@@ -0,0 +1,275 @@
+<template>
+	<view class="flex-common-css iPhone-bottom box-border-box bgc-f">
+		<newNav :leftShow="false" :textType='false' class="z-4" @navHeight='navHeight'>
+			<view slot="leftContent" class="align-items-center nav-left-box pl-32 box-border-box">
+				<view class="nav-left box-border-box b-rad-32 align-items-center flex-justify-space">
+					<uni-icons type="left" size="25" :color="leftIconColor" @click="goBack"></uni-icons>
+					<view class="align-items-center">
+						<view class="hr mr-16"></view>
+						<image class="fx-icon" src="/static/img/order-food/fx.png" mode=""></image>
+					</view>
+				</view>
+			</view>
+		</newNav>
+		<image class="goods-img" src="/pages-buy/static/fl-bg.png" mode="aspectFill"></image>
+		<view class="image-box" :style="{height: `calc(41vh - ${newNavHeight}rpx)`}"></view>
+		<view class="goods-name-box">
+			<view class="goods-name b-rad-24-24-0-0 p-32-32-0 box-border-box bgc-f">
+				<view class="fs-36 fw-600 fc-3">
+					红烧牛肉面红烧牛111面11牛肉面牛肉面牛肉 红烧牛肉面红烧牛111面11牛肉面牛
+				</view>
+				<view class="pt-20 fs-28 fc-6">
+					商品描述商品描述商品描述
+				</view>
+			</view>
+		</view>
+		<view class="scroll-view-css plr-32 box-border-box">
+			<view class="b-t-eee ptb-30">
+				<view class="mb-16" v-for="(item,i) in specsData" :key="i">
+					<view class="fs-28 fc-7 mb-16">
+						{{item.sku_name}}
+					</view>
+					<view class="align-items-center flex-wrap-wrap w-add-16">
+						<view
+							class="specs-item b-rad-12 align-items-center flex-justify-center mr-16 mb-16 plr-12 box-border-box"
+							:class="postData.goods_spec_id.indexOf(info.spec_id)>=0?'s-item fc-FF3333 bgc-FAE9E9 b-FF3333':'n-item bgc-F5F5F5 fc-0'"
+							v-for="(info,index_two) in item.spec_list" :key="index_two" @click="selectSpec(info,i)">
+							<view class="align-items-center">
+								<view class="count-box b-rad-50 bgc-FE6B2C fs-22 fc-f text-align-center"
+									v-if="item.affect_quantity === 1">
+									0
+								</view>
+								<view class="align-items-center">
+									<view class="">
+										{{info.spec_name}}
+									</view>
+									<view class="" v-if="info.spec_price">
+										¥{{info.spec_price}}
+									</view>
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="bot-box box-border-box">
+			<view class="align-items-center flex-justify-space mb-20">
+				<view class="">
+					<view class="align-items-baseline">
+						<view class="fs-32 fc-3 fw-600 mr-4">
+							¥
+						</view>
+						<view class="fs-48 fc-3 fw-600">
+							80.9
+						</view>
+					</view>
+					<view class="fs-24 fc-9">
+						不辣、煎蛋
+					</view>
+				</view>
+				<view class="align-items-center">
+					<image class="cz-img" src="@/static/img/order-food/reduce-img.png" mode=""></image>
+					<view class="plr-16 fs-32 fc-3 fw-400">
+						{{postData.number}}
+					</view>
+					<image class="cz-img" src="@/static/img/order-food/add-img.png" mode=""></image>
+				</view>
+			</view>
+			<view class="but-box text-align-center fs-32 fc-f fw-600 b-rad-200">
+				加入购物车
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import {
+		getGoodsGoodsSpec
+	} from "@/api/goods.js"
+	export default {
+		components: {},
+		data() {
+			return {
+				infoData: {},
+				newNavHeight: '',
+				specsData: [{
+					sku_name: '口味',
+					sku_id: 8,
+					sku_type: 1, //1:单选, 2:多选
+					affect_quantity: 0, //是否影响购物车数量: 0-不影响, 1-影响
+					spec_list: [{
+						spec_name: '不辣',
+						spec_id: 0
+					}, {
+						spec_name: '微辣',
+						spec_id: 1
+					}, {
+						spec_name: '微辣',
+						spec_id: 2
+					}, {
+						spec_name: '微辣',
+						spec_id: 3
+					}]
+				}, {
+					sku_name: '小料',
+					sku_type: 2,
+					sku_id: 9,
+					affect_quantity: 1, //是否影响购物车数量: 0-不影响, 1-影响
+					spec_list: [{
+						spec_name: '煎蛋',
+						spec_price: '3',
+						spec_id: 4
+					}, {
+						spec_name: '牛肉',
+						spec_price: '8',
+						spec_id: 5
+					}, {
+						spec_name: '卤蛋',
+						spec_price: '2',
+						spec_id: 6
+					}, {
+						spec_name: '卤蛋',
+						spec_price: '2',
+						spec_id: 7
+					}]
+				}],
+				spec_key: [],
+				postData: {
+					shop_id: '',
+					goods_id: '',
+					category_id: '',
+					goods_spec_id: '',
+					number: 1
+				}
+			}
+		},
+		onLoad(data) {},
+		mounted() {
+			this.addSpecNum()
+		},
+		methods: {
+			addSpecNum() {
+				this.specsData.forEach((v, k) => {
+					if (v.affect_quantity === 1) {
+						v.spec_list.forEach(spec => {
+							// 添加数量字段,默认为0
+							spec.spec_num = 0;
+							// 或者如果你想要存储选中状态:
+							// spec.quantity = 0;
+							// spec.selected = false; // 对于多选规格
+						});
+					}
+				})
+				setTimeout(() => {
+					console.log(this.specsData, '111111');
+				}, 1000)
+			},
+			getGoodsGoodsSpec() {
+				getGoodsGoodsSpec({
+					goods_id: '5354'
+				}).then((res) => {
+					if (res.code * 1 === 1) {
+						console.log(res);
+					}
+				})
+			},
+			navHeight(e) {
+				this.newNavHeight = e
+			},
+			goBack() {
+				uni.navigateBack({
+					delta: 1
+				})
+			},
+			selectSpec(info, groupKey) {
+
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.nav-left-box {
+		width: 100%;
+		height: 100%;
+	}
+
+	.nav-left {
+		width: 174rpx;
+		height: 100%;
+		background: rgba(255, 255, 255, 0.45);
+		border: 1rpx solid #E3E6EB;
+		padding: 0 20rpx 0 14rpx;
+	}
+
+	.goods-img {
+		width: 100%;
+		height: 41vh;
+		position: absolute;
+		top: 0;
+		left: 0;
+	}
+
+	.fx-icon {
+		width: 48rpx;
+		height: 48rpx;
+	}
+
+	.hr {
+		width: 1rpx;
+		height: 36rpx;
+		background: #e7e7e7;
+	}
+
+	.goods-name-box {
+		position: relative;
+	}
+
+	.goods-name {
+		width: 100%;
+		position: relative;
+		top: -32rpx;
+		left: 0;
+	}
+
+	.bot-box {
+		padding: 20rpx 32rpx 12rpx;
+		box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(51, 51, 51, 0.1);
+	}
+
+	.cz-img {
+		width: 44rpx;
+		height: 44rpx;
+	}
+
+	.but-box {
+		width: 100%;
+		height: 96rpx;
+		line-height: 96rpx;
+		background: linear-gradient(270deg, #FF3333 0%, #FE6122 100%);
+	}
+
+	.specs-item {
+		position: relative;
+		min-width: 218rpx;
+		height: 72rpx;
+	}
+
+	.w-add-16 {
+		width: calc(100% + 22rpx);
+	}
+
+	.item-box {
+		position: relative;
+	}
+
+	.count-box {
+		width: 28rpx;
+		height: 28rpx;
+		line-height: 28rpx;
+		position: absolute;
+		right: -8rpx;
+		top: -8rpx;
+	}
+</style>

+ 7 - 12
pages-takeout/shop-mod/info.vue

@@ -6,23 +6,23 @@
 				<image src="@/static/img/takeout/info-address.png" mode=""></image>
 				<view class="fs-28 fw-400">{{shopInfoData.city_name}}{{shopInfoData.shop_name}}</view>
 			</view>
-			<view class="mb-40 align-items-center">
+<!-- 			<view class="mb-40 align-items-center">
 				<image src="@/static/img/takeout/info-class.png" mode=""></image>
 				<view class="fs-28 fw-400">门店类目:{{shopInfoData.cate_name}}</view>
-			</view>
+			</view> -->
 			<view class="mb-40 align-items-center">
 				<image src="@/static/img/takeout/info-time.png" mode=""></image>
 				<view class="fs-28 fw-400">营业时间:{{timeData}}</view>
 			</view>
-			<view class="mb-40 align-items-center">
+			<view class="align-items-center">
 				<image src="@/static/img/takeout/info-phone.png" mode=""></image>
 				<view class="fs-28 fw-400">联系电话:{{shopInfoData.shop_phone}} </view>
 			</view>
-			<view class="right-img-f align-items-center" @click.stop="to()">
+<!-- 			<view class="right-img-f align-items-center" @click.stop="to()">
 				<image src="@/static/img/takeout/info-zz.png" mode=""></image>
 				<view class="fs-28 fw-400">查看营业资质 </view>
 				<image  class="right-img" src="@/static/img/toRight.png" mode=""></image>
-			</view>
+			</view> -->
 		</view>
 
 		<view class="box-card box-border-box p-24 bgc-f mb-20">
@@ -60,11 +60,6 @@
 			this.shopInfo()
 		},
 		methods: {
-			to() {
-				uni.navigateTo({
-					url: '/pages-takeout/aptitude?shopId='+this.shopId
-				})
-			},
 			shopInfo() {
 				const operate_id = uni.getStorageSync('operate_id')
 				shopInfo({
@@ -111,8 +106,8 @@
 			border-radius: 20rpx;
 
 			image {
-				width: 40rpx;
-				height: 40rpx;
+				width: 32rpx;
+				height: 32rpx;
 				margin-right: 16rpx;
 			}
 

+ 14 - 8
pages.json

@@ -188,12 +188,18 @@
 						"navigationBarTitleText": "店铺"
 					}
 				},
-        {
-        	"path": "new-shop",
-        	"style": {
-        		"navigationBarTitleText": "演示店铺"
-        	}
-        },
+				{
+					"path": "new-shop",
+					"style": {
+						"navigationBarTitleText": "店铺"
+					}
+				},
+				{
+					"path": "new-specs-info",
+					"style": {
+						"navigationBarTitleText": "规格选择"
+					}
+				},
 				{
 					"path": "aptitude",
 					"style": {
@@ -495,8 +501,8 @@
 			},
 			{
 				"name": "店铺详情",
-				"path": "pages-takeout/pay-page",
-				"query": "orderId=4"
+				"path": "pages-takeout/new-specs-info",
+				"query": ""
 			}
 		]
 	}

BIN
static/img/order-food/fx.png


BIN
static/img/order-food/reduce-img.png