53 lines
1.2 KiB
Vue
53 lines
1.2 KiB
Vue
<template>
|
||
<div class="mobile-common-query card-item">
|
||
<div class="query-item">
|
||
<span>分类：</span>
|
||
<el-segmented v-model="productStore.queryInfo.category"
|
||
:options="queryCategoryList"
|
||
@change="productStore.queryProductList()"/>
|
||
</div>
|
||
|
||
<div class="query-item">
|
||
<span>排序：</span>
|
||
<el-segmented v-model="productStore.queryInfo.order"
|
||
:options="queryOrderList"
|
||
@change="productStore.queryProductList()"/>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { onMounted, ref } from 'vue'
|
||
import { useProductStore } from '@/store/product.ts'
|
||
|
||
const productStore = useProductStore()
|
||
|
||
const queryCategoryList = ref([])
|
||
|
||
onMounted(async () => {
|
||
await productStore.queryProductCategory()
|
||
|
||
queryCategoryList.value = []
|
||
queryCategoryList.value.push({
|
||
label: '全部',
|
||
value: ''
|
||
})
|
||
productStore.categoryList.forEach((item) => {
|
||
queryCategoryList.value.push({
|
||
label: item,
|
||
value: item
|
||
})
|
||
})
|
||
})
|
||
|
||
const queryOrderList = [
|
||
{
|
||
label: '购买日期',
|
||
value: 'date'
|
||
}, {
|
||
label: '日均价格',
|
||
value: 'price'
|
||
}
|
||
]
|
||
</script>
|