提交

src/api/aleditor.js

@@ -2,13 +2,13 @@ import ajax from '../utils/request.js';
 
 /**
  * 词典
- * @param {object} ori
+ * @param {object} params
  * @returns
  */
-export function getVocabularyInfo(ori) {
+export function getVocabularyInfo(params) {
   return ajax({
     api: '/html/getVocabularyInfo',
-    data: ori.data,
+    data: params.data,
     base: 'xzMao',
     noJY: true,
     method: 'GET',
@@ -16,13 +16,13 @@ export function getVocabularyInfo(ori) {
 }
 /**
  * 图片
- * @param {object} ori
+ * @param {object} params
  * @returns
  */
-export function textImageMatch(ori) {
+export function textImageMatch(params) {
   return ajax({
     api: '/html/textImageMatch?isSampleDocument=false',
-    data: ori.data,
+    data: params.data,
     base: 'xzMao',
     noJY: true,
     method: 'POST',
@@ -30,15 +30,30 @@ export function textImageMatch(ori) {
 }
 /**
  * 校阅
- * @param {object} ori
+ * @param {object} params
  * @returns
  */
-export function checkContent(ori) {
+export function checkContent(params) {
   return ajax({
     api: '/html/checkContent?isSampleDocument=false',
-    data: ori.data,
+    data: params.data,
     base: 'xzMao',
     noJY: true,
     method: 'POST',
   });
 }
+
+/**
+ * 全文写作
+ * @param {object} params 
+ * @returns 
+ */
+export function commit(params) {
+    return ajax({
+        api: '/html/checkContent?isSampleDocument=false',
+        data: params.data,
+        base: 'xzMao',
+        noJY: true,
+        method: 'POST',
+      });
+}

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

@@ -0,0 +1,105 @@
+<template>
+  <div class="model-item-container">
+    <br />
+    <el-form label-width="100px" :model="form" label-position="top">
+      <el-form-item label="请输入产品名称/品类/主题">
+        <el-input
+          v-model="form.title"
+          type="textarea"
+          :rows="2"
+          maxlength="100"
+          show-word-limit
+          placeholder="如：iPhone 13，保温杯，保护野生动物"
+        />
+      </el-form-item>
+    </el-form>
+    <el-form>
+      <el-form-item label="文章长度">
+        <div style="text-align: right; width: 100%">
+          <el-button plain :class="{ act: form.long === 'small' }">
+            短
+          </el-button>
+          <el-button plain :class="{ act: form.long === 'middle' }">
+            中
+          </el-button>
+          <el-button plain :class="{ act: form.long === 'long' }">
+            长
+          </el-button>
+        </div>
+      </el-form-item>
+    </el-form>
+
+    <div class="btn_group">
+      <el-button type="primary" style="width: 100%;">下一步</el-button>
+      <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>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+// import {commit} from "@/api/aleditor.js";
+const form = ref({
+  title: '',
+  long: 'small',
+});
+</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%;
+  height: 100%;
+}
+
+.act {
+  color: var(--el-button-hover-text-color);
+  border-color: var(--el-button-hover-border-color);
+  background-color: var(--el-button-hover-bg-color);
+  outline: 0;
+}
+
+.btn_group {
+  padding-right: 1em;
+}
+.bottom-content-safe-tip {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  padding: 15px 0;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  width: 100%;
+  zoom: 0.83;
+}
+.bottom-content-safe-tip .content-safe-tip-icon {
+  width: 15px;
+  height: 15px;
+  margin-right: 10px;
+}
+.bottom-content-safe-tip .content-safe-tip-text {
+  font-size: 12px;
+  line-height: 15px;
+  color: #cacaca;
+}
+</style>

src/view/allMedia/AIeditor/components/data.js

@@ -95,3 +95,11 @@ export const pen_ink_list = [
     sub_text: '欢迎与我们反馈您的需求',
   },
 ];
+
+// base64图片
+export const image_base64 = {
+    duigou: 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTExLjM4NC44Mkw0LjM2MiA5LjI0Ny42NDIgNS40MmwuNzE3LS42OTcgMi45NDYgMy4wM0wxMC42MTYuMThsLjc2OC42NHoiIGZpbGw9IiMzQjgyRjYiLz48L3N2Zz4=',
+    play: 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNyIgaGVpZ2h0PSI4IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik02LjY0NiA0LjU0N0wxLjA4IDcuNzc3Qy42MDYgOC4wNTMgMCA3LjcyIDAgNy4xNjlWLjcwOGMwLS41NTIuNjA1LS44ODQgMS4wNzktLjYxbDUuNTY3IDMuMjNhLjcwMi43MDIgMCAwMTAgMS4yMnoiIGZpbGw9IiMzQjgyRjYiLz48L3N2Zz4=',
+    right: 'https://uranus-static.oss-accelerate.aliyuncs.com/xiezuocat/go_right.png',
+    tanhao: '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=='
+}

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

@@ -2,262 +2,99 @@
   <div class="model-item-container">
     <div top="" class="model-item-part">
       <div class="progress_bar">
-        <div class="bar_item">
+        <div class="bar_item" v-for="(item,i) in steps" :key="item.text + i">
           <div class="item_child">
             <div
               class="cricle c_play"
-              style="background-color: rgb(228, 242, 255)"
+              :style="{backgroundColor: status.step >= i ? 'rgb(228, 242, 255)' : 'rgb(238, 238, 238)', backgroundImage: getBG(i)}"
+              v-text="status.step < i ? i + 1 : ''"
             ></div>
-            <div class="item-child-label active" style="width: 50px">标题</div>
+            <div class="item-child-label active" style="width: 50px" v-text="item.text"></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>
+    <el-form label-width="100px" :model="form" label-position="left">
+      <el-form-item label="标题">
+        <el-input v-model="form.title" />
+      </el-form-item>
+      <el-form-item label="文章长度">
+        <div style="text-align: right; width: 100%">
+          <el-button plain :class="{ act: form.long === 'small' }">
+            短
+          </el-button>
+          <el-button plain :class="{ act: form.long === 'middle' }">
+            中
+          </el-button>
+          <el-button plain :class="{ act: form.long === 'long' }">
+            长
+          </el-button>
         </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>
+      </el-form-item>
+      <el-form-item label="自动配图">
+        <div style="text-align: right; width: 100%">
+          <el-switch v-model="form.isImg" />
         </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>
+      </el-form-item>
+      <el-form-item label="摘要条数">
+        <div style="text-align: right; width: 100%">
+          <el-input-number v-model="form.num" :min="1" />
         </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>
+      </el-form-item>
+    </el-form>
+
+    <div class="btn_group">
+      <el-button type="primary" @click="status.step++">下一步</el-button>
       <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=="
+        :src="image_base64.tanhao"
           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>
+<script setup>
+import { ref } from 'vue';
+import { image_base64 } from "./data.js";
+// import {commit} from "@/api/aleditor.js";
+const steps = [
+    {
+        text: '标题',
+    },
+    {
+        text: '摘要',
+    },
+    {
+        text: '大纲',
+    },
+    {
+        text: '内容',
+    }
+]
+const form = ref({
+  title: '',
+  num: 1,
+  isImg: false,
+  long: 'small',
+});
+
+const status = ref({
+    step: 0,
+    progress: 0,
+})
+
+const getBG = i => {
+    if(status.value.step == i) return 'url(' + image_base64.play + ')';
+    if(status.value.step > i) return 'url(' + image_base64.duigou + ')';
+    return undefined
+}
+</script>
 
 <style scoped>
 .model-item-container {
@@ -274,6 +111,7 @@
   flex-direction: column;
   min-height: 0;
   width: 95%;
+  height: 100%;
 }
 
 .model-item-part {
@@ -323,11 +161,6 @@
   height: 100%;
 }
 
-.c_play {
-  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNyIgaGVpZ2h0PSI4IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik02LjY0NiA0LjU0N0wxLjA4IDcuNzc3Qy42MDYgOC4wNTMgMCA3LjcyIDAgNy4xNjlWLjcwOGMwLS41NTIuNjA1LS44ODQgMS4wNzktLjYxbDUuNTY3IDMuMjNhLjcwMi43MDIgMCAwMTAgMS4yMnoiIGZpbGw9IiMzQjgyRjYiLz48L3N2Zz4=);
-  background-size: 40%;
-}
-
 .cricle {
   width: 25px;
   height: 25px;
@@ -338,8 +171,8 @@
   font-size: 16px;
   background-repeat: no-repeat;
   background-position: 50%;
-  background-size: 50%;
   margin-right: 5px;
+  background-size: 40%;
 }
 
 .item-child-label.active {
@@ -350,113 +183,39 @@
   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;
+.act {
+  color: var(--el-button-hover-text-color);
+  border-color: var(--el-button-hover-border-color);
+  background-color: var(--el-button-hover-bg-color);
+  outline: 0;
 }
 
-.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;
+.btn_group {
+  position: absolute;
+  width: 100%;
+  text-align: right;
+  bottom: 0;
+  padding-right: 1em;
 }
-.left_selects {
+.bottom-content-safe-tip {
   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;
+  padding: 15px 0;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  width: 100%;
+  zoom: 0.83;
 }
-.left_btn_mini.active {
-    background-color: #e4f2ff;
-    border: 1px solid #3b82f6;
-    color: #3b82f6;
+.bottom-content-safe-tip .content-safe-tip-icon {
+  width: 15px;
+  height: 15px;
+  margin-right: 10px;
 }
-.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;
+.bottom-content-safe-tip .content-safe-tip-text {
+  font-size: 12px;
+  line-height: 15px;
+  color: #cacaca;
 }
 </style>

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

@@ -0,0 +1,315 @@
+<template>
+  <div class="model-item-container">
+    <div top="" class="model-item-part">
+      <div class="progress_bar">
+        <div class="bar_item" v-for="(item, i) in steps" :key="item.text + i">
+          <div class="item_child">
+            <div
+              class="cricle c_play"
+              :style="{
+                backgroundColor:
+                  status.step >= i
+                    ? 'rgb(228, 242, 255)'
+                    : 'rgb(238, 238, 238)',
+                backgroundImage: getBG(i),
+              }"
+              v-text="status.step < i ? i + 1 : ''"
+            ></div>
+            <div class="item-child-label active" style="width: 50px" v-text="item.text"></div>
+          </div>
+          <div class="c_right c_right_grey"></div>
+        </div>
+      </div>
+    </div>
+    <el-form
+      label-width="100px"
+      v-if="status.step === 0"
+      :model="form"
+      label-position="left"
+    >
+      <el-form-item label="标题">
+        <el-input v-model="form.title" />
+      </el-form-item>
+      <el-form-item label="文章长度">
+        <div style="text-align: right; width: 100%">
+          <el-button plain :class="{ act: form.long === 'small' }">
+            短
+          </el-button>
+          <el-button plain :class="{ act: form.long === 'middle' }">
+            中
+          </el-button>
+          <el-button plain :class="{ act: form.long === 'long' }">
+            长
+          </el-button>
+        </div>
+      </el-form-item>
+      <el-form-item label="自动配图">
+        <div style="text-align: right; width: 100%">
+          <el-switch v-model="form.isImg" />
+        </div>
+      </el-form-item>
+      <el-form-item label="摘要条数">
+        <div style="text-align: right; width: 100%">
+          <el-input-number v-model="form.num" :min="1" />
+        </div>
+      </el-form-item>
+    </el-form>
+
+    <el-form
+      label-width="100px"
+      v-if="status.step === 1"
+      :model="form"
+      label-position="top"
+    >
+      <el-form-item label="您可以选择/编辑摘要：">
+        <el-input v-model="form.title1" type="textarea" :rows="6" />
+      </el-form-item>
+    </el-form>
+    <el-form
+      label-width="100px"
+      v-if="status.step === 2"
+      :model="form"
+      label-position="top"
+    >
+      <el-form-item
+        label="您可以选择编辑/增删/重组大纲："
+        style="display: block"
+      >
+        <div class="dagang">
+          <el-icon :size="20" class="add"><CirclePlus /></el-icon>
+          <el-icon :size="20" class="close"><CircleClose /></el-icon>
+          <el-input v-model="form.title2" style="width: 100%" class="no_border" />
+        </div>
+        <div class="dagang">
+          <el-icon :size="20" class="add"><CirclePlus /></el-icon>
+          <el-icon :size="20" class="close"><CircleClose /></el-icon>
+          <el-input v-model="form.title2" style="width: 100%" class="no_border" />
+        </div>
+      </el-form-item>
+    </el-form>
+
+    <div class="btn_group">
+      <el-button
+        type="primary"
+        v-if="status.step > 0"
+        plain
+        @click="status.step--"
+        >上一步</el-button
+      >
+      <el-button type="primary" @click="status.step++">下一步</el-button>
+      <div class="bottom-content-safe-tip">
+        <img :src="image_base64.tanhao" class="content-safe-tip-icon" />
+        <div class="content-safe-tip-text">
+          声明：内容为概率模型生成，可能会产生不正确的信息，不代表我司的观点和立场
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import { image_base64 } from './data.js';
+// import {commit} from "@/api/aleditor.js";
+const steps = [
+  {
+    text: '标题',
+  },
+  {
+    text: '摘要',
+  },
+  {
+    text: '大纲',
+  },
+  {
+    text: '内容',
+  },
+];
+const form = ref({
+  title1:
+    '《旅游科学》（双月刊）自创刊以来，以服务于各级旅游管理部门、旅游企事业单位、旅游研究者、旅游者为宗旨，坚持以学术为本，为繁荣我国的旅游业，为我国的旅游业走向世界而服务。本刊将以更好的办刊质量和更高的学术水平来回报广大读者，进一步推动我国旅游业的发展。本刊将继续举办"专家笔会"、"学者讲座"和"专题研讨会"等活动，并在此基础上推出系列学术专栏，以推动学术研究和学科建设。',
+  title: '',
+  title2: '一、问题的提出',
+  num: 1,
+  isImg: false,
+  long: 'small',
+});
+
+const status = ref({
+  step: 0,
+  progress: 0,
+});
+
+const getBG = i => {
+  if (status.value.step == i) return 'url(' + image_base64.play + ')';
+  if (status.value.step > i) return 'url(' + image_base64.duigou + ')';
+  return undefined;
+};
+</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%;
+  height: 100%;
+}
+
+.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%;
+}
+
+.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%;
+  margin-right: 5px;
+  background-size: 40%;
+}
+
+.item-child-label.active {
+  color: #4b4b4b;
+}
+
+.item-child-label {
+  color: #8e8e8e;
+}
+
+.act {
+  color: var(--el-button-hover-text-color);
+  border-color: var(--el-button-hover-border-color);
+  background-color: var(--el-button-hover-bg-color);
+  outline: 0;
+}
+
+.btn_group {
+  position: absolute;
+  width: 100%;
+  text-align: right;
+  bottom: 0;
+  padding-right: 1em;
+}
+.bottom-content-safe-tip {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  padding: 15px 0;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  width: 100%;
+  zoom: 0.83;
+}
+.bottom-content-safe-tip .content-safe-tip-icon {
+  width: 15px;
+  height: 15px;
+  margin-right: 10px;
+}
+.bottom-content-safe-tip .content-safe-tip-text {
+  font-size: 12px;
+  line-height: 15px;
+  color: #cacaca;
+}
+
+.dagang {
+  padding: 0 0 0 30px;
+  position: relative;
+  margin-bottom: 1em;
+}
+
+.dagang .add {
+  position: absolute;
+  left: 2px;
+  top: 5px;
+  display: none;
+}
+.dagang .close {
+  position: absolute;
+  right: 3px;
+  z-index: 1;
+  top: 5px;
+  display: none;
+}
+.no_border .el-input__wrapper{
+  box-shadow: none;
+}
+
+.dagang:hover .add,
+.dagang:hover .close {
+  display: block;
+  cursor: pointer;
+}
+
+.dagang:hover .no_border .el-input__wrapper{
+    box-shadow: 0 0 0 1px var(--el-input-border-color, var(--el-border-color))
+    inset;
+}
+
+
+
+</style>
+
+<style>
+.model-item-container .el-form-item__content {
+  display: block;
+}
+</style>

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

@@ -0,0 +1,64 @@
+<template>
+  <div class="model-item-container">
+    <br />
+    <el-form label-width="100px" :model="form" label-position="top">
+      <el-form-item label="请概述您想要搜寻的文献内容">
+        <el-input
+          v-model="form.title"
+          type="textarea"
+          :rows="5"
+          maxlength="500"
+          show-word-limit
+          placeholder="您可以输入任何线索，如：
+·  互联网环境下中小学教育信息化的发展与展望
+·  本文从教育信息化的概念出发，分析了互联网环境下中小学教育信息化的发展现状。
+·  中小学教育、信息化、互联网、发展、展望"
+        />
+      </el-form-item>
+    </el-form>
+
+    <div class="btn_group">
+      <el-button type="primary" style="width: 100%" :disabled="form.title"
+        >检索</el-button
+      >
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+// import {commit} from "@/api/aleditor.js";
+const form = ref({
+  title: '',
+});
+</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%;
+  height: 100%;
+}
+
+.act {
+  color: var(--el-button-hover-text-color);
+  border-color: var(--el-button-hover-border-color);
+  background-color: var(--el-button-hover-bg-color);
+  outline: 0;
+}
+
+.btn_group {
+  padding-right: 1em;
+}
+</style>

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

@@ -0,0 +1,221 @@
+<template>
+  <div class="model-item-container">
+    <div top="" class="model-item-part">
+      <div class="progress_bar">
+        <div class="bar_item" v-for="(item,i) in steps" :key="item.text + i">
+          <div class="item_child">
+            <div
+              class="cricle c_play"
+              :style="{backgroundColor: status.step >= i ? 'rgb(228, 242, 255)' : 'rgb(238, 238, 238)', backgroundImage: getBG(i)}"
+              v-text="status.step < i ? i + 1 : ''"
+            ></div>
+            <div class="item-child-label active" style="width: 50px" v-text="item.text"></div>
+          </div>
+          <div class="c_right c_right_grey"></div>
+        </div>
+      </div>
+    </div>
+    <el-form label-width="100px" :model="form" label-position="left">
+      <el-form-item label="标题">
+        <el-input v-model="form.title" />
+      </el-form-item>
+      <el-form-item label="文章长度">
+        <div style="text-align: right; width: 100%">
+          <el-button plain :class="{ act: form.long === 'small' }">
+            短
+          </el-button>
+          <el-button plain :class="{ act: form.long === 'middle' }">
+            中
+          </el-button>
+          <el-button plain :class="{ act: form.long === 'long' }">
+            长
+          </el-button>
+        </div>
+      </el-form-item>
+      <el-form-item label="自动配图">
+        <div style="text-align: right; width: 100%">
+          <el-switch v-model="form.isImg" />
+        </div>
+      </el-form-item>
+      <el-form-item label="摘要条数">
+        <div style="text-align: right; width: 100%">
+          <el-input-number v-model="form.num" :min="1" />
+        </div>
+      </el-form-item>
+    </el-form>
+
+    <div class="btn_group">
+      <el-button type="primary" @click="status.step++">下一步</el-button>
+      <div class="bottom-content-safe-tip">
+        <img
+        :src="image_base64.tanhao"
+          class="content-safe-tip-icon"
+        />
+        <div class="content-safe-tip-text">
+          声明：内容为概率模型生成，可能会产生不正确的信息，不代表我司的观点和立场
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import { image_base64 } from "./data.js";
+// import {commit} from "@/api/aleditor.js";
+const steps = [
+    {
+        text: '标题',
+    },
+    {
+        text: '摘要',
+    },
+    {
+        text: '大纲',
+    },
+    {
+        text: '内容',
+    }
+]
+const form = ref({
+  title: '',
+  num: 1,
+  isImg: false,
+  long: 'small',
+});
+
+const status = ref({
+    step: 0,
+    progress: 0,
+})
+
+const getBG = i => {
+    if(status.value.step == i) return 'url(' + image_base64.play + ')';
+    if(status.value.step > i) return 'url(' + image_base64.duigou + ')';
+    return undefined
+}
+</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%;
+  height: 100%;
+}
+
+.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%;
+}
+
+.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%;
+  margin-right: 5px;
+  background-size: 40%;
+}
+
+.item-child-label.active {
+  color: #4b4b4b;
+}
+
+.item-child-label {
+  color: #8e8e8e;
+}
+
+.act {
+  color: var(--el-button-hover-text-color);
+  border-color: var(--el-button-hover-border-color);
+  background-color: var(--el-button-hover-bg-color);
+  outline: 0;
+}
+
+.btn_group {
+  position: absolute;
+  width: 100%;
+  text-align: right;
+  bottom: 0;
+  padding-right: 1em;
+}
+.bottom-content-safe-tip {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  padding: 15px 0;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  width: 100%;
+  zoom: 0.83;
+}
+.bottom-content-safe-tip .content-safe-tip-icon {
+  width: 15px;
+  height: 15px;
+  margin-right: 10px;
+}
+.bottom-content-safe-tip .content-safe-tip-text {
+  font-size: 12px;
+  line-height: 15px;
+  color: #cacaca;
+}
+</style>

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

@@ -1,5 +1,5 @@
 <template>
-  <div class="review">
+  <div class="review" v-if="is_status !== 'show'">
     <el-image style="width: 310px; height: 232.5px" :src="jy" fit="fill" />
     <template v-if="is_status === 'none'">
       <div class="none_title">检查完毕，一切都好</div>
@@ -14,21 +14,43 @@
         <div class="dot-flashing"></div>
       </div>
     </template>
-    <template v-if="is_status === 'show'">
-        123
-    </template>
   </div>
+  <template v-if="is_status === 'show'">
+    <div class="show">
+      <div class="left">
+        <el-card>
+          <p
+            class="list"
+            style="font-size: 12px; font-weight: 400; color: #888"
+          >
+            字词错误
+          </p>
+          <p class="list">
+            饭
+            <span
+              class="alert-go-right"
+              :style="{ backgroundImage: 'url(' + image_base64.right + ')' }"
+            ></span>
+            <span class="replaceText"> 要 </span>
+          </p>
+          <p class="list">建议用“<b>要</b>”替换“<b>饭</b>”。</p>
+        </el-card>
+      </div>
+      <div class="right">2</div>
+    </div>
+  </template>
 </template>
 
 <script setup>
 // 校阅
 import { ref, inject } from 'vue';
 import { checkContent } from '@/api/aleditor.js';
+import { image_base64 } from './data';
 import jy from '@/assets/img/jy.png';
-const is_status = ref('none');
+const is_status = ref('show');
 
 const jiaoyue = () => {
-    is_status.value = 'load'
+  //   is_status.value = 'load';
   checkContent({
     data: {
       content: inject('getHtml')(),
@@ -38,11 +60,13 @@ const jiaoyue = () => {
       // generationInfo: null,
       // shouldGenerate: false,
     },
-  }).then(r => {
-    console.log(r);
-  }).catch(()=>{
-    is_status.value = 'none'
-  });
+  })
+    .then(r => {
+      console.log(r);
+    })
+    .catch(() => {
+      // is_status.value = 'none'
+    });
 };
 jiaoyue();
 </script>
@@ -52,6 +76,7 @@ jiaoyue();
   width: 310px;
   margin: 0 auto;
 }
+
 .none_title {
   font-size: 24px;
   text-align: left;
@@ -59,9 +84,11 @@ jiaoyue();
   margin-bottom: 16px;
   margin-left: 11.3%;
 }
+
 ul {
   margin-left: 20px;
 }
+
 ul > li {
   font-size: 14px;
   color: #2c3e50;
@@ -155,4 +182,48 @@ ul > li {
     background-color: hsla(0, 0%, 100%, 0.1);
   }
 }
+
+.show .left {
+  width: 60%;
+  padding: 0 10px;
+  display: inline-block;
+}
+.show .right {
+  display: inline-block;
+}
+.list {
+  font-size: 14px;
+  font-weight: 400;
+  height: 32px;
+  line-height: 32px;
+  color: #111;
+  margin-left: 26px;
+}
+
+.alert-go-right,
+.alert-two-way {
+  vertical-align: middle;
+  display: inline-block;
+  width: 24px;
+  height: 24px;
+  background-size: contain;
+}
+
+.replaceText {
+  background: #d9e6ff;
+  color: #2470ff;
+  font-size: 14px;
+  font-weight: 400;
+  text-align: center;
+  height: 32px;
+  line-height: 32px;
+  padding: 0 8px;
+  border-radius: 4px;
+  display: inline-block;
+  max-width: 150px;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  vertical-align: middle;
+}
 </style>

src/view/allMedia/AIeditor/index.vue

@@ -129,7 +129,7 @@
         <Transition name="toolRightSon">
           <div
             v-if="!noOpenSon"
-            style="transition: all 0.2s ease; position: relative"
+            style="transition: all 0.2s ease; position: relative;height: 100%;"
           >
             <div class="RightSonTitle">
               <div class="t_header animate__faster">
@@ -191,12 +191,16 @@ import dictionary from './components/dictionary.vue';
 import comment from './components/comment.vue';
 // 右侧二级组件
 import full_text from './components/full_text.vue';
+import advertisement from './components/advertisement.vue';
+import inspiration from './components/inspiration.vue';
+import literature from './components/literature.vue';
+import little_red_book from './components/little_red_book.vue';
 
 // 右侧头部数据
 const right_head = ref({});
 
 const componment_list = [pen_ink, review, image, dictionary, comment];
-const component_2_list = [full_text];
+const component_2_list = [full_text,advertisement,inspiration,literature,little_red_book];
 
 const noOpenSon = ref(true);
 

src/view/allMedia/login.vue

@@ -116,3 +116,4 @@ async function onSubmit() {
     width: 100%;
 }
 </style>
+