WXL
2025-03-04 83d83221778cf0213a979ebfcb4d75884038d9c1
src/views/Intelligentcenter/centercontrol/index.vue
@@ -48,7 +48,7 @@
          <el-menu-item-group>
            <el-menu-item index="3-1">话术库</el-menu-item>
            <el-menu-item index="3-2">意图管理</el-menu-item>
            <el-menu-item index="3-3">模版库</el-menu-item>
            <el-menu-item index="3-3">模板库</el-menu-item>
          </el-menu-item-group>
          <!-- <el-submenu index="1-4">
            <template slot="title">选项4</template>
@@ -72,7 +72,37 @@
            :label="item.title"
            :name="item.name"
          >
            {{ item.content }}
            <!-- {{ item.content }} -->
            <div class="leftvalu-code" v-if="editableTabs.length">
              <el-tabs
                v-model="fiactiveName"
                type="card"
                @tab-click="handleClick"
              >
                <el-tab-pane
                  v-if="item.content == 0 || item.content == 3"
                  label="代码展示"
                  name="first"
                  ><codemirror
                    v-model="item.value"
                    :options="options"
                  ></codemirror
                ></el-tab-pane>
                <el-tab-pane
                  v-if="item.content == 1 || item.content == 3"
                  label="表格展示"
                  name="second"
                  ><el-table :data="tableData" style="width: 100%">
                    <el-table-column prop="date" label="日期" width="180">
                    </el-table-column>
                    <el-table-column prop="name" label="姓名"
          width="100" >
                    </el-table-column>
                    <el-table-column prop="address" label="地址">
                    </el-table-column> </el-table
                ></el-tab-pane>
              </el-tabs>
            </div>
          </el-tab-pane>
        </el-tabs>
      </div>
@@ -81,47 +111,132 @@
</template>
<script>
// import { codemirror } from "vue-codemirror";
export default {
  name: "education",
  data() {
    return {
      code: "",
      fiactiveName: "first",
      options: {
        line: true,
        theme: "rubyblue", // 主题
        tabSize: 4, // 制表符的宽度
        indentUnit: 2, // 一个块应该缩进多少个空格(无论这在编辑语言中意味着什么)。默认值为 2。
        firstLineNumber: 1, // 从哪个数字开始计算行数。默认值为 1。
        readOnly: false, // 只读
        autorefresh: true,
        smartIndent: true, // 上下文缩进
        lineNumbers: true, // 是否显示行号
        styleActiveLine: true, // 高亮选中行
        viewportMargin: Infinity, //处理高度自适应时搭配使用
        showCursorWhenSelecting: true, // 当选择处于活动状态时是否应绘制游标
        mode: "javascript",
      },
      tableData: [
        {
          date: "2016-05-02",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 弄",
        },
        {
          date: "2016-05-04",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1517 弄",
        },
        {
          date: "2016-05-01",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1519 弄",
        },
        {
          date: "2016-05-03",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1516 弄",
        },
      ],
      editableTabsValue: "2-2-3",
      editableTabslist: [
        {
          title: "患者管理",
          name: "1-1",
          content: "Tab 1 content",
          content: 0,
          value: "<el-tab-pane>",
        },
        {
          title: "宣教管理",
          name: "2-1",
          content: "Tab 2 content",
          content: 1,
          value:
            "<el-table-column prop='address' label='地址'></el-table-column>",
        },
        {
          title: "问卷管理",
          name: "2-2",
          content: "Tab 2 content",
          content: 3,
          value:
            "<el-table-column prop='address' label='地址'></el-table-column>",
        },
        {
          title: "题库管理",
          name: "2-3",
          content: "Tab 2 content",
          content: "",
        },
        {
          title: "话术库",
          name: "3-1",
          content: "Tab 2 content",
          content: "",
        },
        {
          title: "意图管理",
          name: "3-2",
          content: "Tab 2 content",
          content: "",
        },
        {
          title: "模板库",
          name: "3-3",
          content: "Tab 2 content",
          content: "",
        },
      ],
      // 需要的树的格式
      editableTabslisat: [
        {
          title: "患者管理",
          name: "1",
          son: [
            {
              title: "患者管理",
              name: "1-1",
              content: "",
            },
          ],
        },
        {
          title: "知识库",
          name: "2",
          son: [
            {
              title: "宣教管理",
              name: "2-1",
              content: "",
            },
            {
              title: "问卷管理",
              name: "2-2",
              content: "",
            },
            {
              title: "题库管理",
              name: "2-3",
              content: "",
              son: [
                { title: "政策管理", name: "2-3-1", content: "" },
                { title: "治安管理", name: "2-3-2", content: "" },
              ],
            },
          ],
        },
      ],
      editableTabs: [],
@@ -143,24 +258,19 @@
      });
      var results = this.editableTabs.some(function (item) {
        if (item.name == "张三") {
        if (item.name == key) {
          //item.name == "王麻子"
          return true; //返回false
        }
      });
      this.editableTabs.push(result);
      if (!results) {
        this.editableTabs.push(result);
      }
      this.editableTabsValue = key;
      console.log(result);
    },
    handleTabsEdit(targetName, action) {
      if (action === "add") {
        let newTabName = ++this.tabIndex + "";
        this.editableTabs.push({
          title: "New Tab",
          name: newTabName,
          content: "New Tab content",
        });
        this.editableTabsValue = newTabName;
      }
      if (action === "remove") {
        let tabs = this.editableTabs;
@@ -187,6 +297,17 @@
<style lang="scss" scoped>
.educationmanagement {
  display: flex;
}
.leftvalu-code {
  // background: #3a3d42;
  height: 300px;
  ::v-deep.CodeMirror {
    position: relative;
    overflow: hidden;
    // background: #3a3d42;
    color: #3a92ef;
    font-size: 20px;
  }
}
.sidecolumn {
  width: 300px;
@@ -224,6 +345,7 @@
    display: center !important;
  }
}
.qrcode-dialo {
  text-align: center;
  //   display: flex;