feat:仓库添加弹窗查看信息

pages/wareHouse/components/moreInfo.vue

@@ -1,36 +1,38 @@
 <template>
-    <u-modal :show="show">
-        <div class="more-info">
-            <view class="modal-item">
-                <text>品牌：</text>
-                <text>{{ moreOptions.dictLabel || '-' }}</text>
-            </view>
-            <view class="modal-item">
-                <text>来源：</text>
-                <text>{{ moreOptions.origin || '-' }}</text>
-            </view>
-            <view class="modal-item">
-                <text>实价：</text>
-                <text>¥{{ moreOptions.costPrice || '-' }}</text>
-            </view>
-            <view class="modal-item">
-                <text>型号：</text>
-                <text>{{ moreOptions.model || '-' }}</text>
-            </view>
-            <view class="modal-item">
-                <text>编码：</text>
-                <text>{{ moreOptions.indentifyCode || '-' }}</text>
-            </view>
-            <view class="modal-item">
-                <text>日期：</text>
-                <text>{{ recycleTimeFormatter(moreOptions.recycleTime) || '-' }}</text>
-            </view>
-            <view class="modal-item">
-                <text>备注：</text>
-                <text>{{ moreOptions.productDesc || '-' }}</text>
-            </view>
-        </div>
-    </u-modal>
+    <view class="more-info-wrapper">
+        <u-modal :show="show" @confirm="closeModal">
+            <div class="more-info">
+                <view class="modal-item">
+                    <text>品牌：</text>
+                    <text>{{ moreOptions.dictLabel || '-' }}</text>
+                </view>
+                <view class="modal-item">
+                    <text>来源：</text>
+                    <text>{{ moreOptions.origin || '-' }}</text>
+                </view>
+                <view class="modal-item">
+                    <text>实价：</text>
+                    <text>¥{{ moreOptions.costPrice || '-' }}</text>
+                </view>
+                <view class="modal-item">
+                    <text>型号：</text>
+                    <text>{{ moreOptions.model || '-' }}</text>
+                </view>
+                <view class="modal-item">
+                    <text>编码：</text>
+                    <text>{{ moreOptions.indentifyCode || '-' }}</text>
+                </view>
+                <view class="modal-item">
+                    <text>日期：</text>
+                    <text>{{ recycleTimeFormatter(moreOptions.recycleTime) || '-' }}</text>
+                </view>
+                <view class="modal-item">
+                    <text>备注：</text>
+                    <text>{{ moreOptions.productDesc || '-' }}</text>
+                </view>
+            </div>
+        </u-modal>
+    </view>
 </template>
 
 <script>
@@ -51,6 +53,9 @@ export default {
         showMoreInfo() {
             this.show = true;
         },
+        closeModal() {
+            this.show = false;
+        },
         recycleTimeFormatter(val) {
             if (val) {
                 return this.$dayjs(val).format('YYYY-MM-DD HH:mm:ss')
@@ -61,4 +66,11 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.more-info-wrapper {
+    position: absolute;
+    width: 0;
+    height: 0;
+    overflow: hidden;
+}
+</style>

pages/wareHouse/index.vue

@@ -100,7 +100,9 @@
 						</view> -->
 					</view>
 					<view class="more">
-						<u-icon name="more-dot-fill" size="16" color="#666666" @click="showMoreOptions(goods)"></u-icon>
+						<view @click.stop="showMoreOptions(goods)">
+							<u-icon name="more-dot-fill" size="16" color="#666666"></u-icon>
+						</view>
 						<text class="goods-stock">数量:{{ goods.stock}}</text>
 					</view>
 				</view>
@@ -110,7 +112,7 @@
 		<view class="add-button" @click="handleEdit">
 			<u-icon name="plus" size="36" color="#ffffff"></u-icon>
 		</view>
-		<!-- <moreInfo ref="moreInfoRef" :moreOptions="moreOptions"></moreInfo> -->
+		<moreInfo ref="moreInfoRef" :moreOptions="moreOptions"></moreInfo>
 	</view>
 </template>
 <script>