<script setup>
import { ref, onMounted } from 'vue';
import { consoleSurveys, getQuestionList } from '@/api/home/index.js';
import { snQuestions, saveQuestions } from '@/api/design/index.js';
import { useRouter } from 'vue-router';
import { useCounterStore } from '@/stores/counter';
import { storeToRefs } from 'pinia';
// 获取 Store 实例
const counterStore = useCounterStore();
const store = storeToRefs(counterStore);

const router = useRouter();
const surveys = ref([]);

const createdQuestion = (item) => {
  const query = {
    group_id: 0,
    project_name: `${item.title}问卷 `,
    remarks: '',
    scene_code: item.scene_code,
    scene_code_info: item.scene_code_info,
    tags: ''
  };
  consoleSurveys(query).then((res) => {
    if (res.data) {
      snQuestions({ sn: res.data.data.sn }).then((ques) => {
        if (ques.data) {
          ques.data.data.survey.introduction = `<p>为优化活动服务品质，烦请完成问卷，感谢配合！您的反馈至关重要！（此提示语为默认提示语，您可选择自行输入本问卷的提示语）</p>`;
          store.questionsInfo.value = ques.data.data;
          saveQuestions({
            sn: res.data.data.sn,
            introduction: ques.data.data.survey.introduction,
            title: ques.data.data.survey.title
          }).then(() => {
            router.push({
              path: '/create',
              query: {
                sn: res.data.data.sn
              }
            });
          });
        }
      });
    }
  });
};

// 添加获取问卷列表的方法
const getList = () => {
  getQuestionList().then((res) => {
    if (res.data.code === 0) {
      if (res.data.data) {
        res.data.data.forEach((item) => {
          if (item.parentCode && item.parentCode === 1) {
            surveys.value.push(item);
          }
        });

        surveys.value.push({});
      }
    }
  });
};

// 在组件挂载时调用
onMounted(() => {
  getList();
});
</script>

<template>
  <van-cell class="create_survey">
    <div class="create_survey_title" style="color: #000; text-align: left">请选择新建类型</div>
    <van-row>
      <van-col
        v-for="survey in surveys"
        :key="survey.title"
        span="6"
        class="survey"
        @click="createdQuestion(survey)"
      >
        <img :src="survey.image" alt="" width="40" />
        <span>{{ survey.title }}</span>
      </van-col>
    </van-row>
  </van-cell>
</template>

<style lang="scss" scoped>
.create_survey {
  padding: 15px;
  color: #000;

  .create_survey_title {
    margin-bottom: 15px;
    color: #000;
    font-weight: bold;
    font-size: 15px;
    font-family:
      PingFangSC,
      'PingFang SC';
  }
}

.survey {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;

  span {
    margin-top: 8px;
    margin-bottom: 18px;
    color: #000;
    font-weight: 400;
    font-size: 0.34rem;

    //font-family: PingFangHK, PingFangHK;
  }
}
</style>
