更新

ghsApp/src/admin/cp/item.vue

@@ -231,7 +231,7 @@
 				uni.hideLoading()
 				if(res.code == 1){
 					that.posterUrl = res.data.imgUrl
-					that.$refs.posterShow.open('top')
+					that.$refs.posterShow.open('center')
 				}
 			})
 		},
@@ -243,7 +243,7 @@
 				uni.hideLoading()
 				if(res.code == 1){
 					that.posterUrl = res.data.imgUrl
-					that.$refs.posterShow.open('top')
+					that.$refs.posterShow.open('center')
 				}
 			})
 		},

ghsApp/src/admin/item/components/item-poster-popup.vue

@@ -1,114 +1,149 @@
-<template>
-	<uni-popup ref="posterPopup" background-color="transparent" type="center" :animation="true" class="class-popup-style poster-popup-root">
-		<view class="poster-popup-wrap">
-			<view class="poster-popup-head">
-				<text class="poster-popup-title">{{ title }}</text>
-				<text class="poster-close" @click="onClose">×</text>
-			</view>
-			<view class="poster-img-wrap">
-				<image class="poster-img" :src="posterUrl" mode="widthFix" show-menu-by-longpress />
-			</view>
-			<text class="poster-tip">长按图片可保存，或点击下方按钮</text>
-			<view class="poster-save-wrap">
-				<button class="admin-button-com big blue poster-save-btn" @click="onSave">保存到相册</button>
-			</view>
-		</view>
-	</uni-popup>
-</template>
-
-<script>
-export default {
-	name: 'ItemPosterPopup',
-	props: {
-		posterUrl: {
-			type: String,
-			default: ''
-		},
-		title: {
-			type: String,
-			default: '分享海报'
-		}
-	},
-	methods: {
-		open() {
-			this.$refs.posterPopup.open('top')
-		},
-		close() {
-			this.$refs.posterPopup.close()
-		},
-		onClose() {
-			this.close()
-			this.$emit('close')
-		},
-		onSave() {
-			this.$emit('save')
-		}
-	}
-}
-</script>
-
-<style lang="scss" scoped>
-.poster-popup-wrap {
-	display: flex;
-	width: 86vw;
-	max-width: 640upx;
-	padding: 28upx 28upx 36upx;
-	flex-direction: column;
-	align-items: center;
-	max-height: 92vh;
-	overflow: auto;
-	background: #fff;
-	border-radius: 24upx;
-	box-shadow: 0 16upx 48upx rgba(0, 0, 0, 0.18);
-}
-
-.poster-popup-head {
-	width: 100%;
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	margin-bottom: 8upx;
-}
-
-.poster-popup-title {
-	font-size: 32upx;
-	font-weight: 600;
-	color: #1a1a1a;
-}
-
-.poster-close {
-	font-size: 52upx;
-	line-height: 1;
-	color: #999;
-	padding: 0 8upx;
-}
-
-.poster-img-wrap {
-	width: 100%;
-	text-align: center;
-	margin-top: 16upx;
-}
-
-.poster-img {
-	width: 100%;
-	margin: 0 auto;
-	border-radius: 12upx;
-	box-shadow: 0 8upx 24upx rgba(0, 0, 0, 0.12);
-}
-
-.poster-tip {
-	margin-top: 20upx;
-	font-size: 24upx;
-	color: #999;
-}
-
-.poster-save-wrap {
-	width: 100%;
-	margin-top: 28upx;
-	text-align: center;
-}
-
-.poster-save-btn {
-	width: 320upx;
-}
-</style>
+<template>
+	<uni-popup ref="posterPopup" background-color="transparent" type="top" :animation="true" class="poster-popup-root">
+		<view class="poster-popup-wrap">
+			<view class="poster-popup-head">
+				<text class="poster-popup-title">{{ title }}</text>
+				<text class="poster-close" @click="onClose">×</text>
+			</view>
+			<view class="poster-body">
+				<view class="poster-img-wrap">
+					<image class="poster-img" :src="posterUrl" mode="widthFix" show-menu-by-longpress />
+				</view>
+				<text class="poster-tip">长按图片可保存，或点击下方按钮</text>
+				<view class="poster-actions">
+					<button class="admin-button-com big default poster-action-btn" @click="onClose">取消</button>
+					<button class="admin-button-com big blue poster-action-btn" @click="onSave">保存到相册</button>
+				</view>
+			</view>
+		</view>
+	</uni-popup>
+</template>
+
+<script>
+export default {
+	name: 'ItemPosterPopup',
+	props: {
+		posterUrl: {
+			type: String,
+			default: ''
+		},
+		title: {
+			type: String,
+			default: '分享海报'
+		}
+	},
+	methods: {
+		open() {
+			this.$refs.posterPopup.open('top')
+		},
+		close() {
+			this.$refs.posterPopup.close()
+		},
+		onClose() {
+			this.close()
+			this.$emit('close')
+		},
+		onSave() {
+			this.$emit('save')
+		}
+	}
+}
+</script>
+
+<style lang="scss" scoped>
+.poster-popup-root {
+	z-index: 999999;
+}
+
+::v-deep .uni-popup.top .uni-popup__wrapper {
+	width: 100% !important;
+	display: flex !important;
+	justify-content: center !important;
+	align-items: flex-start !important;
+}
+
+.poster-popup-wrap {
+	display: flex;
+	width: 100%;
+	padding: 28upx 0 36upx;
+	flex-direction: column;
+	align-items: stretch;
+	max-height: 92vh;
+	overflow: auto;
+	background: #fff;
+	border-radius: 0 0 24upx 24upx;
+	box-shadow: 0 16upx 48upx rgba(0, 0, 0, 0.18);
+	box-sizing: border-box;
+}
+
+.poster-popup-head {
+	width: 100%;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	padding: 0 28upx;
+	margin-bottom: 8upx;
+	box-sizing: border-box;
+}
+
+.poster-popup-title {
+	font-size: 32upx;
+	font-weight: 600;
+	color: #1a1a1a;
+}
+
+.poster-close {
+	font-size: 52upx;
+	line-height: 1;
+	color: #999;
+	padding: 0 8upx;
+}
+
+.poster-body {
+	width: 100%;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+}
+
+.poster-img-wrap {
+	width: 100%;
+	display: flex;
+	justify-content: center;
+	margin-top: 16upx;
+	padding: 0 28upx;
+	box-sizing: border-box;
+}
+
+.poster-img {
+	width: 100%;
+	max-width: 640upx;
+	border-radius: 12upx;
+	box-shadow: 0 8upx 24upx rgba(0, 0, 0, 0.12);
+}
+
+.poster-tip {
+	margin-top: 20upx;
+	font-size: 24upx;
+	color: #999;
+	text-align: center;
+}
+
+.poster-actions {
+	width: 100%;
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	margin-top: 28upx;
+	padding: 0 28upx;
+	box-sizing: border-box;
+}
+
+.poster-action-btn {
+	flex: 1;
+}
+
+.poster-action-btn + .poster-action-btn {
+	margin-left: 24upx;
+}
+</style>

ghsApp/src/admin/item/list.vue

@@ -308,7 +308,7 @@ export default {
 				uni.hideLoading()
 				if(res.code == 1){
 					that.posterUrl = res.data.imgUrl
-					that.$refs.posterShow.open('top')
+					that.$refs.posterShow.open('center')
 				}
 			})
 		},
@@ -320,7 +320,7 @@ export default {
 				uni.hideLoading()
 				if(res.code == 1){
 					that.posterUrl = res.data.imgUrl
-					that.$refs.posterShow.open('top')
+					that.$refs.posterShow.open('center')
 				}
 			})
 		},

ghsApp/src/admin/item/selectList.vue

@@ -256,7 +256,7 @@ export default {
 				uni.hideLoading()
 				if(res.code == 1){
 					that.posterUrl = res.data.imgUrl
-					that.$refs.posterShow.open('top')
+					that.$refs.posterShow.open('center')
 				}
 			})
 		},
@@ -268,7 +268,7 @@ export default {
 				uni.hideLoading()
 				if(res.code == 1){
 					that.posterUrl = res.data.imgUrl
-					that.$refs.posterShow.open('top')
+					that.$refs.posterShow.open('center')
 				}
 			})
 		},

hdApp/src/admin/goods/list.vue

@@ -193,21 +193,7 @@
       </view>
     </uni-popup>
 
-    <uni-popup ref="posterShow" background-color="transparent" type="center" :animation="true" class="class-popup-style poster-popup-root">
-      <view class="poster-popup-wrap">
-        <view class="poster-popup-head">
-          <text class="poster-popup-title">分享海报</text>
-          <text class="poster-close" @click="closePoster()">×</text>
-        </view>
-        <view class="poster-img-wrap">
-          <image class="poster-img" :src="posterUrl" mode="widthFix" show-menu-by-longpress />
-        </view>
-        <text class="poster-tip">长按图片可保存，或点击下方按钮</text>
-        <view class="poster-save-wrap">
-          <button class="admin-button-com big blue poster-save-btn" @click="downloadImg">保存到相册</button>
-        </view>
-      </view>
-    </uni-popup>
+    <item-poster-popup ref="itemPosterPopup" :poster-url="posterUrl" @close="closePoster" @save="downloadImg" />
 
   </view>
 </template>
@@ -216,13 +202,15 @@ import AppSearchModule from "@/components/module/app-search"
 import AppWrapperEmpty from "@/components/app-wrapper-empty"
 import {categoryListInfo,getCategoryToGoods,print,getRise,getPoster} from "@/api/goods"
 import uniPopup from '@/uni_modules/uni-popup/components/uni-popup/uni-popup.vue'
+import ItemPosterPopup from '@/components/item-poster-popup.vue'
 import { list } from "@/mixins"
 export default {
   name: "list",
   components: {
     AppWrapperEmpty,
     AppSearchModule,
-    uniPopup
+    uniPopup,
+    ItemPosterPopup
   },
   mixins: [list],
   data() {
@@ -397,7 +385,7 @@ export default {
       this.$refs.rightShowMore.close()
     },
     closePoster() {
-      this.$refs.posterShow.close()
+      this.$refs.itemPosterPopup.close()
     },
     getMyPoster() {
       this.closeRightShow()
@@ -407,7 +395,7 @@ export default {
         uni.hideLoading()
         if (res.code == 1) {
           that.posterUrl = res.data.imgUrl
-          that.$refs.posterShow.open('top')
+          that.$refs.itemPosterPopup.open()
         }
       })
     },
@@ -420,7 +408,7 @@ export default {
             uni.saveImageToPhotosAlbum({
               filePath: res.tempFilePath,
               success() {
-                that.$refs.posterShow.close()
+                that.$refs.itemPosterPopup.close()
                 uni.showToast({ title: '保存成功' })
               }
             })
@@ -1072,67 +1060,4 @@ page {
   }
 }
 
-.poster-popup-wrap {
-  display: flex;
-  width: 86vw;
-  max-width: 640upx;
-  padding: 28upx 28upx 36upx;
-  flex-direction: column;
-  align-items: center;
-  max-height: 92vh;
-  overflow: auto;
-  background: #fff;
-  border-radius: 24upx;
-  box-shadow: 0 16upx 48upx rgba(0, 0, 0, 0.18);
-}
-
-.poster-popup-head {
-  width: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  margin-bottom: 8upx;
-}
-
-.poster-popup-title {
-  font-size: 32upx;
-  font-weight: 600;
-  color: #1a1a1a;
-}
-
-.poster-close {
-  font-size: 52upx;
-  line-height: 1;
-  color: #999;
-  padding: 0 8upx;
-}
-
-.poster-img-wrap {
-  width: 100%;
-  text-align: center;
-  margin-top: 16upx;
-}
-
-.poster-img {
-  width: 100%;
-  margin: 0 auto;
-  border-radius: 12upx;
-  box-shadow: 0 8upx 24upx rgba(0, 0, 0, 0.12);
-}
-
-.poster-tip {
-  margin-top: 20upx;
-  font-size: 24upx;
-  color: #999;
-}
-
-.poster-save-wrap {
-  width: 100%;
-  margin-top: 28upx;
-  text-align: center;
-}
-
-.poster-save-btn {
-  width: 320upx;
-}
 </style>

hdApp/src/admin/item/list2.vue

@@ -210,7 +210,7 @@
 import AppSearchModule from "@/components/module/app-search";
 import AppWrapperEmpty from "@/components/app-wrapper-empty";
 import ItemStock from "./components/item2";
-import ItemPosterPopup from "./components/item-poster-popup.vue";
+import ItemPosterPopup from '@/components/item-poster-popup.vue'
 import itemPosterMixin from "./mixins/itemPosterMixin";
 import productMins from "@/mixins/product2";
 import { mapGetters } from "vuex";

hdApp/src/admin/item/components/item-poster-popup.vue → hdApp/src/components/item-poster-popup.vue

@@ -1,16 +1,19 @@
 <template>
-	<uni-popup ref="posterPopup" background-color="transparent" type="center" :animation="true" class="class-popup-style poster-popup-root">
+	<uni-popup ref="posterPopup" background-color="transparent" type="top" :animation="true" class="poster-popup-root">
 		<view class="poster-popup-wrap">
 			<view class="poster-popup-head">
-				<text class="poster-popup-title">分享海报</text>
+				<text class="poster-popup-title">{{ title }}</text>
 				<text class="poster-close" @click="onClose">×</text>
 			</view>
-			<view class="poster-img-wrap">
-				<image class="poster-img" :src="posterUrl" mode="widthFix" show-menu-by-longpress />
-			</view>
-			<text class="poster-tip">长按图片可保存，或点击下方按钮</text>
-			<view class="poster-save-wrap">
-				<button class="admin-button-com big blue poster-save-btn" @click="onSave">保存到相册</button>
+			<view class="poster-body">
+				<view class="poster-img-wrap">
+					<image class="poster-img" :src="posterUrl" mode="widthFix" show-menu-by-longpress />
+				</view>
+				<text class="poster-tip">长按图片可保存，或点击下方按钮</text>
+				<view class="poster-actions">
+					<button class="admin-button-com big default poster-action-btn" @click="onClose">取消</button>
+					<button class="admin-button-com big blue poster-action-btn" @click="onSave">保存到相册</button>
+				</view>
 			</view>
 		</view>
 	</uni-popup>
@@ -23,6 +26,10 @@ export default {
 		posterUrl: {
 			type: String,
 			default: ''
+		},
+		title: {
+			type: String,
+			default: '分享海报'
 		}
 	},
 	methods: {
@@ -44,18 +51,29 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.poster-popup-root {
+	z-index: 999999;
+}
+
+::v-deep .uni-popup.top .uni-popup__wrapper {
+	width: 100% !important;
+	display: flex !important;
+	justify-content: center !important;
+	align-items: flex-start !important;
+}
+
 .poster-popup-wrap {
 	display: flex;
-	width: 86vw;
-	max-width: 640upx;
-	padding: 28upx 28upx 36upx;
+	width: 100%;
+	padding: 28upx 0 36upx;
 	flex-direction: column;
-	align-items: center;
+	align-items: stretch;
 	max-height: 92vh;
 	overflow: auto;
 	background: #fff;
-	border-radius: 24upx;
+	border-radius: 0 0 24upx 24upx;
 	box-shadow: 0 16upx 48upx rgba(0, 0, 0, 0.18);
+	box-sizing: border-box;
 }
 
 .poster-popup-head {
@@ -63,7 +81,9 @@ export default {
 	display: flex;
 	align-items: center;
 	justify-content: space-between;
+	padding: 0 28upx;
 	margin-bottom: 8upx;
+	box-sizing: border-box;
 }
 
 .poster-popup-title {
@@ -79,15 +99,25 @@ export default {
 	padding: 0 8upx;
 }
 
+.poster-body {
+	width: 100%;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+}
+
 .poster-img-wrap {
 	width: 100%;
-	text-align: center;
+	display: flex;
+	justify-content: center;
 	margin-top: 16upx;
+	padding: 0 28upx;
+	box-sizing: border-box;
 }
 
 .poster-img {
 	width: 100%;
-	margin: 0 auto;
+	max-width: 640upx;
 	border-radius: 12upx;
 	box-shadow: 0 8upx 24upx rgba(0, 0, 0, 0.12);
 }
@@ -96,15 +126,24 @@ export default {
 	margin-top: 20upx;
 	font-size: 24upx;
 	color: #999;
+	text-align: center;
 }
 
-.poster-save-wrap {
+.poster-actions {
 	width: 100%;
+	display: flex;
+	flex-direction: row;
+	align-items: center;
 	margin-top: 28upx;
-	text-align: center;
+	padding: 0 28upx;
+	box-sizing: border-box;
+}
+
+.poster-action-btn {
+	flex: 1;
 }
 
-.poster-save-btn {
-	width: 320upx;
+.poster-action-btn + .poster-action-btn {
+	margin-left: 24upx;
 }
 </style>