74 lines
1.8 KiB
Vue
74 lines
1.8 KiB
Vue
|
<template>
|
||
|
|
<el-select v-model="form.shop_id" filterable :placeholder="allSel === true ? '所有商铺' : '请选择，也可输入搜索'"
|
||
|
|
@input="updateShopId">
|
||
|
|
<el-option v-if="allSel === true && shopList.length > 1" label="所有商铺" value="">
|
||
|
|
<el-avatar class="vm f-s-12" shape="square" :size="25"> all </el-avatar>
|
||
|
|
<span class="rspan">所有商铺</span>
|
||
|
|
</el-option>
|
||
|
|
<el-option v-for="item in shopList" :key="item.id" :label="item.name" :value="item.shop_id">
|
||
|
|
<el-avatar v-if="item.logo != ''" class="vm" shape="square" :size="25"
|
||
|
|
:src="$store.state.settings.host + '/Data/UploadFiles/logo/' + item.logo">
|
||
|
|
</el-avatar>
|
||
|
|
<el-avatar v-else :size="25" class="vm" icon="iconfont icon-tuxiang"></el-avatar>
|
||
|
|
<span class="rspan">{{ item.name }}</span>
|
||
|
|
</el-option>
|
||
|
|
</el-select>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
name: 'SelectionShopId',
|
||
|
|
props: {
|
||
|
|
value: String, // 接收父级的值作为 prop
|
||
|
|
allSel: { // 是否显示 所有商铺选项
|
||
|
|
type: Boolean,
|
||
|
|
default: false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data () {
|
||
|
|
return {
|
||
|
|
form: {
|
||
|
|
shop_id: ''
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
// 获取商铺列表
|
||
|
|
shopList () {
|
||
|
|
return this.$store.state.shopList
|
||
|
|
}
|
||
|
|
},
|
||
|
|
watch: {
|
||
|
|
shopList (val) {
|
||
|
|
this.form.shop_id = this.$store.state.user.shop_id
|
||
|
|
this.updateShopId()
|
||
|
|
}
|
||
|
|
},
|
||
|
|
created () {
|
||
|
|
if (this.shopList.length > 0) {
|
||
|
|
this.form.shop_id = this.$store.state.user.shop_id
|
||
|
|
this.updateShopId()
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
updateShopId () {
|
||
|
|
this.$emit('input', this.form.shop_id) // 发送 input 事件给父级
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.centered-avatar {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.rspan {
|
||
|
|
float: right;
|
||
|
|
color: #8492a6;
|
||
|
|
font-size: 13px
|
||
|
|
}
|
||
|
|
</style>
|