提交

src/api/aleditor.js

@@ -0,0 +1,44 @@
+import ajax from '../utils/request.js';
+
+/**
+ * 词典
+ * @param {object} ori
+ * @returns
+ */
+export function getVocabularyInfo(ori) {
+  return ajax({
+    api: '/html/getVocabularyInfo',
+    data: ori.data,
+    base: 'xzMao',
+    noJY: true,
+    method: 'GET',
+  });
+}
+/**
+ * 图片
+ * @param {object} ori
+ * @returns
+ */
+export function textImageMatch(ori) {
+  return ajax({
+    api: '/html/textImageMatch?isSampleDocument=false',
+    data: ori.data,
+    base: 'xzMao',
+    noJY: true,
+    method: 'POST',
+  });
+}
+/**
+ * 校阅
+ * @param {object} ori
+ * @returns
+ */
+export function checkContent(ori) {
+  return ajax({
+    api: '/html/checkContent?isSampleDocument=false',
+    data: ori.data,
+    base: 'xzMao',
+    noJY: true,
+    method: 'POST',
+  });
+}

src/config/index.js

@@ -7,6 +7,7 @@ export default {
         GaoDeMap: "https://restapi.amap.com",
         easyDiffusion: "https://diffusion.sxtvs.net",
         chat:"https://gpt.smcic.net/",
-        ws: "wss://chatglm.sxtvs.net/queue/join"
+        ws: "wss://chatglm.sxtvs.net/queue/join",
+        xzMao: "https://aidoc.sxtvs.net"
     }
 }

src/utils/request.js

@@ -32,6 +32,8 @@ function ajax(longRange) {
         return reject({ ...data, status: this.status });
       }
 
+      if (longRange.noJY) return resolve(data);
+
       if (!longRange.platfrom && data.code !== 0) {
         // 业务错误
         if (data.code === 40001) noLogin();
@@ -69,7 +71,8 @@ function fetch(longRange) {
       })
       .then(res => {
         loading.close();
-        if (!longRange.platfrom && res.code !== 0) {
+      if (longRange.noJY) return resolve(res);
+      if (!longRange.platfrom && res.code !== 0) {
           // 业务错误
           if (res.code === 40001) noLogin();
           errorStatus(res);

src/view/allMedia/AIeditor/assets/css/righttop.css

@@ -0,0 +1,116 @@
+.RightSonTitle {
+  height: 75px;
+  width: 95%;
+  display: flex;
+  -webkit-box-pack: justify;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  border-bottom: 1px solid #e1e1e1;
+}
+
+.header_left,
+.t_header {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+.t_header {
+  width: 100%;
+  height: 100%;
+  -webkit-box-pack: justify;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  border-bottom: 1px solid #e1e1e1;
+}
+.header_left {
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-box-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+}
+.header_right {
+  text-align: center;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+}
+
+.model-panel-logo {
+  background: #fff;
+  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04),
+    0 4px 10px rgba(0, 0, 0, 0.08);
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04), 0 4px 10px rgba(0, 0, 0, 0.08);
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-box-flex: 0;
+  -ms-flex: none;
+  flex: none;
+}
+
+.header_left .holder {
+  -webkit-box-flex: 0;
+  -ms-flex: 0 1 20px;
+  flex: 0 1 20px;
+}
+
+.msg_flex {
+  height: 100%;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-pack: space-evenly;
+  -ms-flex-pack: space-evenly;
+  justify-content: space-evenly;
+}
+
+.model-panel-name,
+.panel-item-row.name {
+  height: 22px;
+  line-height: 22px;
+  font-size: 14px;
+  font-weight: 700;
+  color: #4b4b4b;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.desc {
+  line-height: 18px;
+  font-size: 12px;
+  color: #8e8e8e;
+}
+
+.header_right .header-right-btn {
+  all: unset;
+  cursor: pointer;
+  -webkit-box-flex: 0;
+  -ms-flex: none;
+  flex: none;
+}
+
+.header_right .header-right-btn:not(:first-child) {
+    margin-left: 18px;
+}

src/view/allMedia/AIeditor/components/dictionary.vue

@@ -1,47 +1,150 @@
 <template>
-    <div class="image">
-      <el-input
-        style="width: 310px"
-        v-model="input1"
-        placeholder="请输入您要查询的字词"
-      >
-        <template #append>
-          <el-button type="primary" :loading="is_status === 'load'" @click="search">查询</el-button>
-        </template>
-      </el-input>
-  
+  <div class="dictionary">
+    <el-input
+      style="width: 310px"
+      v-model="input1"
+      placeholder="请输入您要查询的字词"
+    >
+      <template #append>
+        <el-button
+          type="primary"
+          :loading="is_status === 'load'"
+          @click="search"
+          >查询</el-button
+        >
+      </template>
+    </el-input>
+    <el-card style="margin-top: 1em" v-if="oriD.pinyin">
+      <el-tabs v-model="activeName">
+        <el-tab-pane v-if="oriD.cyjs" label="词语解释" name="词语解释">
+          <div class="tab_pane">
+            <div class="pinyin" v-text="'拼音:' + oriD.pinyin"></div>
+            <ul class="dictionary-ul">
+              <li
+                v-for="(v, i) in oriD.chinese_words_name"
+                :key="i"
+                v-text="v"
+              ></li>
+            </ul>
+            <div class="note" v-html="oriD.cyjs"></div>
+          </div>
+        </el-tab-pane>
+        <el-tab-pane v-if="oriD.gycd" label="国语辞典" name="国语辞典">
+          <div class="note" v-html="oriD.gycd"></div>
+        </el-tab-pane>
+        <el-tab-pane v-if="oriD.wljs" label="网络解释" name="网络解释">
+          <div class="bknr" v-html="oriD.wljs"></div>
+        </el-tab-pane>
+        <el-tab-pane v-if="oriD.bushou" label="基本解释" name="基本解释">
+          <ul class="dictionary-ul">
+            <li v-text="oriD.chinese_words_name"></li>
+          </ul>
+          <div style="display: inline-block; ,argin-left: 15px">
+            <div class="pinyin" v-text="'拼音:' + oriD.pinyin"></div>
+            <div class="pinyin" v-text="'部首:' + oriD.bushou"></div>
+          </div>
+          <div class="note" v-html="oriD.jbjs"></div>
+        </el-tab-pane>
+        <el-tab-pane v-if="oriD.xxjs" label="详细解释" name="详细解释">
+          <div class="note" v-html="oriD.xxjs"></div>
+        </el-tab-pane>
+      </el-tabs>
+    </el-card>
+    <div
+      v-if="oriD.find === 2"
+      style="width: 100%; height: 50px; line-height: 50px; text-align: center"
+    >
+      抱歉，没有找到该词语
     </div>
-  </template>
-  
-  <script setup>
-  // 词典
-  import { ref } from 'vue';
-  const is_status = ref('none');
-  
-  const search = () => {
-      is_status.value = 'load'
-      let t = setTimeout(() => {
-          clearTimeout(t)
-      is_status.value = 'none'
-      }, 1000);
-  }
-  </script>
-  
-  <style scoped>
-  .none_title {
-    font-size: 24px;
-    text-align: left;
-    font-weight: 700;
-    margin-bottom: 16px;
-    margin-left: 11.3%;
-  }
-  ul {
-    margin-left: 20px;
-  }
-  ul > li {
-    font-size: 14px;
-    color: #2c3e50;
-    margin-bottom: 16px;
-  }
-  </style>
-  
+  </div>
+</template>
+
+<script setup>
+// 词典
+import { getVocabularyInfo } from '@/api/aleditor.js';
+import { ref } from 'vue';
+const is_status = ref('none');
+const input1 = ref('');
+const activeName = ref('词语解释');
+const oriD = ref({
+  find: 0,
+});
+
+const search = () => {
+  if (!input1.value) return;
+  is_status.value = 'load';
+  oriD.value.find = 1;
+  getVocabularyInfo({
+    data: {
+      isSampleDocument: false,
+      name: input1.value,
+    },
+  })
+    .then(r => {
+      console.log(r);
+      is_status.value = 'none';
+      oriD.value.bushou && (activeName.value = '基本解释');
+      !oriD.value.pinyin ? (oriD.value.find = 2) : (oriD.value.find = 0);
+    })
+    .catch(() => {
+      oriD.value.find = 2;
+      is_status.value = 'none';
+    });
+};
+</script>
+
+<style scoped>
+.dictionary {
+  padding: 2px 10px 10px;
+}
+.pinyin {
+  margin: 5px 5px 5px 0;
+  display: block;
+  font-size: 20px;
+  color: #000;
+}
+.tab_pane {
+  font-family: BlinkMacSystemFont, -apple-system, PingFang SC, Hiragino Sans GB,
+    Source Han Sans SC, Noto Sans CJK SC, Microsoft YaHei, WenQuanYi Micro Hei,
+    SimHei, sans-serif;
+}
+.note {
+  font-family: 微软雅黑, Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  width: 100%;
+  color: #888;
+  font-size: 14px;
+}
+
+.dictionary-ul {
+  display: inline-block;
+  margin-left: 0 !important;
+}
+
+.dictionary-ul li {
+  color: #000 !important;
+  margin-left: 0 !important;
+  font-family: '\6977\4F53', '\6977\4F53_gb2312' !important;
+  display: inline-block !important;
+  width: 80px;
+  height: 80px;
+  font-size: 58px;
+  text-align: center !important;
+  line-height: 80px;
+  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAiIGhlaWdodD0iODAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTS0yIDQwaDgyTTQwLTJ2ODIiIHN0cm9rZS1kYXNoYXJyYXk9IjQsNCIgc3Ryb2tlPSIjNjY2IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTEgMWg3OHY3OEgxeiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2U9IiMxMTEiIGZpbGw9Im5vbmUiLz48L3N2Zz4=) !important;
+  margin: 0 5px 5px 0 !important;
+  background-size: contain;
+}
+
+.bknr {
+  width: 100%;
+  color: #888;
+  font-size: 14px;
+  font-family: \\5fae软雅黑, Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+}
+.bknr h3 {
+  font-weight: 600;
+  font-size: 20px;
+}
+</style>

src/view/allMedia/AIeditor/components/full_text.vue

@@ -0,0 +1,462 @@
+<template>
+  <div class="model-item-container">
+    <div top="" class="model-item-part">
+      <div class="progress_bar">
+        <div class="bar_item">
+          <div class="item_child">
+            <div
+              class="cricle c_play"
+              style="background-color: rgb(228, 242, 255)"
+            ></div>
+            <div class="item-child-label active" style="width: 50px">标题</div>
+          </div>
+          <div class="c_right c_right_grey"></div>
+        </div>
+        <div class="bar_item">
+          <div class="item_child">
+            <div class="cricle" style="background-color: rgb(238, 238, 238)">
+              2
+            </div>
+            <div class="item-child-label" style="width: 50px">摘要</div>
+          </div>
+          <div class="c_right c_right_grey"></div>
+        </div>
+        <div class="bar_item">
+          <div class="item_child">
+            <div class="cricle" style="background-color: rgb(238, 238, 238)">
+              3
+            </div>
+            <div class="item-child-label" style="width: 50px">大纲</div>
+          </div>
+          <div class="c_right c_right_grey"></div>
+        </div>
+        <div class="bar_item">
+          <div class="item_child">
+            <div class="cricle" style="background-color: rgb(238, 238, 238)">
+              4
+            </div>
+            <div class="item-child-label" style="width: 50px">内容</div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div center="" class="model-item-part">
+      <div>
+        <div class="gen-model-form">
+          <div class="gm-form-row">
+            <div class="gfr-part gfr-label">标题</div>
+            <div class="gfr-part gfr-content">
+              <div class="el-input el-input--large">
+                <input
+                  type="text"
+                  autocomplete="off"
+                  placeholder="请输入文章标题"
+                  maxlength="100"
+                  class="el-input__inner"
+                />
+              </div>
+            </div>
+          </div>
+          <div class="gm-form-row">
+            <div class="gfr-part gfr-label">文章长度</div>
+            <div class="gfr-part gfr-content">
+              <div class="left_selects model-text-length-select">
+                <div class="ls-item-wrapper">
+                  <div
+                    plain=""
+                    class="el-tooltip left_btn_mini ls-item"
+                    aria-describedby="el-tooltip-5577"
+                    tabindex="0"
+                  >
+                    短
+                  </div>
+                </div>
+                <div class="ls-item-wrapper">
+                  <div
+                    plain=""
+                    class="el-tooltip left_btn_mini ls-item active"
+                    aria-describedby="el-tooltip-5159"
+                    tabindex="0"
+                  >
+                    中
+                  </div>
+                </div>
+                <div class="ls-item-wrapper">
+                  <div
+                    plain=""
+                    class="el-tooltip left_btn_mini ls-item"
+                    aria-describedby="el-tooltip-0"
+                    tabindex="0"
+                  >
+                    长
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="gm-form-row form-template-row-entity">
+            <div class="gfr-part gfr-label">
+              自动配图
+              <i
+                class="el-tooltip el-icon-warning-outline item"
+                aria-describedby="el-tooltip-5581"
+                tabindex="0"
+                style="
+                  transform: rotateZ(180deg);
+                  margin-left: 10px;
+                  display: inline-block;
+                "
+              ></i>
+            </div>
+            <div class="gfr-part gfr-content">
+              <div role="switch" class="el-switch formal-auto-image-switch">
+                <input
+                  type="checkbox"
+                  name=""
+                  true-value="true"
+                  class="el-switch__input"
+                /><span
+                  class="el-switch__core"
+                  style="
+                    width: 40px;
+                    border-color: rgb(229, 242, 255);
+                    background-color: rgb(229, 242, 255);
+                  "
+                ></span>
+              </div>
+            </div>
+          </div>
+          <div class="gm-form-row">
+            <div class="gfr-part gfr-label">
+              摘要条数
+              <div class="row-label-with-tooltip">
+                <i
+                  class="el-tooltip el-icon-warning-outline item"
+                  aria-describedby="el-tooltip-3863"
+                  tabindex="0"
+                  style="
+                    transform: rotateZ(180deg);
+                    margin-left: 10px;
+                    display: inline-block;
+                  "
+                ></i>
+              </div>
+            </div>
+            <div class="gfr-part gfr-content">
+              <div class="number-type-input">
+                <button decrease="" class="nti-btn">
+                  <svg
+                    width="20"
+                    height="20"
+                    viewBox="0 0 20 20"
+                    fill="none"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M15.6478 10.6953H4.35205C4.00687 10.6953 3.72705 10.4155 3.72705 10.0703C3.72705 9.72514 4.00687 9.44531 4.35205 9.44531H15.6478C15.9929 9.44531 16.2728 9.72514 16.2728 10.0703C16.2728 10.4155 15.9929 10.6953 15.6478 10.6953Z"
+                      fill="currentColor"
+                    ></path>
+                  </svg>
+                </button>
+                <input class="nti-input-entity" />
+                <button increase="" class="nti-btn">
+                  <svg
+                    width="20"
+                    height="20"
+                    viewBox="0 0 20 20"
+                    fill="none"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M15.6478 9.44475H10.6249V4.42188C10.6249 4.0767 10.3451 3.79688 9.9999 3.79688C9.65473 3.79688 9.3749 4.0767 9.3749 4.42188V9.44475H4.35205C4.00687 9.44475 3.72705 9.72457 3.72705 10.0697C3.72705 10.4149 4.00687 10.6947 4.35205 10.6947H9.3749V15.7176C9.3749 16.0628 9.65473 16.3426 9.9999 16.3426C10.3451 16.3426 10.6249 16.0628 10.6249 15.7176V10.6947H15.6478C15.9929 10.6947 16.2728 10.4149 16.2728 10.0697C16.2728 9.72457 15.9929 9.44475 15.6478 9.44475Z"
+                      fill="currentColor"
+                    ></path>
+                  </svg>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div bottom="" class="model-item-part">
+      <div class="gmb-buttons">
+        <div
+          element-loading-background="transparent"
+          class="step-btn btn_size plain btn_margin"
+          style="float: left; display: none"
+        >
+          <i class="el-icon-caret-right"></i>
+          <span>跳过</span>
+        </div>
+        <div
+          element-loading-background="transparent"
+          class="step-btn btn_size plain btn_margin"
+          style="display: none"
+        >
+          <i class="el-icon-refresh"></i>
+          <span>换一批</span>
+        </div>
+        <div
+          element-loading-background="transparent"
+          class="step-btn btn_size plain btn_margin"
+          style="display: none"
+        >
+          <i class="el-icon-refresh"></i>
+          <span>换一批</span>
+        </div>
+        <div class="outline_count" style="display: none">
+          <div
+            class="btn_margin el-input-number el-input-number--small is-controls-right"
+          >
+            <span role="button" class="el-input-number__decrease"
+              ><i class="el-icon-arrow-down"></i></span
+            ><span role="button" class="el-input-number__increase"
+              ><i class="el-icon-arrow-up"></i
+            ></span>
+            <div class="el-input el-input--small">
+              <input
+                type="text"
+                autocomplete="off"
+                max="15"
+                min="1"
+                class="el-input__inner"
+                role="spinbutton"
+                aria-valuemax="15"
+                aria-valuemin="1"
+                aria-valuenow="5"
+                aria-disabled="false"
+              />
+            </div>
+          </div>
+          <span>条大纲</span>
+        </div>
+        <div class="step-btn btn_size btn_margin" style="visibility: hidden">
+          <div>上一步</div>
+        </div>
+        <div class="step-btn btn_size btn_margin btn_primary">
+          <div>下一步</div>
+        </div>
+      </div>
+      <div class="bottom-content-safe-tip">
+        <img
+          src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAQcSURBVHgB7VndTSMxEJ6EgHhMCXsVHJH4FQ+YDqACkgoIFUAq4KgArgLuKrjlAfErJdeBr4N95J/7Jji5yWrttTc/J6T9pFXWjtf2N54Zj8dEJUqUKPGZUKEJ4u7uTr2+vi5Vq9WvKCo8dfMwEjz6/f2dnwu0iVdXV3s0IYxNpNvt1l9eXvYxuSaKEYVB4+mAfLyxsaFpDIxFBCtwCAJt+if1otBvb28n6+vr36ggChG5urqK5ubmzvG6lNNU04dK8RNR/opprM52kdUJJnJ/f78H6bHkslYhZv3H/6wqcdb3EIKqVCpsR/uUTSxBH621tbUfFIAgIobEWcZfMSTZsU3eBiaFlT2lDEIg2lxeXv5OnvAmAhI7IHGeqk5Q1xlHtxnX19dtTPyQUqscQsaLiLGJbmqgwvrsGOMXja5OgjEaPmNUyQNmgKmRYHBf3Cd9OIgB6sap5CJ3RW5vb9kopep4S4n3mMfHxyZUJMHmd0YeyFp9GH8Hxn/k+q6a1yl+2rKObcJ3JZ6fn49B4hivpzc3N16S5b55DFkHL7fPQnF95yQCySga1VkdaNhKTCZvzxnCjBGLqvrT01Pb9U2ejRzKAlSqRQHg3XrwDvXwdqVmrPSq7LnaW20EtsES7IoqDT3/QoHgvQKEks3NzeAAEXNgJ6MGZeNg4qy2NVsnGFxBv2X5hAogdJOU4CgBK6EGZaOecVZbKxHYxxY6kp0GS5SdBRs7JlBntQx11xzqYB5D9TbHg0zUHP1EslBEsrVa7RwC6Bu5CUW2Q75fXFzswfPJKmVrazV2TCASRU0FgD6ky4woEI1Go38YE1VWF+zyWiM7Of0nQC0TUSxEhHw6mDawqolPOxcRL0nMAJF4t5LyJRLlhQhTRCTeta2Ry9gvZPnh4cE7xJgUOCsjy3DHf2xtXURG9g34cEUzBqeWUlWxra03EXiPLZoxzLl+CE4bWdva/jAboBZViuMmmhGMWkWiSrviNaf7TUesMlyYNjD2aaqq42rvJLKwsMDnAum9FCcKyH8yUoKx52eDU2kkqrRLrRhOIhwiYDIjUS9nO8zJMRc4nu5ysAhvczA/P3/g843p+0jWceSdF3B6ZVEgIT6XSA8y8eQDw5JJ8ToHeYUomPQupTZIHtB3ZXzgSAd5RcxeREyqJq0a/WxHiM3YwDZhMieRrOfUqe+qB6VMIbWmOVekobHPtFZWVmIKALtYTJY9ocr4u+WbQmIEJ7GR1tnBpJlMVuzVvx4A2V4WKXOXwrbGp09F2QRYhQ9CSDDGuVZI63MWtHkGN1d57XtsjzO5VpAwyWfb9UAI+m4+L5vowthXb8ZzKbPrRxSGHgj85I3XHGsLY6KXoZeXl0ucneQAE09EH8TkZSg/MezoN+/646SKSpQoUeJz4y9/qgrrtx523QAAAABJRU5ErkJggg=="
+          class="content-safe-tip-icon"
+        />
+        <div class="content-safe-tip-text">
+          声明：内容为概率模型生成，可能会产生不正确的信息，不代表写作猫的观点和立场
+        </div>
+      </div>
+    </div>
+    <div
+      element-loading-spinner="a"
+      element-loading-background="transparent"
+      class="full_loading"
+      style="display: none"
+    ></div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style scoped>
+.model-item-container {
+  text-align: center;
+  -webkit-box-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  min-height: 0;
+  width: 95%;
+}
+
+.model-item-part {
+  -webkit-box-flex: 0;
+  -ms-flex: none;
+  flex: none;
+  font-size: 14px;
+}
+
+.bar_item,
+.progress_bar {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+.progress_bar {
+  width: 100%;
+  height: 80px;
+  line-height: 80px;
+  font-size: 14px;
+}
+
+.bar_item {
+  width: 90px;
+}
+
+.item_child {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c_right_grey {
+  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNyIgaGVpZ2h0PSIxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNLjE1NiAxLjAxYS41NDcuNTQ3IDAgMDAwIC43NjVMNS43MzYgNy41bC01LjU4IDUuNzI0YS41NDguNTQ4IDAgMDAuMTcuODgyLjUyLjUyIDAgMDAuNTc3LS4xMTdMNi44MzcgNy45YS41NzMuNTczIDAgMDAwLS43OTlMLjkwMyAxLjAxYS41MjEuNTIxIDAgMDAtLjc0NyAweiIgZmlsbD0iI0UxRTFFMSIvPjwvc3ZnPg==);
+}
+.c_right {
+  background-repeat: no-repeat;
+  background-position: 50%;
+  background-size: 29%;
+  width: 25px;
+  height: 100%;
+}
+
+.c_play {
+  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNyIgaGVpZ2h0PSI4IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik02LjY0NiA0LjU0N0wxLjA4IDcuNzc3Qy42MDYgOC4wNTMgMCA3LjcyIDAgNy4xNjlWLjcwOGMwLS41NTIuNjA1LS44ODQgMS4wNzktLjYxbDUuNTY3IDMuMjNhLjcwMi43MDIgMCAwMTAgMS4yMnoiIGZpbGw9IiMzQjgyRjYiLz48L3N2Zz4=);
+  background-size: 40%;
+}
+
+.cricle {
+  width: 25px;
+  height: 25px;
+  border-radius: 50%;
+  line-height: 25px;
+  text-align: center;
+  color: #8e8e8e;
+  font-size: 16px;
+  background-repeat: no-repeat;
+  background-position: 50%;
+  background-size: 50%;
+  margin-right: 5px;
+}
+
+.item-child-label.active {
+  color: #4b4b4b;
+}
+
+.item-child-label {
+  color: #8e8e8e;
+}
+
+.gm-form-row {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  height: 51px;
+}
+
+.gfr-content,
+.gfr-label {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  align-items: center;
+}
+
+.gfr-label {
+  font-size: 14px;
+  color: #4b4b4b;
+  font-weight: 400;
+  line-height: 24px;
+  letter-spacing: 0;
+  text-align: left;
+  -ms-flex-align: center;
+  -webkit-box-flex: 0;
+  -ms-flex: 0 0 150px;
+  flex: 0 0 150px;
+}
+
+.gfr-content {
+  -webkit-box-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  justify-content: flex-end;
+  -ms-flex-align: center;
+}
+
+.gen-model-form .left_selects {
+  margin-left: auto;
+}
+
+.model-text-length-select {
+  width: auto;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  justify-content: flex-end;
+}
+.left_selects {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  height: 100%;
+  width: 120px;
+  -webkit-box-pack: justify;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+
+.model-text-length-select .ls-item.active {
+    color: #3b82f6;
+    border: 1px solid #3b82f6;
+    -webkit-box-shadow: inset 0 5px 10px hsla(0,0%,100%,.2);
+    box-shadow: inset 0 5px 10px hsla(0,0%,100%,.2);
+}
+.model-text-length-select .ls-item {
+    width: 30px;
+    height: 30px;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    border-radius: 3px;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    justify-content: center;
+}
+.left_btn_mini.active {
+    background-color: #e4f2ff;
+    border: 1px solid #3b82f6;
+    color: #3b82f6;
+}
+.left_btn_mini {
+    width: 30px;
+    height: 25px;
+    background-color: #f5f5f5;
+    color: #909399;
+    font-size: 12px;
+    border-radius: 3px;
+    line-height: 25px;
+    text-align: center;
+    border: 1px solid transparent;
+    cursor: pointer;
+}
+</style>

src/view/allMedia/AIeditor/components/image.vue

@@ -1,12 +1,13 @@
 <template>
   <div class="image">
-    <el-input
-      style="width: 310px"
-      v-model="input1"
-      placeholder="请输入图片描述"
-    >
+    <el-input style="width: 310px" v-model="input" placeholder="请输入图片描述">
       <template #append>
-        <el-button type="primary" :loading="is_status === 'load'" @click="search">查找</el-button>
+        <el-button
+          type="primary"
+          :loading="is_status === 'load'"
+          @click="search"
+          >查找</el-button
+        >
       </template>
     </el-input>
 
@@ -15,24 +16,46 @@
       <div class="none_title">输入描述，自动配图</div>
       <ul>
         <li>根据您对图片的描述，智能匹配相关图片</li>
-        <li>图片均来自Pixabay等图库，可免费商用   </li>
+        <li>图片均来自Pixabay等图库，可免费商用</li>
       </ul>
     </div>
+    <div class="masonry" v-if="is_status === 'data' && oriD.length">
+      <div class="item" v-for="(item, index) in oriD" :key="index">
+        <img :src="item.url" style="width: 100%;" />
+        <el-icon class="saveImg" @click="()=>saveImg(item)"><Warning /></el-icon>
+      </div>
+    </div>
   </div>
 </template>
 
 <script setup>
 // 图片
 import image from '@/assets/img/image.png';
+import { textImageMatch } from '@/api/aleditor.js';
 import { ref } from 'vue';
 const is_status = ref('none');
-
+const input = ref('');
+const oriD = ref({});
 const search = () => {
-    is_status.value = 'load'
-    let t = setTimeout(() => {
-        clearTimeout(t)
-    is_status.value = 'none'
-    }, 1000);
+  is_status.value = 'load';
+  textImageMatch({
+    data: {
+      text: input.value,
+      type: '',
+    },
+  })
+    .then(r => {
+      const li = r ? r.data || [] : [];
+      oriD.value= li;
+      is_status.value = oriD.value.length ? 'data' : 'none';
+    })
+    .catch(() => {
+      is_status.value = 'none';
+    });
+};
+
+const saveImg = item => {
+    console.log(item.url)
 }
 </script>
 
@@ -52,4 +75,57 @@ ul > li {
   color: #2c3e50;
   margin-bottom: 16px;
 }
+
+.masonry {
+  /* width: 95%;
+  margin: 0 auto;
+   padding-top: 1em;
+   column-count: 2;
+  column-gap: 0; 
+  display: flex;
+  flex-wrap: wrap; */
+  column-count: 3;
+  column-gap: 3px;
+}
+
+
+.item{
+    padding: 2px;
+    position: relative;
+    counter-increment: item-counter;
+}
+
+.item img{
+    display: block;
+    width: 100%;
+    height: auto;
+}
+
+/* .item::after{
+    position: absolute;
+    display: block;
+    top: 2px;
+    left: 2px;
+    width: 24px;
+    height: 24px;
+    text-align: center;
+    line-height: 24px;
+    background-color: #000;
+    color: #fff;
+    content: counter(item-counter);
+} */
+
+.saveImg{
+    position: absolute;
+    background-color: #fff;
+    border-radius: 50%;
+    right: 2px;
+    top: 2px;
+    display: none;
+    cursor: pointer;
+}
+
+.item:hover .saveImg{
+    display: block;
+}
 </style>

src/view/allMedia/AIeditor/components/pen_ink.vue

@@ -6,8 +6,8 @@
       placeholder="搜索模板"
     />
     <div class="grid_bg">
-      <template v-for="item in pen_ink_list" :key="item.key">
-        <div class="list" v-if="is_show(item.name)">
+      <template v-for="(item,i) in pen_ink_list" :key="item.key">
+        <div class="list" v-if="is_show(item.name)" @click="() => changeAi(item,i)">
           <div class="icon">
             <el-image
               style="width: 24px; height: 24px"
@@ -26,15 +26,22 @@
 <script setup>
 // AI写作
 import { Search } from '@element-plus/icons-vue';
-import { ref } from 'vue';
+import { ref, defineEmits } from 'vue';
 
 import { pen_ink_list } from './data';
 const search_input = ref('');
+const emits = defineEmits(['closeType','saveData'])
+
 
 const is_show = i_name => {
   const rex = new RegExp(search_input.value);
   return rex.test(i_name);
 };
+
+const changeAi = (item, i) => {
+    emits("closeType");
+    emits("saveData",{...item, index: i, com_type: 'pen_ink'});
+}
 </script>
 
 <style scoped>
@@ -46,7 +53,6 @@ const is_show = i_name => {
 .grid_bg {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
-  gap: 10px 10px;
   padding-bottom: 20px;
   font-size: 14px;
   padding: 5px;

src/view/allMedia/AIeditor/components/review.vue

@@ -14,15 +14,37 @@
         <div class="dot-flashing"></div>
       </div>
     </template>
+    <template v-if="is_status === 'show'">
+        123
+    </template>
   </div>
 </template>
 
 <script setup>
 // 校阅
-import { ref } from 'vue';
+import { ref, inject } from 'vue';
+import { checkContent } from '@/api/aleditor.js';
 import jy from '@/assets/img/jy.png';
-
 const is_status = ref('none');
+
+const jiaoyue = () => {
+    is_status.value = 'load'
+  checkContent({
+    data: {
+      content: inject('getHtml')(),
+      contentText: inject('getText')(),
+      // cursorPosition: 42,
+      // docId: '8344800447857377280',
+      // generationInfo: null,
+      // shouldGenerate: false,
+    },
+  }).then(r => {
+    console.log(r);
+  }).catch(()=>{
+    is_status.value = 'none'
+  });
+};
+jiaoyue();
 </script>
 
 <style scoped>
@@ -113,22 +135,24 @@ ul > li {
   animation-delay: 0.6s;
 }
 @-webkit-keyframes dot-flashing-0833031b {
-    0% {
-        background-color: #2d2d2d
-    }
+  0% {
+    background-color: #2d2d2d;
+  }
 
-    50%,to {
-        background-color: hsla(0,0%,100%,.1)
-    }
+  50%,
+  to {
+    background-color: hsla(0, 0%, 100%, 0.1);
+  }
 }
 
 @keyframes dot-flashing-0833031b {
-    0% {
-        background-color: #2d2d2d
-    }
+  0% {
+    background-color: #2d2d2d;
+  }
 
-    50%,to {
-        background-color: hsla(0,0%,100%,.1)
-    }
+  50%,
+  to {
+    background-color: hsla(0, 0%, 100%, 0.1);
+  }
 }
 </style>

src/view/allMedia/AIeditor/index.vue

@@ -101,20 +101,78 @@
       </div>
 
       <div class="operate" v-if="statusPage[1]">
-        <div class="toolHead">
+        <Transition name="toolRight">
           <div
-            class="toolHeadItem"
-            v-for="(v, i) in select_right_btn_list"
-            :key="'ttt' + i"
-            :style="{ left: v.left + 'px' }"
-            @click="() => change_select_right_btn_type(i)"
-            :class="{ toolAct: v.index === 0 }"
+            v-if="noOpenSon"
+            style="transition: all 0.2s ease; position: relative"
           >
-            {{ v.text }}
-            <div class="line"></div>
+            <div class="toolHead">
+              <div
+                class="toolHeadItem"
+                v-for="(v, i) in select_right_btn_list"
+                :key="'ttt' + i"
+                :style="{ left: v.left + 'px' }"
+                @click="() => change_select_right_btn_type(i)"
+                :class="{ toolAct: v.index === 0 }"
+              >
+                {{ v.text }}
+                <div class="line"></div>
+              </div>
+            </div>
+            <component
+              @saveData="saveData"
+              @closeType="closeType"
+              :is="componment_list[select_right_btn_type]"
+            ></component>
           </div>
-        </div>
-        <component :is="componment_list[select_right_btn_type]"></component>
+        </Transition>
+        <Transition name="toolRightSon">
+          <div
+            v-if="!noOpenSon"
+            style="transition: all 0.2s ease; position: relative"
+          >
+            <div class="RightSonTitle">
+              <div class="t_header animate__faster">
+                <div class="header_left">
+                  <div class="model-panel-logo">
+                    <img
+                      :src="right_head.icon"
+                      style="width: 24px; height: 24px; vertical-align: middle"
+                    />
+                  </div>
+                  <div class="holder"></div>
+                  <div class="msg_flex">
+                    <div class="model-panel-name">
+                      <span class="mpn-name" v-text="right_head.name"></span>
+                    </div>
+                    <div class="desc" v-text="right_head.sub_text"></div>
+                  </div>
+                </div>
+                <div class="header_right">
+                  <button class="header-right-btn" @click="closeType">
+                    <svg
+                      data-v-d643dfde=""
+                      width="20"
+                      height="20"
+                      viewBox="0 0 20 20"
+                      fill="none"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        data-v-d643dfde=""
+                        d="M18.158 9.52589H3.27982L10.2875 3.29702C10.5295 3.08192 10.5513 2.71141 10.3362 2.46944C10.1212 2.22748 9.75067 2.20564 9.50868 2.42075L1.4614 9.57362C1.33624 9.68487 1.26465 9.84432 1.26465 10.0118C1.26465 10.1792 1.33624 10.3387 1.4614 10.4499L9.50866 17.6028C9.62032 17.7021 9.75935 17.7509 9.89785 17.7509C10.0595 17.7508 10.2204 17.6844 10.3362 17.5541C10.5513 17.3121 10.5295 16.9416 10.2875 16.7265L3.51322 10.7051H18.158C18.4818 10.7051 18.7442 10.4392 18.7442 10.1155C18.7442 9.79175 18.4818 9.52589 18.158 9.52589Z"
+                        fill="#8E8E8E"
+                      ></path>
+                    </svg>
+                  </button>
+                </div>
+              </div>
+            </div>
+            <component
+              :is="component_2_list[select_right_2_btn_type]"
+            ></component>
+          </div>
+        </Transition>
       </div>
     </div>
   </div>
@@ -122,16 +180,25 @@
 
 <script setup>
 import '@wangeditor/editor/dist/css/style.css'; // 引入 css
-import { onBeforeUnmount, ref, shallowRef, onMounted } from 'vue';
+import { onBeforeUnmount, ref, shallowRef, onMounted, provide } from 'vue';
 import { Editor, Toolbar } from '@wangeditor/editor-for-vue';
 
+// 右侧一级组件
 import pen_ink from './components/pen_ink.vue';
 import review from './components/review.vue';
 import image from './components/image.vue';
 import dictionary from './components/dictionary.vue';
 import comment from './components/comment.vue';
+// 右侧二级组件
+import full_text from './components/full_text.vue';
+
+// 右侧头部数据
+const right_head = ref({});
 
 const componment_list = [pen_ink, review, image, dictionary, comment];
+const component_2_list = [full_text];
+
+const noOpenSon = ref(true);
 
 // 编辑器实例，必须用 shallowRef
 const editorRef = shallowRef();
@@ -139,6 +206,7 @@ const editorRef = shallowRef();
 // 内容 HTML
 const valueHtml = ref('<p>hello</p>');
 const select_right_btn_type = ref(0);
+const select_right_2_btn_type = ref(0);
 const select_right_btn_list = ref([
   {
     text: 'AI写作',
@@ -172,6 +240,9 @@ const select_right_btn_list = ref([
   },
 ]);
 
+provide('getHtml', () => editorRef.value.getHtml());
+provide('getText', () => editorRef.value.getText());
+
 onMounted(() => {});
 
 const statusPage = ref([false, true]); // 0 --> 目录  1 --> operate
@@ -262,6 +333,16 @@ const getLast = (index, li) => {
   }
   return oldleft;
 };
+
+const closeType = () => {
+  noOpenSon.value = !noOpenSon.value;
+};
+
+const saveData = item => {
+  console.log(item);
+  select_right_2_btn_type.value = item.index;
+  right_head.value = item;
+};
 </script>
 
 <style scoped>
@@ -269,18 +350,38 @@ const getLast = (index, li) => {
 .toolCol-leave-active {
   opacity: 1;
 }
-
 .toolCol-enter-from,
 .toolCol-leave-to {
   transform: translateX(0%) !important;
   opacity: 0;
 }
 
+.toolRight-enter-active,
+.toolRight-leave-active {
+  transform: translateX(0%) !important;
+  opacity: 1;
+}
+.toolRight-enter-from,
+.toolRight-leave-to {
+  transform: translateX(100%) !important;
+  opacity: 0;
+}
+
+.toolRightSon-enter-active,
+.toolRightSon-leave-active {
+  transform: translateX(100%) !important;
+  opacity: 1;
+}
+.toolRightSon-enter-from,
+.toolRightSon-leave-to {
+  transform: translateX(0%) !important;
+  opacity: 0;
+}
+
 .toolBtn-enter-active,
 .toolBtn-leave-active {
   opacity: 1;
 }
-
 .toolBtn-enter-from,
 .toolBtn-leave-to {
   opacity: 0;
@@ -289,6 +390,7 @@ const getLast = (index, li) => {
 </style>
 
 <style scoped>
+@import url(./assets/css/righttop.css);
 .AIeditor {
   height: 100%;
 }
@@ -366,6 +468,8 @@ const getLast = (index, li) => {
 
 .operate {
   flex: 1;
+  margin-top: 1em;
+  margin-left: 15px;
   height: 100vh;
   overflow-y: auto;
 }