Merge branch 'feature-sell-verify' of https://e.coding.yili.com/yldc/ylst/ylst-survey-web into feature-sell-verify

2022-10-20 22:50:28 +08:00
parent 3e60089931 b3539f1bf8
commit 49e432cce8
6 changed files with 985 additions and 24 deletions
--- a/.DS_Store
+++ b/.DS_Store
--- a/src/views/ProjectManage/components/SurveyAction.vue
+++ b/src/views/ProjectManage/components/SurveyAction.vue
@@ -152,6 +152,12 @@ export default defineComponent({
        if (status === 1 && i.action === 'build') {
          return false;
        }
+        if(i.action === 'save' && props.info.template_type === 1) {
+          return false
+        }
+        if(i.action === 'copy' && props.info.template_type === 1) {
+          return false
+        }
        return true;
      });
    });
--- a/src/views/ProjectManage/fragment/TableList.vue
+++ b/src/views/ProjectManage/fragment/TableList.vue
@@ -31,7 +31,9 @@
      <template #status="{ record }">
        <div
          class="status-text"
-          :class="record.status == 0 ? 'blue' : record.status == 1 ? 'green' : 'gray'"
+          :class="
+            record.status == 0 ? 'blue' : record.status == 1 ? 'green' : 'gray'
+          "
        >
          {{ record.status_txt }}
        </div>
@@ -43,7 +45,10 @@
          @click="handleJumpTo($event, 'design', record.sn)"
          >编辑</a-button
        >
-        <a-button class="custom-button" type="link" @click="handleJumpTo($event, 'link', record.sn)"
+        <a-button
+          class="custom-button"
+          type="link"
+          @click="handleJumpTo($event, 'link', record.sn)"
          >发布</a-button
        >
        <a-button
@@ -53,27 +58,52 @@
          >分析</a-button
        >
        <a-dropdown>
-          <a class="ant-dropdown-link" style="display: inline-block" @click.prevent>
+          <a
+            class="ant-dropdown-link"
+            style="display: inline-block"
+            @click.prevent
+          >
            更多
            <DownOutlined />
          </a>
          <template #overlay>
-            <SurveyAction :info="record" @click-action="actionClick" @update="update" />
+            <SurveyAction
+              :info="record"
+              @click-action="actionClick"
+              @update="update"
+            />
          </template>
        </a-dropdown>
      </template>
      <template #tag="{ record }">
-        <div v-for="item in record.tags" :key="item.id" style="display: inline-block">
+        <div
+          v-for="item in record.tags"
+          :key="item.id"
+          style="display: inline-block"
+        >
          <!-- <div v-for="it in record.tag" :key="it.id" style="display:inline-block;"> -->
-          <a-tooltip v-if="record.tag.length > 2" placement="right" :title="record.titles">
+          <a-tooltip
+            v-if="record.tag.length > 2"
+            placement="right"
+            :title="record.titles"
+          >
            <div style="display: flex; flex-direction: row">
-              <div :title="item.title" :style="countColor(item.color)" class="tagStyle">
+              <div
+                :title="item.title"
+                :style="countColor(item.color)"
+                class="tagStyle"
+              >
                {{ item.title }}
              </div>
              <div class="tagOmit" v-if="record.tags.length == 1">...</div>
            </div>
          </a-tooltip>
-          <div v-else :title="item.title" :style="countColor(item.color)" class="tagStyle">
+          <div
+            v-else
+            :title="item.title"
+            :style="countColor(item.color)"
+            class="tagStyle"
+          >
            {{ item.title }}
          </div>
          <!-- </div> -->
@@ -81,7 +111,10 @@
      </template>
      <template #titles="{ record }">
        <a-tooltip placement="right" :title="record.remarks || ''">
-          <div>{{ record.project_name }}</div>
+          <div>
+            <span>{{ record.project_name }}</span>
+            <span class="table-sell" v-if="record.template_tag">#{{ record.template_tag }}</span>
+          </div>
        </a-tooltip>
      </template>
      <!-- <template v-slot:footer>
@@ -145,7 +178,12 @@
      />
    </a-modal>

-    <a-modal v-model:visible="visibleMove" title="移动至分组" :maskClosable="false" :footer="null">
+    <a-modal
+      v-model:visible="visibleMove"
+      title="移动至分组"
+      :maskClosable="false"
+      :footer="null"
+    >
      <MoveGroup
        :group-id="activeGroupId"
        :info="groupInfo"
@@ -174,7 +212,12 @@
      @update="update"
    />

-    <a-modal v-model:visible="tempVisible" width="80%" :maskClosable="false" :footer="null">
+    <a-modal
+      v-model:visible="tempVisible"
+      width="80%"
+      :maskClosable="false"
+      :footer="null"
+    >
      <createFromTemplate @tempCreate="onTempCreate" />
    </a-modal>
    <SurveyDownload
@@ -790,4 +833,8 @@ export default defineComponent({
 .ant-table-title {
  padding: 0 !important;
 }
+.table-sell{
+  color: $yili-default-color;
+  word-break: keep-all;
+}
 </style>
--- a/src/views/TempMarket/components/CreateSurveyCopy.vue
+++ b/src/views/TempMarket/components/CreateSurveyCopy.vue
@@ -0,0 +1,778 @@
+<template>
+  <div class="create-survey">
+    <div class="create-survey-title" v-if="curTemp.type === 1">
+      <div class="create-survey-title-line"></div>
+      <div class="create-survey-title-text">问卷配置</div>
+    </div>
+    <a-form
+      ref="formRef"
+      :model="ruleForm"
+      :rules="rules"
+      :label-col="{ span: 4 }"
+    >
+      <a-form-item label="问卷名称" name="project_name">
+        <a-input
+          v-model:value="ruleForm.project_name"
+          @keydown.enter="onSubmit"
+          placeholder="请输入问卷名称"
+          :maxlength="30"
+          showCount
+        >
+          <template #suffix>
+            <span class="suffix">
+              {{ `${ruleForm.project_name.length} / 30` }}
+            </span>
+          </template>
+        </a-input>
+      </a-form-item>
+      <a-form-item label="问卷标签" name="tags" v-if="isShow">
+        <a-select
+          v-model:value="ruleForm.tags"
+          style="width: 100%"
+          mode="multiple"
+          placeholder="搜索或新建标签"
+          :filterOption="filterOption"
+          class="show-select"
+        >
+          <a-select-option
+            :value="item.id"
+            :label="item.title"
+            v-for="item in tagsList"
+            :key="item.id"
+          >
+            <div style="display: flex; justify-content: space-between">
+              <span :style="countColor(item.color)" :title="item.title">{{
+                item.title
+              }}</span>
+              <!-- <span class="icon">
+              <EditOutlined class="edit" @click.stop="edit(item)" />
+              <DeleteOutlined class="del" @click.stop="del(item.id)" />
+            </span> -->
+            </div>
+          </a-select-option>
+          <!-- <template #dropdownRender="{ menuNode: menu }">
+          <v-nodes :vnodes="menu" />
+          <a-divider />
+          <div
+            style="padding: 4px 8px; cursor: pointer"
+            @mousedown="(e) => e.preventDefault()"
+            @click="addTag"
+          >
+            <plus-outlined />
+            新建标签
+          </div>
+        </template> -->
+        </a-select>
+      </a-form-item>
+      <a-form-item label="问卷简介" name="remarks" v-if="isShow">
+        <a-textarea
+          v-model:value="ruleForm.remarks"
+          showCount
+          autoSize
+          :maxlength="150"
+          placeholder="请输入"
+          allowClear
+        />
+      </a-form-item>
+    </a-form>
+    <template v-if="curTemp.type === 1">
+      <div class="create-survey-title">
+        <div class="create-survey-title-line"></div>
+        <div class="create-survey-title-text">口味关键属性配置</div>
+      </div>
+      <div class="create-survey-list">
+        <div
+          class="create-survey-list-item"
+          :class="{ 'create-survey-list-item-error': item.status }"
+          v-for="(item, index) in smellList"
+          :key="index"
+        >
+          <label class="create-survey-list-item-label">口味关键属性</label>
+          <div class="create-survey-list-item-right">
+            <div class="create-survey-list-item-right-input">
+              <a-input
+                v-model:value="item.taste_attr"
+                class="custom-input"
+                :maxlength="30"
+                showCount
+                placeholder="请输入口味关键属性"
+                @blur="tasteBlurHandle(item, index)"
+              >
+                <template #suffix>
+                  <span class="suffix">
+                    {{ `${item.taste_attr.length} / 30` }}
+                  </span>
+                </template>
+              </a-input>
+              <i
+                v-if="smellList.length < 20"
+                class="iconfont addfont"
+                @click="addSmellHandle(index)"
+                >&#xe6c4;</i
+              >
+              <i
+                v-if="smellList.length > 1"
+                class="iconfont addfont"
+                @click="delSmellHandle(index)"
+                >&#xe6cd;</i
+              >
+            </div>
+            <div class="create-survey-list-item-right-text">
+              {{ item.text }}
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="create-survey-title">
+        <div class="create-survey-title-line"></div>
+        <div class="create-survey-title-text">包装关键性配置</div>
+      </div>
+      <div class="create-survey-list">
+        <div
+          class="create-survey-list-item"
+          :class="{ 'create-survey-list-item-error': item.status }"
+          v-for="(item, index) in packList"
+          :key="index"
+        >
+          <label class="create-survey-list-item-label">包装关键属性</label>
+          <div class="create-survey-list-item-right">
+            <div class="create-survey-list-item-right-input">
+              <a-input
+                v-model:value="item.package_attr"
+                class="custom-input"
+                showCount
+                :maxlength="30"
+                placeholder="请输入包装关键属性"
+                @blur="packBlurHandle(item, index)"
+              >
+                <template #suffix>
+                  <span class="suffix">
+                    {{ `${item.package_attr.length} / 30` }}
+                  </span>
+                </template>
+              </a-input>
+              <i
+                v-if="packList.length < 20"
+                class="iconfont addfont"
+                @click="addPackHandle(index)"
+                >&#xe6c4;</i
+              >
+              <i
+                v-if="packList.length > 1"
+                class="iconfont addfont"
+                @click="delPackHandle(index)"
+                >&#xe6cd;</i
+              >
+            </div>
+            <div class="create-survey-list-item-right-text">
+              {{ item.text }}
+            </div>
+          </div>
+        </div>
+      </div>
+    </template>
+    <div class="create-survey-footer">
+      <a-button
+        class="custom-button"
+        style="margin-right: 12px"
+        type="default"
+        @click="$emit('cancel')"
+        >取消</a-button
+      >
+      <a-button
+        class="custom-button"
+        type="primary"
+        :loading="loading"
+        @click="onSubmit"
+        >确定</a-button
+      >
+    </div>
+    <a-modal
+      v-model:visible="visibleTags"
+      title="新建标签"
+      :destroyOnClose="true"
+      :footer="null"
+    >
+      <addTag @cancel="visibleTags = false" @update="addTagUpdata"></addTag>
+    </a-modal>
+  </div>
+</template>
+<script>
+import {
+  defineComponent,
+  reactive,
+  ref,
+  watch,
+  onBeforeMount,
+  createVNode,
+} from "vue";
+import { useRouter } from "vue-router";
+import { message, Modal } from "ant-design-vue";
+import {
+  // PlusOutlined,
+  ExclamationCircleOutlined,
+  // EditOutlined,
+  // DeleteOutlined
+} from "@ant-design/icons-vue";
+import {
+  postSurvey,
+  renewSurvey,
+  getTagsList,
+  deleteTags,
+  useTempCreateProject,
+} from "@/views/ProjectManage/api.js";
+import addTag from "@/views/ProjectManage/components/addTag.vue";
+import useEmitter from "@/composables/useEmitter";
+export default defineComponent({
+  name: "CreateSurvey",
+  name: "CreateWord",
+  props: {
+    groupId: { type: Number, value: 0 },
+    info: { type: Object, default: () => {} },
+    temp_sn: { type: String, default: "" },
+    curTemp: { type: Object, default: () => {} },
+    groupList: {
+      type: Array,
+      required: true,
+    },
+  },
+  components: {
+    // PlusOutlined,
+    // EditOutlined,
+    // DeleteOutlined,
+    addTag,
+    // VNodes: (_, { attrs }) => {
+    //   return attrs.vnodes;
+    // }
+  },
+  setup(props, context) {
+    const emitter = useEmitter();
+    const items = ref([]);
+    const router = useRouter();
+    const formRef = ref();
+    const tagsList = ref([]);
+    const loading = ref(false);
+    const isShow = ref(props.info.sn ? false : true);
+    // console.log(props.group_id);
+    const ruleForm = reactive({
+      project_name: props.info?.project_name || "",
+      tags: props.info?.tag || [],
+      group_id: props?.groupId || 0,
+      remarks: props.remarks || "",
+    });
+    const rules = {
+      project_name: [
+        { required: true, message: "请输入问卷名称", trigger: "blur" },
+        { min: 1, max: 30, message: "字数超过限制", trigger: "blur" },
+      ],
+    };
+    const visibleTags = ref(false);
+    watch(
+      () => props,
+      () => {
+        ruleForm.group_id = props?.groupId || 0;
+        ruleForm.project_name = props.info?.project_name || "";
+        ruleForm.tags = props.info?.tag || "";
+        ruleForm.remarks = props.info?.remarks || "";
+        isShow.value = props.info.sn ? false : true;
+      },
+      { deep: true }
+      // () => props.groupId,
+      // () => {
+      //   ruleForm.group_id = props?.groupId || 0;
+      // },
+      // () => props.info,
+      // () => {
+      //   ruleForm.project_name = props.info?.project_name || '';
+      // }
+    );
+    // 标签颜色
+    const countColor = (value) => {
+      let style = {};
+      switch (value) {
+        case 1:
+          style = {
+            color: "#4DB8FA",
+            border: "1px solid #4DB8FA",
+            padding: "0 5px",
+            "border-radius": "4px",
+            "line-height": "20px",
+          };
+          break;
+        case 2:
+          style = {
+            color: "#0CC126",
+            // 'border-color' : '#0CC126',
+            border: "1px solid #0CC126",
+            padding: "0 5px",
+            "border-radius": "4px",
+            "line-height": "20px",
+          };
+          break;
+        case 3:
+          style = {
+            color: "#FF8800",
+            // 'border-color' : '#FF8800',
+            border: "1px solid #FF8800",
+            padding: "0 5px",
+            "border-radius": "4px",
+            "line-height": "20px",
+          };
+          break;
+        case 4:
+          style = {
+            color: "#FF374F",
+            // 'border-color' : '#FF374F',
+            border: "1px solid #FF374F",
+            padding: "0 5px",
+            "border-radius": "4px",
+            "line-height": "20px",
+          };
+          break;
+        case 5:
+          style = {
+            color: "#1C6FFF",
+            // 'border-color' : '#1C6FFF',
+            border: "1px solid #1C6FFF",
+            padding: "0 5px",
+            "border-radius": "4px",
+            "line-height": "20px",
+          };
+          break;
+        case 6:
+          style = {
+            color: "#11AEA7",
+            // 'border-color' : '#11AEA7',
+            border: "1px solid #11AEA7",
+            padding: "0 5px",
+            "border-radius": "4px",
+            "line-height": "20px",
+          };
+          break;
+        case 7:
+          style = {
+            color: "#25D8C8",
+            // 'border-color' : '#25D8C8',
+            border: "1px solid #25D8C8",
+            padding: "0 5px",
+            "border-radius": "4px",
+            "line-height": "20px",
+          };
+          break;
+        case 8:
+          style = {
+            color: "#FECB0D",
+            // 'border-color' : '#FECB0D',
+            border: "1px solid #FECB0D",
+            padding: "0 5px",
+            "border-radius": "4px",
+            "line-height": "20px",
+          };
+        //   break;
+        // case 9:
+        //   style = {
+        //     'color' : '4DB8FA',
+        //     'border-color' : '4DB8FA',
+        //   }
+      }
+      return style;
+    };
+    const toSub = async () => {
+      loading.value = true;
+      let data;
+      try {
+        if (props.info?.sn) {
+          // xiugai
+          data = await renewSurvey({ ...ruleForm, sn: props.info.sn });
+          context.emit("update");
+        } else {
+          // 模版添加
+          if (props.temp_sn) {
+            let params = {
+              ...ruleForm,
+            };
+            if (props.curTemp.type === 1) {
+              params.taste_list = smellList.value.map((sl) => {
+                return { taste_attr: sl.taste_attr };
+              });
+              params.package_list = packList.value.map((sl) => {
+                return { package_attr: sl.package_attr };
+              });
+            }
+            useTempCreateProject(props.temp_sn, params).then((res) => {
+              context.emit("temPreview", res.data);
+              context.emit("update");
+              context.emit("close");
+              setTimeout(() => {
+                router.push({
+                  path: "/survey/planet/design",
+                  query: { sn: res.data.sn },
+                });
+              }, 300);
+            });
+          }
+          // 普通添加
+          else {
+            const queryData = JSON.parse(
+              JSON.stringify({
+                ...ruleForm,
+                group_id: ruleForm?.group_id ?? props.groupId,
+              })
+            );
+            queryData.tags = queryData.tags.join();
+            const { data } = await postSurvey(queryData);
+            console.log(data, "----------------");
+            router.push({
+              path: "/survey/planet/design",
+              query: { sn: data.sn },
+            });
+          }
+        }
+        message.success("保存成功");
+      } catch (error) {
+        console.log(error);
+        // context.message.warning(
+        //   error.data?.message || error.message || "服务器错误"
+        // );
+      } finally {
+        loading.value = false;
+      }
+    };
+    /** 获取项目标签列表 */
+    const getTagsListRequest = async (val) => {
+      try {
+        const { data } = await getTagsList();
+        tagsList.value = data;
+      } catch (error) {
+        context.message.error(
+          error.data?.message || error.message || "服务器错误"
+        );
+      }
+    };
+    // 删除
+    const delRequest = async (id) => {
+      try {
+        const { data } = await deleteTags(id);
+        getTagsListRequest();
+      } catch (error) {
+        console.log(error);
+      }
+    };
+    const del = (id) => {
+      Modal.confirm({
+        content: "删除后，此标签会从当前团队的所有问卷中移除，且无法恢复！",
+        icon: () => createVNode(ExclamationCircleOutlined),
+        cancelText: "取消",
+        okText: "确认",
+        zIndex: 100001,
+        onOk: () => {
+          delRequest(id);
+        },
+      });
+    };
+    const edit = (item) => {
+      context.emit("labelEdit", item);
+    };
+    const addItem = () => {
+      emitter.emit("addGroup");
+    };
+    const addTag = () => {
+      visibleTags.value = true;
+    };
+    const addTagUpdata = () => {
+      visibleTags.value = false;
+      getTagsListRequest();
+    };
+
+    const smellList = ref([
+      {
+        taste_attr: "",
+        status: false,
+        text: "",
+      },
+    ]);
+    const packList = ref([
+      {
+        package_attr: "",
+        status: false,
+        text: "",
+      },
+    ]);
+    const addSmellHandle = (index) => {
+      if (smellList.value.length === 20) return;
+      smellList.value.splice(index, 0, {
+        taste_attr: "",
+        status: true,
+        text: "",
+      });
+    };
+    const delSmellHandle = (index) => {
+      Modal.confirm({
+        title: "确定删除这个产品口味关键属性？",
+        content: "口味关键属性删除后无法恢复！",
+        cancelText: "取消",
+        okText: "确认",
+        onOk() {
+          smellList.value.splice(index, 1);
+        },
+      });
+    };
+    const addPackHandle = (index) => {
+      if (smellList.value.length === 20) return;
+      packList.value.splice(index, 0, {
+        package_attr: "",
+        status: true,
+        text: "",
+      });
+    };
+    const delPackHandle = (index) => {
+      Modal.confirm({
+        title: "确定删除这个包装关键属性？",
+        content: "包装关键属性删除后无法恢复！",
+        cancelText: "取消",
+        okText: "确认",
+        class: "custom-modal custom-modal-title-confirm-notice",
+        onOk() {
+          smellList.value.splice(index, 1);
+        },
+      });
+    };
+    const tasteBlurHandle = (item, index) => {
+      const hasSameAttr = smellList.value.find(
+        (sm, smIndex) => smIndex !== index && sm.taste_attr === item.taste_attr
+      );
+      if (item.taste_attr.length === 0) {
+        item.status = true;
+        item.text = "口味属性不能为空";
+      } else if (hasSameAttr) {
+        item.status = true;
+        item.text = "口味属性不能重复";
+      } else {
+        item.status = false;
+      }
+    };
+    const packBlurHandle = (item, index) => {
+      const hasSameAttr = packList.value.find(
+        (pk, pkIndex) =>
+          pkIndex !== index && pk.package_attr === item.package_attr
+      );
+      if (item.package_attr.length === 0) {
+        item.status = true;
+        item.text = "包装属性不能为空";
+      } else if (hasSameAttr) {
+        item.status = true;
+        item.text = "包装属性不能重复";
+      } else {
+        item.status = false;
+      }
+    };
+    const onSubmit = () => {
+      let attrStatus = false;
+      if (props.curTemp.type === 1) {
+        smellList.value.forEach((sm, index) => {
+          tasteBlurHandle(sm, index);
+          attrStatus = sm.status;
+        });
+        packList.value.forEach((pk, index) => {
+          packBlurHandle(pk, index);
+          attrStatus = pk.status;
+        });
+      }
+      formRef.value
+        .validate()
+        .then(() => {
+          if (attrStatus) return;
+          Modal.confirm({
+            title: "保存后方案配置无法编辑，请您再次确认已完成最终配置！",
+            cancelText: "取消",
+            okText: "确认",
+            class: "custom-modal",
+            icon: createVNode(ExclamationCircleOutlined),
+            async onOk() {
+              await toSub();
+              await getTagsListRequest();
+            },
+          });
+        })
+        .catch((error) => {
+          console.log("error", error);
+        });
+    };
+    function filterOption(inputValue, option) {
+      const reg = new RegExp(inputValue);
+      const result = reg.test(option.label);
+      console.log(result);
+      return result;
+    }
+    onBeforeMount(() => {
+      getTagsListRequest();
+    });
+    return {
+      formRef,
+      rules,
+      ruleForm,
+      onSubmit,
+      loading,
+      options: [],
+      del,
+      edit,
+      items,
+      addItem,
+      addTag,
+      tagsList,
+      filterOption,
+      getTagsListRequest,
+      visibleTags,
+      addTagUpdata,
+      countColor,
+      isShow,
+
+      smellList,
+      packList,
+      addSmellHandle,
+      delSmellHandle,
+      addPackHandle,
+      delPackHandle,
+      tasteBlurHandle,
+      packBlurHandle,
+    };
+  },
+});
+</script>
+
+<style lang="scss" scoped>
+.icon {
+  font-size: 16px;
+  .del {
+    margin: 0 10px;
+  }
+}
+.tags {
+  margin: 0 5px 5px;
+  min-width: 75px;
+  width: 48px;
+  height: 19px;
+  border-radius: 4px;
+  // position: relative;
+  box-sizing: border-box;
+  .title {
+    // position: absolute;
+    font-size: 12px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    font-weight: 400;
+    line-height: 17px;
+    display: flex;
+    justify-content: center;
+  }
+  .tagStyle {
+    border-radius: 4px;
+    max-width: 120px;
+    padding: 0 5px;
+    margin: 0 5px;
+    display: inline-block;
+    border-width: 1px;
+    border-style: solid;
+    color: #4db8fa;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+}
+.show-select {
+  .icon {
+    display: none !important;
+  }
+}
+.create-survey {
+  &-title {
+    display: flex;
+    align-items: center;
+    margin-bottom: 24px;
+    &-line {
+      width: 4px;
+      height: 16px;
+      background: #70b936;
+      border-radius: 0px 0px 0px 0px;
+    }
+    &-text {
+      font-size: 16px;
+      font-weight: 500;
+      color: #262626;
+      margin-left: 8px;
+    }
+  }
+  &-list {
+    &-item {
+      display: flex;
+      margin-bottom: 24px;
+      &-label {
+        position: relative;
+        display: inline-flex;
+        align-items: center;
+        height: 32px;
+        color: rgba(0, 0, 0, 0.85);
+        font-size: 14px;
+        margin-right: 12px;
+        word-break: keep-all;
+        &::before {
+          display: inline-block;
+          margin-right: 4px;
+          color: #ff4d4f;
+          font-size: 14px;
+          font-family: SimSun, sans-serif;
+          line-height: 1;
+          content: "*";
+        }
+      }
+      &-right {
+        position: relative;
+        flex: 1;
+        &-input {
+          display: flex;
+          align-items: center;
+        }
+        &-text {
+          position: absolute;
+          left: 0;
+          color: rgba(0, 0, 0, 0.45);
+          height: 0;
+          font-size: 14px;
+          line-height: 1.5715;
+          transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
+          overflow: hidden;
+        }
+      }
+      &-error {
+        .create-survey-list-item-right-text {
+          height: 24px;
+          color: #ff4d4f;
+        }
+        &::v-deep {
+          .custom-input {
+            border-color: #ff4d4f;
+            &:hover {
+              border-color: #ff4d4f;
+            }
+          }
+        }
+      }
+      .addfont {
+        margin-left: 10px;
+        cursor: pointer;
+        color: #bfbfbf;
+        &:hover {
+          color: #434343;
+        }
+      }
+    }
+  }
+  &-footer {
+    display: flex;
+    justify-content: flex-end;
+    padding-top: 24px;
+  }
+}
+::v-deep .ant-input-textarea-clear-icon {
+  margin: 4px 3px 0 0;
+}
+</style>
--- a/src/views/TempMarket/fragment/TableList.vue
+++ b/src/views/TempMarket/fragment/TableList.vue
@@ -26,7 +26,11 @@
        <div v-else>{{ record?.title }}</div>
      </template>
      <template #tag="{ record }">
-        <div v-for="item in record.tag" :key="item.id" style="display: inline-block">
+        <div
+          v-for="item in record.tag"
+          :key="item.id"
+          style="display: inline-block"
+        >
          <!-- <div v-for="it in record.tag" :key="it.id" style="display:inline-block;"> -->
          <a-tooltip
            v-if="(record.tag && record.tag.length > 2) || isOverstep"
@@ -34,13 +38,22 @@
            :title="record.titles"
          >
            <div style="display: flex; flex-direction: row">
-              <div :title="item.title" :style="countColor(item.color)" class="tagStyle">
+              <div
+                :title="item.title"
+                :style="countColor(item.color)"
+                class="tagStyle"
+              >
                {{ item.title }}
              </div>
              <div class="tagOmit" v-if="record.tags.length == 1">...</div>
            </div>
          </a-tooltip>
-          <div v-else :title="item.title" :style="countColor(item.color)" class="tagStyle">
+          <div
+            v-else
+            :title="item.title"
+            :style="countColor(item.color)"
+            class="tagStyle"
+          >
            {{ item.title }}
          </div>
          <!-- </div> -->
@@ -50,13 +63,20 @@
        <a-button type="link" @click="handlePreview(record)">预览</a-button>
        <a-button type="link" @click="handleUse(record)">使用</a-button>
        <a-dropdown>
-          <a class="ant-dropdown-link" style="display: inline-block" @click.prevent>
+          <a
+            class="ant-dropdown-link"
+            :class="{ 'ant-dropdown-link-disable': record.type === 1 }"
+            style="display: inline-block"
+            @click.prevent
+          >
            更多
            <DownOutlined />
          </a>
-          <template #overlay>
+          <template #overlay v-if="record.type !== 1">
            <a-menu>
-              <a-menu-item @click="handleRemove(record)">重命名模版</a-menu-item>
+              <a-menu-item @click="handleRemove(record)"
+                >重命名模版</a-menu-item
+              >
              <a-menu-item>
                <a-popconfirm
                  title="确定删除改模版?"
@@ -97,17 +117,64 @@
        @showSizeChange="onShowSizeChange"
      />
    </div>
-    <a-modal v-model:visible="createVisible" title="创建问卷" :footer="null">
+    <a-modal v-model:visible="createVisible" :footer="null">
+      <template v-if="curTemp?.type === 1" v-slot:title>
+        <div class="custom-head">
+          <div>创建问卷</div>
+          <a-tooltip
+            placement="rightTop"
+            :overlayStyle="{
+              'max-width': '500px',
+            }"
+          >
+            <template v-slot:title>
+              <div class="custom-head-tip">
+                <div class="custom-head-tip-fz14" style="margin-bottom: 8px">
+                  说明
+                </div>
+                <div class="custom-head-tip-fz12" style="margin-bottom: 8px">
+                  此处主要配置问卷内产品口味包装参与调研的关键属性，您可以自定义关键属性。其中，口味和包装的关键属性分别不可重复且至少配置一个关键属性。
+                </div>
+                <div class="custom-head-tip-fz12" style="margin-bottom: 16px">
+                  您配置几个口味关键属性就会生成几道“口味属性喜欢成都”的题目，配置几个包装关键属性就会生成几道“包装属性喜欢程度”的题目。
+                </div>
+                <div class="custom-head-tip-fz14" style="margin-bottom: 8px">
+                  示例
+                </div>
+                <div class="custom-head-tip-fz12" style="margin-bottom: 8px">
+                  示例配置了一个口味关键属性“甜味”和一个包装关键属性“高端”，创建的问卷中对应的题目见下图，区别于普通题型，固定题型会展示固定标签以及对应属性信息。
+                </div>
+                <img
+                  class="custom-head-tip-img"
+                  :src="`${baseOss}/sell-example.png`"
+                />
+              </div>
+            </template>
+            <i class="iconfont">&#xe792;</i>
+          </a-tooltip>
+        </div>
+      </template>
+      <template v-else v-slot:title>
+        <div class="custom-head">
+          <div>创建问卷</div>
+        </div>
+      </template>
      <CreateSurvey
        :temp_sn="temp_sn"
        :info="info"
        :group-list="ProjectGroupList"
+        :curTemp="curTemp"
        @close="handleClose"
        @cancel="handleClose"
        @temPreview="toDisngnPage"
      />
    </a-modal>
-    <a-modal v-model:visible="renameVisible" title="重命名模版" :footer="null" :sn="sn">
+    <a-modal
+      v-model:visible="renameVisible"
+      title="重命名模版"
+      :footer="null"
+      :sn="sn"
+    >
      <ReName :sn="sn" @cancel="renameVisible = false" @update="update" />
    </a-modal>
    <a-modal v-model:visible="visibleMove" title="移动至分组" :footer="null">
@@ -118,14 +185,24 @@
        @update="update"
      />
    </a-modal>
-    <a-modal v-model:visible="editLabelVisible" title="编辑标签" :footer="null" :zIndex="100000">
+    <a-modal
+      v-model:visible="editLabelVisible"
+      title="编辑标签"
+      :footer="null"
+      :zIndex="100000"
+    >
      <editLabel
        :info="editLabelItem"
        @cancel="editLabelVisible = false"
        @update="editLabelUpdata"
      />
    </a-modal>
-    <a-modal v-model:visible="preview_visible" width="80%" :footer="null" :destroyOnClose="true">
+    <a-modal
+      v-model:visible="preview_visible"
+      width="80%"
+      :footer="null"
+      :destroyOnClose="true"
+    >
      <div class="top" style="margin-top: 20px">
        <h2>预览问卷</h2>
      </div>
@@ -139,16 +216,24 @@ import MoveGroup from "../components/MoveGroup";
 import editLabel from "../components/editLabel.vue";
 import ReName from "../components/ReName";
 import TempPreview from "@views/ProjectManage/components/TempPreview";
-import CreateSurvey from "@/views/ProjectManage/components/CreateSurvey";
+import CreateSurvey from "../components/CreateSurveyCopy.vue";

 import { getGroupList } from "@/api/template-market";

-import { nextTick, defineComponent, ref, onBeforeMount, watch, getCurrentInstance } from "vue";
+import {
+  nextTick,
+  defineComponent,
+  ref,
+  onBeforeMount,
+  watch,
+  getCurrentInstance,
+} from "vue";
 import { useRouter } from "vue-router";
 import { DownOutlined } from "@ant-design/icons-vue";

 import { delTemplate, getTemplateList } from "@/api/template-market";
 import { getSurveySorts } from "@/views/ProjectManage/api.js";
+import { baseOss } from "../../../config";
 const router = useRouter();
 const columns = [
  {
@@ -236,6 +321,7 @@ export default defineComponent({
    const preview_visible = ref(false);
    const createVisible = ref(false);
    const info = { sn: "" };
+    const curTemp = ref(null);

    const table = ref(null);
    watch(
@@ -409,7 +495,7 @@ export default defineComponent({
    onBeforeMount(async () => {
      page.value = props.pageIndex ? props.pageIndex : 1;
      const { data } = await getSurveySorts(1);
-      if(data){
+      if (data) {
        search.value.sort = data.sort || "";
      }
      getTemplates();
@@ -420,6 +506,7 @@ export default defineComponent({
    };
    function handleUse(record) {
      temp_sn.value = record.sn;
+      curTemp.value = record;
      createVisible.value = true;
    }
    // 标签颜色
@@ -491,6 +578,7 @@ export default defineComponent({
      createVisible.value = false;
    }
    return {
+      baseOss,
      table,
      sn,
      handleChangeTable,
@@ -530,6 +618,7 @@ export default defineComponent({
      info,
      ProjectGroupList,
      handleClose,
+      curTemp,
    };
  },
 });
@@ -612,6 +701,38 @@ export default defineComponent({
  border: 1px solid #4db8fa;
  color: #4db8fa;
 }
+.custom-head {
+  display: flex;
+  align-items: center;
+  font-size: 16px;
+  font-weight: 500;
+  color: #262626;
+  .iconfont {
+    line-height: 14px;
+    height: 16px;
+    margin-left: 9px;
+    color: $yili-default-color;
+    cursor: pointer;
+    &:hover {
+      opacity: 0.8;
+    }
+  }
+  &-tip {
+    padding: 14px 25px;
+    &-fz14 {
+      line-height: 22px;
+      font-size: 14px;
+    }
+    &-fz12 {
+      line-height: 22px;
+      font-size: 12px;
+    }
+    &-img {
+      width: 342px;
+      height: 166px;
+    }
+  }
+}
 :deep(.ant-table) {
  width: 100%;
 }
@@ -621,4 +742,8 @@ export default defineComponent({
 .ant-table-title {
  padding: 0 !important;
 }
+.ant-dropdown-link-disable {
+  color: rgba(0, 0, 0, 0.25);
+  cursor: not-allowed;
+}
 </style>
--- a/src/views/planetDesign/Design/fragement/QuesBaseItem.vue
+++ b/src/views/planetDesign/Design/fragement/QuesBaseItem.vue
@@ -1,5 +1,6 @@
 <template>
  <div class="base">
+    <div class="sell-verify">标签属性#{{ info?.question_value }}</div>
    <div class="related-option" v-for="rel in relatedOption" :key="rel.id">
      <i class="iconfont">&#xe759;</i>
      <div class="related-option-title">
@@ -130,6 +131,10 @@ export default defineComponent({
  margin-bottom: 25px;
  flex: 1;
 }
+.sell-verify {
+  padding-left: 37px;
+  color: $yili-default-color;
+}
 .related-option {
  display: flex;
  font-size: 14px;