73 lines
1.4 KiB
Vue
73 lines
1.4 KiB
Vue
<template>
|
|
<view class="w-full">
|
|
<view class="box u-flex u-row-between" @click="showPop" :class="{disabled:disabled}">
|
|
<text class="color-999 " v-if="!modelValue">请选择</text>
|
|
<text v-else class="u-m-r-30">{{shopName}}</text>
|
|
<up-icon name="arrow-down"></up-icon>
|
|
</view>
|
|
|
|
<popupHeadShop v-model="show" @confirm="confirm"></popupHeadShop>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
computed,
|
|
onMounted,
|
|
ref
|
|
} from 'vue';
|
|
import popupHeadShop from './popup-head-shop.vue'
|
|
import * as shopInfoApi from '@/http/api/account/shopInfo.js'
|
|
|
|
const props = defineProps({
|
|
disabled: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
})
|
|
const show = ref(false)
|
|
|
|
function showPop() {
|
|
if (props.disabled) {
|
|
return
|
|
}
|
|
show.value = true
|
|
}
|
|
const modelValue = defineModel()
|
|
|
|
function confirm(e) {
|
|
console.log(e);
|
|
modelValue.value = e.shopId
|
|
selShopInfo.value = e
|
|
}
|
|
const selShopInfo = ref(null)
|
|
const shopName = computed(() => {
|
|
if (selShopInfo.value) {
|
|
return selShopInfo.value.shopName
|
|
}
|
|
return ''
|
|
})
|
|
onMounted(async () => {
|
|
if (modelValue.value) {
|
|
const res = await shopInfoApi.getShopDetail({
|
|
id: modelValue.value
|
|
})
|
|
if (res) {
|
|
selShopInfo.value = res
|
|
}
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.box {
|
|
padding: 9px 9px;
|
|
border: 1px solid #dadbde;
|
|
display: flex;
|
|
border-radius: 4px;
|
|
|
|
&.disabled {
|
|
background-color: rgb(245, 247, 250);
|
|
}
|
|
}
|
|
</style> |