测试完成

WXL (wul)

昨天 e06cd3953ba8a6e0eee11c235bce9ced419a2800

 src/views/knowledge/questionnaire/compilequer/index.vue

@@ -117,27 +117,6 @@
              </el-form-item>
            </el-col>
          </el-row>
          <!-- <el-row :gutter="20">
            <el-col :span="10">
              <el-form-item label="长期任务" prop="longTemp">
                <el-radio-group v-model="ruleForm.longTemp">
                  <el-radio
                    v-for="(item, index) in longtype"
                    :label="item.value"
                    >{{ item.label }}</el-radio
                  >
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="8" v-if="ruleForm.longTemp">
              <el-form-item label="任务周期（几天后）" prop="name">
                <el-input
                  v-model="ruleForm.sendDay"
                  placeholder="默认5天后"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row> -->

          <el-row>
            <el-form-item prop="dynamicTags">
@@ -262,7 +241,7 @@
                  <el-option
                    class="ruleFormaa"
                    v-for="item in flatArray"
                    :key="item.deptCode"
                    :key="item.id"
                    :label="item.label"
                    :value="item.deptCode"
                  >
@@ -285,7 +264,7 @@
                  <el-option
                    class="ruleFormaa"
                    v-for="item in flatArray"
                    :key="item.deptCode"
                    :key="item.id"
                    :label="item.label"
                    :value="item.deptCode"
                  >
@@ -310,7 +289,7 @@
              >下一步</el-button
            >
            <el-button type="info" @click="closeFm('ruleForm')">关闭</el-button>
            <el-button @click="Departmenttreatment('ruleForm')"
            <el-button @click="toExamine('ruleForm')"
              >保存问卷基础信息</el-button
            >
          </el-form-item>
@@ -396,6 +375,20 @@
                    <dict-tag
                      :options="askvaluetype"
                      :value="scope.row.scriptType"
                    />
                  </template>
                </el-table-column>
                <el-table-column
                  label="维度"
                  align="center"
                  key="dimension"
                  prop="dimension"
                  :show-overflow-tooltip="true"
                >
                  <template slot-scope="scope">
                    <dict-tag
                      :options="dict.type.dimensionality_type"
                      :value="scope.row.dimension"
                    />
                  </template>
                </el-table-column>
@@ -550,6 +543,26 @@
                        placeholder="请输入题号"
                      ></el-input>
                    </el-form-item>

                    <el-form-item prop="valueType">
                      <template #label>
                        结果类型
                        <el-tooltip
                          class="item"
                          effect="light"
                          content="本类型为结果收集类型；选项用于指向性题目如是否等；文本适用复杂情况；数值用于收集数值型数据"
                          placement="top-start"
                        >
                          <i class="el-icon-warning-outline"></i>
                        </el-tooltip>
                        <!-- 在标签后插入红色星号 -->
                      </template>
                      <el-radio-group v-model="topicobj.valueType">
                        <el-radio :label="1">选项</el-radio>
                        <el-radio :label="2">文本</el-radio>
                        <el-radio :label="3">数值</el-radio>
                      </el-radio-group>
                    </el-form-item>
                  </el-col>
                </el-row>

@@ -566,10 +579,10 @@
                    </el-form-item></el-col
                  >
                  <el-col :span="12"
                    ><el-form-item label="是否可用">
                      <el-radio-group v-model="topicobj.isenable">
                    ><el-form-item label="是否隐藏">
                      <el-radio-group v-model="topicobj.ishide">
                        <el-radio
                          v-for="(item, index) in usable"
                          v-for="(item, index) in hides"
                          :label="item.value"
                          >{{ item.label }}</el-radio
                        >
@@ -582,8 +595,8 @@
                  v-if="topicobj.scriptType == 1"
                >
                  <el-radio-group v-model="topicobj.branchFlag">
                    <el-radio :label="1">是</el-radio>
                    <el-radio :label="0">否</el-radio>
                    <el-radio label="1">是</el-radio>
                    <el-radio label="0">否</el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item label="选中提示" v-if="topicobj.scriptType != 1">
@@ -634,9 +647,9 @@
                          label="ABC等级"
                        >
                          <el-radio-group v-model="item.score">
                            <el-radio label="A">A</el-radio>
                            <el-radio label="B">B</el-radio>
                            <el-radio label="C">C</el-radio>
                            <el-radio :label="1">A</el-radio>
                            <el-radio :label="2">B</el-radio>
                            <el-radio :label="3">C</el-radio>
                          </el-radio-group>
                        </el-form-item>
                        <el-form-item
@@ -651,13 +664,86 @@
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <el-row>
                      <el-col :span="12">
                        <el-form-item label="关联服务">
                          <div
                            v-if="item.sendTaskname"
                            class="service-tag-container"
                          >
                            <el-tag
                              type="success"
                              closable
                              @close="removeService(item)"
                              class="service-tag"
                            >
                              <i class="el-icon-connection service-icon"></i>
                              {{ item.sendTaskname }}
                            </el-tag>
                          </div>
                          <div v-else class="service-add-btn">
                            <el-button
                              type="success"
                              size="small"
                              icon="el-icon-plus"
                              @click="openServiceDialog(item)"
                              class="add-service-btn"
                            >
                              选择任务
                            </el-button>
                          </div>
                        </el-form-item>
                      </el-col>
                      <el-col :span="12">
                        <el-form-item label="默认选项">
                          <el-radio-group v-model="item.defaultValue">
                            <el-radio :label="2">是</el-radio>
                            <el-radio :label="1">否</el-radio>
                          </el-radio-group>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <el-row :gutter="10">
                      <el-form-item label="异常提醒">
                        <el-radio-group v-model="item.isabnormal">
                          <el-radio :label="1">是</el-radio>
                          <el-radio :label="0">否</el-radio>
                        </el-radio-group>
                      </el-form-item>
                      <el-col :span="11">
                        <!-- 修改：异常提醒部分 -->
                        <el-form-item label="异常提醒">
                          <el-select
                            v-model="item.isabnormal"
                            placeholder="请选择状态"
                          >
                            <el-option
                              :value="0"
                              label="正常"
                              :style="{ color: '#67C23A' }"
                            >
                              <span style="color: #67c23a">● 正常</span>
                            </el-option>

                            <el-option
                              :value="2"
                              label="警告"
                              :style="{ color: '#FFBA00' }"
                            >
                              <span style="color: #ffba00">● 警告</span>
                            </el-option>
                            <el-option
                              :value="1"
                              label="异常"
                              :style="{ color: '#f75c5c' }"
                            >
                              <span style="color: #f75c5c">● 异常</span>
                            </el-option>
                          </el-select>
                        </el-form-item>
                      </el-col>
                      <el-col :span="11">
                        <el-form-item label="是否选中收集附加信息">
                          <el-radio-group v-model="item.appendflag">
                            <el-radio label="1">是</el-radio>
                            <el-radio label="0">否</el-radio>
                          </el-radio-group>
                        </el-form-item>
                      </el-col>
                    </el-row>
                    <el-row :gutter="10" v-if="topicobj.branchFlag == 1">
                      <el-col :span="20"
@@ -691,7 +777,9 @@
                            <el-image
                              style="width: 100px; height: 100px"
                              :src="item.picturePath"
                              :preview-src-list="[...item.picturePath]"
                              :preview-src-list="
                                item.picturePath ? [item.picturePath] : []
                              "
                            >
                            </el-image>
                          </div>
@@ -702,6 +790,14 @@
                </div>
                <div v-else>
                  <div class="topicxq">
                    <el-row>
                      <el-form-item label="是否作为意见收集题目">
                        <el-radio-group v-model="topicobj.isMydException">
                          <el-radio label="1">是</el-radio>
                          <el-radio label="0">否</el-radio>
                        </el-radio-group>
                      </el-form-item>
                    </el-row>
                    <el-row :gutter="10">
                      <el-form-item label="答案">
                        <el-input
@@ -747,9 +843,7 @@
        >
        <el-button type="primary" @click="laststep()">上一步</el-button>
        <el-button type="info" @click="closeFm('ruleForm')">关闭</el-button>
        <el-button @click="Departmenttreatment('ruleForm')"
          >保存问题数据</el-button
        >
        <el-button @click="toExamine('ruleForm')">保存问题数据</el-button>
      </div>
      <!-- 问卷预览 -->
      <div v-if="Editprogress == 3">
@@ -764,7 +858,7 @@
              v-if="item.scriptType == 1"
            >
              <div class="dev-text">
                {{ item.sort }}、[单选]<span>{{ item.scriptContent }}</span>
                {{ item.sort }}. [单选]<span>{{ item.scriptContent }}</span>
              </div>
              <div class="dev-xx">
                <el-radio-group v-model="item.remark">
@@ -784,7 +878,7 @@
              v-if="item.scriptType == 2"
            >
              <div class="dev-text">
                {{ item.sort }}、[多选]<span>{{ item.scriptContent }}</span>
                {{ item.sort }}. [多选]<span>{{ item.scriptContent }}</span>
              </div>
              <div class="dev-xx">
                <el-checkbox-group v-model="qremark">
@@ -1104,15 +1198,15 @@
                    <div class="basics">
                      选项设置
                      <span style="margin-left: 30px"
                        ><el-button type="primary" round @click="addoption"
                          >+新增</el-button
                        ><el-button class="addoption-btn" @click="addoption"
                          >+新增选项</el-button
                        ></span
                      >
                    </div>
                  </div>
                  <el-divider></el-divider>
                  <div
                    class="topicxq"
                    class="topic-card"
                    v-for="item in indexform.svyLibTemplateTargetoptions"
                    v-if="item.isoperation != 3"
                  >
@@ -1122,7 +1216,7 @@
                          <el-input
                            style="width: 400px"
                            type="text"
                            placeholder="请输入选项分值"
                            placeholder="请输入选项名称"
                            v-model="item.optioncontent"
                            show-word-limit
                          >
@@ -1146,9 +1240,9 @@
                          label="ABC等级"
                        >
                          <el-radio-group v-model="item.score">
                            <el-radio label="A">A</el-radio>
                            <el-radio label="B">B</el-radio>
                            <el-radio label="C">C</el-radio>
                            <el-radio :label="1">A</el-radio>
                            <el-radio :label="2">B</el-radio>
                            <el-radio :label="3">C</el-radio>
                          </el-radio-group>
                        </el-form-item>
                        <el-form-item
@@ -1212,7 +1306,9 @@
                          <el-image
                            style="width: 100px; height: 100px"
                            :src="item.picturePath"
                            :preview-src-list="[...item.picturePath]"
                            :preview-src-list="
                              item.picturePath ? [item.picturePath] : []
                            "
                          >
                          </el-image>
                        </div>
@@ -1226,6 +1322,144 @@
        </el-tabs>
      </div>
    </el-drawer>
    <!-- 选择任务弹窗 -->
    <el-dialog
      title="选择任务"
      :visible.sync="serviceDialogVisible"
      width="50%"
    >
      <div>
        <el-form
          :model="topqueryParams"
          ref="queryForm"
          size="small"
          :inline="true"
          label-width="98px"
        >
          <el-form-item label="任务名称">
            <el-input
              v-model="topqueryParams.taskName"
              @keyup.enter.native="handleQuery"
            ></el-input>
          </el-form-item>
          <el-form-item label="任务类型" prop="status">
            <el-select
              v-model="topqueryParams.serviceType"
              placeholder="请选择服务类型"
            >
              <el-option
                v-for="item in taskoptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-form>
        <el-table
          :data="filteredServiceList"
          v-loading="taskloading"
          @selection-change="handleServiceSelectionChange"
        >
          <el-table-column type="selection" width="55"></el-table-column>
          <el-table-column
            label="任务名称"
            fixed
            align="center"
            key="taskName"
            prop="taskName"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="任务描述"
            align="center"
            key="taskDesc"
            prop="taskDesc"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="服务项目"
            align="center"
            key="templatename"
            prop="templatename"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="总任务/已随访"
            align="center"
            key="nickName"
            width="120"
            prop="nickName"
          >
            <template slot-scope="scope">
              <span
                >{{
                  scope.row.wfs || scope.row.wfs == 0
                    ? scope.row.wfs + scope.row.yfs
                    : ""
                }}/{{ scope.row.yfs }}</span
              >
            </template>
          </el-table-column>
          <el-table-column
            label="是否长期任务"
            align="center"
            key="longTask"
            prop="longTask"
          >
            <template slot-scope="scope">
              <span>{{ scope.row.longTask ? "长期任务" : "非长期" }}</span>
            </template>
          </el-table-column>

          <el-table-column
            label="状态"
            align="center"
            key="sendState"
            prop="sendState"
          >
            <template slot-scope="scope">
              <dict-tag
                :options="dict.type.task_status"
                :value="scope.row.sendState"
              />
            </template>
          </el-table-column>

          <el-table-column
            label="创建人"
            align="center"
            key="createBy"
            prop="createBy"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="创建时间"
            sortable
            align="center"
            prop="createTime"
          >
            <template slot-scope="scope">
              <span>{{ formatTime(scope.row.createTime) }}</span>
            </template>
          </el-table-column>
        </el-table>
        <pagination
          v-show="tasktotal > 0"
          :total="tasktotal"
          :page.sync="topqueryParams.pageNum"
          :limit.sync="topqueryParams.pageSize"
          @pagination="gettaskList"
        />
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="serviceDialogVisible = false">取消</el-button>
        <el-button type="primary" @click="confirmServiceSelection"
          >确定</el-button
        >
      </span>
    </el-dialog>
    <!-- 添加适用疾病窗口 -->
    <Optional-Form
      ref="child"
@@ -1247,17 +1481,12 @@
  depthospgetsonlist,
  getQtemplateobj,
  compileQtemplate,
  Qtemplateinfo,
  compileissue,
  delQtemplateinfo,
  Followupinfo,
  issueinfo,
  getissuelist,
  depthospgetsondel,
  deltargetillness,
  addtargetillness,
  getillnesslist,
  illnesslistget,
  getTasklist,
  getillness,
} from "@/api/AiCentre/index";
import OptionalForm from "@/components/OptionalForm"; //正则组件
@@ -1265,8 +1494,12 @@
import { deptTreeSelect } from "@/api/system/user";

export default {
  name: "Questionnaireinfo",

  dicts: [
    "sys_normal_disable",
    "dimensionality_type",
    "sys_user_sex",
    "task_status",
  ],
  components: { OptionalForm },

  data() {
@@ -1289,12 +1522,44 @@
      dialogVisiblepatient: false, //适用疾病窗口
      inputValue: "",
      topicobj: {},
      topqueryParams: {
        pageNum: 1,
        pageSize: 10,
        type: 3,
      },
      tasktotal: 0,
      taskloading: false,
      taskoptions: [
        {
          value: 4,
          label: "宣教关怀",
          raw: {
            cssClass: "",
            listClass: "",
          },
        },
        {
          value: 5,
          label: "复诊通知",
          raw: {
            cssClass: "",
            listClass: "",
          },
        },
      ],
      // 总条数
      total: 1,
      serviceDialogVisible: false, // 选择任务弹窗显示控制
      serviceSearch: "", // 任务搜索关键词
      serviceList: [], // 任务列表
      filteredServiceList: [],
      selectedService: null, // 选中的任务
      currentOptionItem: null, // 当前正在设置的任务选项项
      ruleForm: {
        svyTemplateLibScripts: [],
        tempDetpRelevances: [],
        svyLibTemplateTagList: [],
        suitway: [],
        scoreType: "4",
        isenable: "0",
        longTemp: "0",
@@ -1400,6 +1665,10 @@
      usable: [
        { value: "0", label: "可用" },
        { value: "1", label: "停用" },
      ],
      hides: [
        { value: 0, label: "正常" },
        { value: 1, label: "隐藏" },
      ],
      longtype: [
        { value: "0", label: "普通任务" },
@@ -1618,8 +1887,8 @@
          this.confirmillness();
          this.putbelongDepts();
          this.$modal.closeLoading();
          // this.$router.go(-1);
          window.location.reload();
          this.$router.go(-1);
          // window.location.reload();
        });
      } else {
        this.ruleForm.isoperation = 1;
@@ -1636,6 +1905,44 @@
        });
      }
    },
    // 题目校验
    toExamine() {
      // 遍历题目集合
      for (let i = 0; i < this.ruleForm.svyTemplateLibScripts.length; i++) {
        const question = this.ruleForm.svyTemplateLibScripts[i];

        // 如果 scriptType 为 4，则跳过当前题目
        if (question.scriptType === 4) {
          continue;
        }
        // 获取当前题目的选项集合
        const options = question.svyLibTemplateTargetoptions;

        // 创建一个 Set 来存储选项名称，用于检测重复
        const optionNames = new Set();

        // 遍历选项集合
        for (let j = 0; j < options.length; j++) {
          const option = options[j];
          const optionContent = option.optioncontent;

          // 如果选项名称已经存在于 Set 中，说明重复
          if (optionNames.has(optionContent)) {
            this.$message.error(
              `题目 ${question.id} 的选项名称 "${optionContent}" 重复`
            );
            return false; // 返回 false 表示校验失败
          }
          // 将选项名称添加到 Set 中
          optionNames.add(optionContent);
        }
      }

      // 如果所有题目都校验通过，返回 true
      console.log("所有题目校验通过，选项名称无重复");
      this.Departmenttreatment();
    },

    // 科室/院区处理
    Departmenttreatment() {
      this.tempDetpRelevanceslist.forEach((item) => {
@@ -1696,6 +2003,62 @@
        });
      }
    },
    // ---------------选项任务绑定
    openServiceDialog(item) {
      this.gettaskList();
      this.currentOptionItem = item;
    },
    gettaskList() {
      getTasklist(this.topqueryParams).then((response) => {
        this.filteredServiceList = response.rows;
        this.tasktotal = response.total;
        this.serviceDialogVisible = true;
        this.$forceUpdate();
        this.taskloading = false;
      });
    },
    handleQuery() {
      this.topqueryParams.pageNum = 1;
      this.gettaskList();
    },
    // 新增方法：加载任务列表
    loadServiceList() {
      // 这里调用API获取任务列表
      // 示例数据，实际使用时需要调用相应的API
      this.serviceList = [
        { id: 1, taskName: "随访任务1", taskType: "常规随访" },
        { id: 2, taskName: "健康评估任务", taskType: "健康评估" },
        { id: 3, taskName: "用药提醒任务", taskType: "用药管理" },
      ];
    },

    // 新增方法：处理任务选择变化
    handleServiceSelectionChange(selection) {
      this.selectedService = selection.length > 0 ? selection[0] : null;
    },

    // 新增方法：确认选择任务
    confirmServiceSelection() {
      console.log(this.selectedService);
      console.log(this.currentOptionItem);

      if (this.selectedService && this.currentOptionItem) {
        this.currentOptionItem.sendTaskname = this.selectedService.taskName;
        this.currentOptionItem.sendTaskid = this.selectedService.taskid;
        this.serviceDialogVisible = false;
        this.serviceSearch = "";
        this.selectedService = null;
      } else {
        this.$message.warning("请选择一个任务");
      }
    },

    // 新增方法：移除关联服务
    removeService(item) {
      item.sendTaskname = "";
      item.sendTaskid = "";
    },
    // ------------------------
    // 下一步
    nextstep() {
      if (this.Editprogress <= 2) {
@@ -1736,7 +2099,9 @@
    },
    // 新增问题
    addtopic(row) {
      console.log(row);
      row.isoperation = 1;
      row.scriptid = row.id;
      row.svyLibScriptOptions.forEach((item) => {
        item.isoperation = 1;
      });
@@ -1800,14 +2165,19 @@
          '是否确认新增名称为"' + this.indexform.scriptTopic + '"的问题数据？'
        )
        .then(() => {
          // ✅ 强制初始化
          if (!Array.isArray(this.indexform.svyLibTemplateTargetoptions)) {
            this.$set(this.indexform, "svyLibTemplateTargetoptions", []);
          }

          this.indexform.isoperation = 1;
          this.indexform.svyLibTemplateTargetoptions.forEach((item) => {
            item.isoperation = 1;
          });

          this.ruleForm.svyTemplateLibScripts.push(this.indexform);
          this.indexform = { svyTemplateLibScripts: [] };
          this.drawer = false;

          this.sortFn();
          this.$modal.msgSuccess("问题新增成功，保存模板失效");
        });
@@ -2199,14 +2569,22 @@
    // ---------------------------------------------------------
    // 新问题新增
    addoption() {
      if (!this.indexform.svyLibTemplateTargetoptions) {
        this.indexform.svyLibTemplateTargetoptions = [];
      if (!Array.isArray(this.indexform.svyLibTemplateTargetoptions)) {
        this.$set(this.indexform, "svyLibTemplateTargetoptions", []);
      }

      this.indexform.svyLibTemplateTargetoptions.push({
        tempId: Date.now() + Math.random(),
        optioncontent: "",
        score: "",
        isoperation: 1,
      });
      console.log(this.indexform.svyLibTemplateTargetoptions);
    },
    deletexuanx(item) {
      this.indexform.svyLibTemplateTargetoptions =
        this.indexform.svyLibTemplateTargetoptions.filter(
          (opt) => opt.tempId !== item.tempId
        );
    },
    // 选项文件上传
    handleChange(item, response, file, fileList) {
@@ -2237,9 +2615,16 @@
</script>

<style lang="scss" scoped>
$radius: 8px;
$border: #e4e7ed;
$bg-light: #f7f9fb;
$primary: #409eff;
$text-main: #303133;
$text-sub: #606266;
.Questionnairemanagement {
  // display: flex;
}

.sidecolumn {
  margin: 10px 20px 0 20px;
  padding: 20px;
@@ -2248,6 +2633,7 @@
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}

.leftvlue {
  // //   display: flex;
  // //   flex: 1;
@@ -2261,20 +2647,25 @@
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);

  .mulsz {
    font-size: 20px;
  }

  .leftvlue-jbxx {
    display: flex; /* 使用 Flexbox 布局 */
    display: flex;
    /* 使用 Flexbox 布局 */
    justify-content: space-between;
    font-size: 24px;
    border-left: 5px solid #41a1be;
    padding-left: 5px;
    margin: 15px 0;
  }

  .demo-cascader {
    margin-right: 20px;
  }

  .PreviewTemplate {
    color: #02a7f0;
    cursor: pointer;
@@ -2282,6 +2673,7 @@
    margin: 0 20px;
  }
}

.preview-left {
  margin: 20px;
  //   margin: 20px;
@@ -2290,14 +2682,17 @@
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);

  .scriptTopic-dev {
    margin-bottom: 25px;
    font-size: 20px !important;

    .dev-text {
      margin-bottom: 10px;
    }
  }
}

.headline {
  display: flex;
  justify-content: space-between;
@@ -2306,6 +2701,7 @@
  padding-left: 5px;
  margin: 15px 0;
}

.xinz-inf {
  font-size: 18px;
  white-space: nowrap;
@@ -2317,6 +2713,7 @@
  .el-tag + .el-tag {
    margin-left: 10px;
  }

  .button-new-tag {
    margin-left: 10px;
    height: 32px;
@@ -2324,12 +2721,14 @@
    padding-top: 0;
    padding-bottom: 0;
  }

  .input-new-tag {
    width: 90px;
    margin-left: 10px;
    vertical-align: bottom;
  }
}

.xinz-infs {
  font-size: 18px;
  line-height: 48px;
@@ -2338,51 +2737,123 @@
    margin-left: 10px;
  }
}

.addtopic {
  margin-top: 30px;
}

.presentation {
  margin: 20px 0;
  display: flex;

  .presentation-left {
    width: 45%;
    // height: 500px;
    .button-textxg {
      color: #024df0;
    }
    .button-textsc {
      color: #f52727;
    }
  }
  .spresentation-left {
    width: 100%;
    // height: 500px;
    .button-textxg {
      color: #024df0;
    }
    .button-textsc {
      color: #f52727;
    }
  }
  .presentation-right {
    width: 55%;
    max-height: 688px;
    max-height: 80vh;
    padding: 0 20px;
    font-size: 18px;
    overflow: auto;

    .button-textxg {
      color: #024df0;
    }

    .button-textsc {
      color: #f52727;
    }
  }

  .spresentation-left {
    width: 100%;

    // height: 500px;
    .button-textxg {
      color: #024df0;
    }

    .button-textsc {
      color: #f52727;
    }
  }

  .presentation-right {
    flex: 6;
    min-width: 360px;
    max-height: 80vh;
    overflow: auto;
    padding: 20px;

    .headline {
      font-size: 20px;
      border-left: 3px solid #41a1be;
      padding-left: 5px;
      margin: 15px 0;
    }
    .topicxq {
      background-color: #e2f5fc;
      border-radius: 4px;
      margin-top: 10px;
      font-size: 18px;
      font-weight: 600;
      color: $text-main;
      padding-left: 10px;
      padding-top: 15px;
      border-left: 4px solid $primary;
      margin-bottom: 16px;
    }

    .topic-card {
      background: #fff;
      border: 1px solid $border;
      border-radius: $radius;
      padding: 20px;
      margin-bottom: 16px;
      transition: box-shadow 0.2s;

      &:hover {
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
      }

      .el-form-item {
        margin-bottom: 16px;
      }

      .el-form-item__label {
        font-size: 14px;
        color: $text-sub;
      }
    }
  }
}
.demo-drawer {
  .preview-left {
    padding: 20px;

    .headline {
      font-size: 18px;
      font-weight: 600;
      margin-bottom: 12px;
    }

    .topic-card {
      background: #fff;
      border: 1px solid $border;
      border-radius: $radius;
      padding: 16px;
      margin-bottom: 12px;

      .el-form-item {
        margin-bottom: 14px;
      }

      .el-button--primary {
        background: $primary;
        border-radius: 20px;
        padding: 8px 16px;
      }
    }
  }
}
.addoption-btn {
  width: 100%;
  border: 1px dashed $border;
  color: $text-sub;
  background: $bg-light;
  border-radius: $radius;
  height: 40px;

  &:hover {
    border-color: $primary;
    color: $primary;
  }
}
.topicxq {
@@ -2396,9 +2867,143 @@
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}
.custom-width {
  width: 100px; /* 设置宽度样式 */

.service-tag-container {
  display: inline-block;

  .service-tag {
    margin-right: 10px;
    max-width: 220px;
    height: 32px;
    line-height: 30px;
    padding: 0 12px;
    border-radius: 16px;
    font-size: 14px;
    font-weight: 500;
    border: 1px solid #e1f3d8;
    background: linear-gradient(135deg, #f0f9eb, #e1f3d8);
    box-shadow: 0 2px 4px rgba(103, 194, 58, 0.1);
    transition: all 0.3s ease;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    position: relative;

    &:hover {
      transform: translateY(-1px);
      box-shadow: 0 4px 8px rgba(103, 194, 58, 0.15);
      border-color: #b3e19d;
    }

    .service-icon {
      margin-right: 4px;
      font-size: 12px;
    }

    ::v-deep .el-icon-close {
      margin-left: 6px;
      font-size: 12px;
      color: #67c23a;
      background-color: #f0f9eb;
      border-radius: 50%;
      width: 16px;
      height: 16px;
      line-height: 16px;

      &:hover {
        background-color: #67c23a;
        color: white;
      }
    }
  }
}

.service-add-btn {
  display: inline-block;

  .add-service-btn {
    height: 32px;
    padding: 0 16px;
    border-radius: 16px;
    font-size: 14px;
    font-weight: 500;
    background: linear-gradient(135deg, #67c23a, #85ce61);
    border: none;
    box-shadow: 0 2px 4px rgba(103, 194, 58, 0.2);
    transition: all 0.3s ease;

    &:hover {
      transform: translateY(-1px);
      box-shadow: 0 4px 8px rgba(103, 194, 58, 0.3);
      background: linear-gradient(135deg, #5daf34, #7ac252);
    }

    &:active {
      transform: translateY(0);
      box-shadow: 0 2px 4px rgba(103, 194, 58, 0.2);
    }

    i {
      margin-right: 4px;
      font-size: 12px;
    }
  }
}

// 响应式设计
@media (max-width: 768px) {
  .service-tag-container .service-tag {
    max-width: 180px;
    font-size: 13px;
    padding: 0 10px;
  }

  .service-add-btn .add-service-btn {
    padding: 0 12px;
    font-size: 13px;
  }
}

// 添加动画效果
@keyframes tagFadeIn {
  from {
    opacity: 0;
    transform: scale(0.8) translateY(-5px);
  }

  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.service-tag {
  animation: tagFadeIn 0.3s ease-out;
}

// 为整个选项区域添加统一样式
.topicxq {
  .service-tag-container,
  .service-add-btn {
    margin: 8px 0;
  }
}

// 确保在表单中的正确布局
.el-form-item {
  .el-form-item__content {
    .service-tag-container,
    .service-add-btn {
      vertical-align: middle;
    }
  }
}

.custom-width {
  width: 100px;
  /* 设置宽度样式 */
}

.el-select {
  width: 280px;
}
@@ -2406,6 +3011,7 @@
.el-cascader {
  width: 40%;
}

::v-deep .addtopic-input {
  input {
    background: #02a7f0;
@@ -2413,25 +3019,31 @@
    width: 150px;
  }
}

::v-deep.el-step.is-vertical .el-step__title {
  font-size: 25px;
}

::v-deep.el-input--medium {
  font-size: 18px !important;
}

::v-deep.ruleFormaa.el-select {
  display: inline-block;
  position: relative;
  width: 700px;
}

.el-select__tags {
  font-size: 20px;
  max-width: 888px !important;
}

::v-deep.el-radio__inner {
  width: 22px;
  height: 22px;
}

// ::v-deep.scriptTopic-dev.el-radio__label {
//   font-size: 24px;
// }
@@ -2440,11 +3052,13 @@
    font-size: 24px;
  }
}

::v-deep.el-checkbox-group {
  span {
    font-size: 24px;
  }
}

// ::v-deep.el-form-item--medium .el-form-item__content {
//   line-height: 36px;
//   display: flex;