From 61d8f6fc00e4fa295971a32439cc7d3b8e87621a Mon Sep 17 00:00:00 2001
From: peng <peng.com>
Date: 星期一, 27 十月 2025 16:02:19 +0800
Subject: [PATCH] 页面调整图片预览
---
manager/src/views/seller/shop/shopDetail.vue | 67 ++++++++++++++++++++++++++++++++-
1 files changed, 64 insertions(+), 3 deletions(-)
diff --git a/manager/src/views/seller/shop/shopDetail.vue b/manager/src/views/seller/shop/shopDetail.vue
index 952b59f..07b507d 100644
--- a/manager/src/views/seller/shop/shopDetail.vue
+++ b/manager/src/views/seller/shop/shopDetail.vue
@@ -140,6 +140,20 @@
<template v-else>鏆傛棤鏍囩</template>
</span>
</p>
+ <p class="item">
+ <span class="label">涓婄骇搴楅摵锛�</span>
+ <span class="info">
+ {{storeRelationship.upStore ? storeRelationship.upStore.storeName:'鏆傛棤'}}
+ </span>
+ </p>
+ <p class="item">
+ <span class="label">涓嬬骇搴楅摵锛�</span>
+ <span class="info">
+ {{ storeRelationship.downStore && storeRelationship.downStore.length
+ ? storeRelationship.downStore.map(store => store.storeName).join('銆�')
+ : '鏆傛棤' }}
+ </span>
+ </p>
<div style="display: flex;align-items: center;justify-content: center;">
<Button type="primary" @click="addStoreTag(storeInfo)">鏂板鏍囩</Button>
</div>
@@ -162,7 +176,9 @@
<p class="item">
<span class="label">韬唤璇佺収鐗囷細</span>
<span class="info">
- <img style="height: 100px;width: 100px" class="mr_10" v-for="item in storeInfo.legalPhoto" :src="item" :key="item">
+ <img style="height: 100px;width: 100px; cursor: pointer;" class="mr_10" v-for="(item, index) in storeInfo.legalPhoto" :src="item" :key="item" @click="previewImage(item, '韬唤璇佺収鐗�(' + (index + 1) + ')')">
+ <Button v-if="storeInfo.legalPhoto && storeInfo.legalPhoto.length > 0" @click="previewImage(storeInfo.legalPhoto[0], '韬唤璇佹闈�')" type="info" size="small" style="margin-left: 10px;">棰勮鍥剧墖</Button>
+ <Button v-if="storeInfo.legalPhoto && storeInfo.legalPhoto.length > 1" @click="previewImage(storeInfo.legalPhoto[1], '韬唤璇佸弽闈�')" type="info" size="small" style="margin-left: 10px;">棰勮鍥剧墖</Button>
</span>
</p>
<p class="item">
@@ -177,7 +193,8 @@
<p class="item">
<span class="label">钀ヤ笟鎵х収鐢靛瓙鐗堬細</span>
<span class="info">
- <img style="height: 100px;width: 100px" :src="storeInfo.licencePhoto">
+ <img style="height: 100px;width: 100px; cursor: pointer;" :src="storeInfo.licencePhoto" @click="previewImage(storeInfo.licencePhoto, '钀ヤ笟鎵х収')">
+ <Button v-if="storeInfo.licencePhoto" @click="previewImage(storeInfo.licencePhoto, '钀ヤ笟鎵х収')" type="info" size="small" style="margin-left: 10px;">棰勮鍥剧墖</Button>
</span>
</p>
<p class="item">
@@ -601,10 +618,19 @@
</Tabs>
</Card>
+ <!-- 鍥剧墖棰勮妯℃�佹 -->
+ <Modal v-model="previewModal" :title="previewTitle" width="600">
+ <img :src="previewImageUrl" alt="棰勮鍥剧墖" style="width: 100%; height: auto;" />
+ <div slot="footer">
+ <Button @click="previewModal = false">鍏抽棴</Button>
+ </div>
+ </Modal>
+
</div>
</template>
<script>
+ import { getStoreRelationship} from "@/api/storeRelationship"
import { getTag,bind,getStoreTagsById,delTagByStoreTagRefId } from "@/api/store-tag"
import ossManage from "@/views/sys/oss-manage/ossManage";
import * as RegExp from '@/libs/RegExp.js';
@@ -620,6 +646,7 @@
},
data() {
return {
+ storeRelationship:{},//搴楅摵鍏崇郴瀵硅薄
tagOptions:[],
submitLoading:false,
tagForm:{
@@ -890,9 +917,32 @@
},
refundOrderData: [],//鍞悗鍗曟暟鎹�
refundOrderTotal: 0,//鍞悗鍗曟�绘潯鏁�
+ // 鍥剧墖棰勮鐩稿叧
+ previewModal: false,
+ previewImageUrl: "",
+ previewTitle: "鍥剧墖棰勮",
};
},
+ watch: {
+ // 鐩戝惉璺敱瀵硅薄鍙樺寲
+ $route(to, from) {
+ console.log(to.name)
+ if (to.name === 'shop-detail' && to.query.id) {
+ if (to.query.id !== from.query.id) {
+ this.id = to.query.id;
+ this.init();
+ }
+ }
+ }
+ },
methods: {
+ getStoreRelationship(){
+ getStoreRelationship(this.id).then(res =>{
+ if (res.code === 200){
+ this.$set(this, "storeRelationship", res.data);
+ }
+ })
+ },
handleDeleteTag(storeTagRefId){
console.log(storeTagRefId)
delTagByStoreTagRefId(storeTagRefId).then(res=>{
@@ -954,7 +1004,7 @@
},
init() {
this.getStoreTags();
-
+ this.getStoreRelationship();
this.getStoreTag();
//鏌ュ簵閾哄熀鏈俊鎭�
this.getStoreInfo();
@@ -1103,10 +1153,21 @@
this.refundOrderSearchForm.endDate = v[1];
}
},
+ // 鍥剧墖棰勮鍔熻兘
+ previewImage(url, title) {
+ if (url) {
+ this.previewImageUrl = url;
+ this.previewTitle = title || "鍥剧墖棰勮";
+ this.previewModal = true;
+ } else {
+ this.$Message.warning("鏆傛棤鍥剧墖鍙瑙�");
+ }
+ }
},
mounted() {
this.id = this.$route.query.id;
this.init();
+ console.log("鍔犺浇椤甸潰")
}
};
</script>
--
Gitblit v1.8.0