ads_web/src/views/reportManage/dataCenter/components/CompareData.vue

<script setup lang="ts">
import { ref } from 'vue'
// 筛选条件
const value1 = ref([]) // 平台编号
const value2 = ref([])
const value3 = ref([])
const value4 = ref([])
const options = [
  {
    value: 'Option1',
    label: 'Option1',
  },
  {
    value: 'Option2',
    label: 'Option2',
  },
]
</script>

<template>
  <div class="flex gap-1.5 justify-between">
    <div class="flex gap-1.5">
      <el-select v-model="value1" multiple placeholder="平台编号" style="width: 160px">
        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
      </el-select>
      <el-select v-model="value2" multiple placeholder="平台名称" style="width: 160px">
        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
      </el-select>
      <el-select v-model="value3" multiple placeholder="运营" style="width: 160px">
        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
      </el-select>
      <el-select v-model="value4" multiple placeholder="国家" style="width: 160px">
        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
      </el-select>
      <el-select v-model="value4" multiple placeholder="品牌" style="width: 160px">
        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
      </el-select>
    </div>
  </div>
</template>

<style scoped></style>