<template>
  <div>
    <!-- <div class="asj-h3">生效对象</div> -->
    <el-radio-group v-model="target">
      <div class="target-radio-group">
        <el-radio label="campaign">当前广告活动（所有定向）</el-radio>
        <div class="target-radio-group-item">
          <el-radio label="adGroup">当前广告活动指定广告组（所有定向）</el-radio>
          <el-select style="margin-left: 23px" v-show="target === 'adGroup'">
            <el-option label="111"></el-option>
          </el-select>
        </div>
        <div class="target-radio-group-item">
          <el-radio label="specified">指定定向</el-radio>
          <el-button v-show="target === 'specified'" style="margin-left: 20px; color: blue;" link>选择定向</el-button>
        </div>
      </div>
    </el-radio-group>
  </div>
</template>

<script lang="ts" setup>
import { ref } from 'vue'

const target = ref('campaign')
</script>

<style scoped>
.target-radio-group {
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
  .target-radio-group-item {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
  }
}
</style>
