|
|
@@ -1,7 +1,11 @@
|
|
|
<template>
|
|
|
<div class="edito">
|
|
|
<Head />
|
|
|
- <div class="onlineTextMain" v-loading="loading" element-loading-background="rgba(225,225,225,0.1)">
|
|
|
+ <div
|
|
|
+ class="onlineTextMain"
|
|
|
+ v-loading="loading"
|
|
|
+ element-loading-background="rgba(225,225,225,0.1)"
|
|
|
+ >
|
|
|
<div class="flex1">
|
|
|
<div class="btn-grounp">
|
|
|
文章内容
|
|
|
@@ -10,8 +14,9 @@
|
|
|
style="float: right; margin-top: 0.3em; margin-right: 0.5em"
|
|
|
@click="getServer"
|
|
|
:loading="loading"
|
|
|
- >校验</el-button
|
|
|
>
|
|
|
+ 校验
|
|
|
+ </el-button>
|
|
|
</div>
|
|
|
<div class="Fle">
|
|
|
<Editor ref="editor" :rawText="rawText" />
|
|
|
@@ -21,7 +26,11 @@
|
|
|
<div class="btn-grounp">检索结果</div>
|
|
|
<div style="padding: 1em 1em 0 1em">
|
|
|
<div class="tabs">
|
|
|
- <div class="tab" @click="() => changeTabAll()" style="background-color: #2974ff; color: #fff">
|
|
|
+ <div
|
|
|
+ class="tab"
|
|
|
+ @click="() => changeTabAll()"
|
|
|
+ style="background-color: #2974ff; color: #fff"
|
|
|
+ >
|
|
|
<p>全部错误</p>
|
|
|
{{ search.tabs[0] ? search.tabs[0].num : 0 }}
|
|
|
</div>
|
|
|
@@ -148,6 +157,12 @@
|
|
|
<el-radio :label="1">已忽略: {{ search.list1.length }}</el-radio>
|
|
|
<el-radio :label="2">已替换: {{ search.list2.length }}</el-radio>
|
|
|
</el-radio-group>
|
|
|
+ <el-button
|
|
|
+ class="clearError"
|
|
|
+ type="primary"
|
|
|
+ @click="clearError"
|
|
|
+ :icon="Delete"
|
|
|
+ />
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="search">
|
|
|
@@ -242,8 +257,8 @@
|
|
|
2
|
|
|
)
|
|
|
"
|
|
|
- >删除 </span
|
|
|
- >
|
|
|
+ >删除
|
|
|
+ </span>
|
|
|
<span
|
|
|
class="btn"
|
|
|
@click.stop="
|
|
|
@@ -434,14 +449,15 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import Head from "../components/head.vue";
|
|
|
-import Editor from "../components/editor.vue";
|
|
|
-import { ElMessage } from "element-plus";
|
|
|
-import { reactive, ref, nextTick } from "vue";
|
|
|
-import errType from "../../config/errtype";
|
|
|
-document.title = "文本检测";
|
|
|
+import Head from '../components/head.vue';
|
|
|
+import Editor from '../components/editor.vue';
|
|
|
+import { ElMessage } from 'element-plus';
|
|
|
+import { Delete } from '@element-plus/icons-vue';
|
|
|
+import { reactive, ref, nextTick } from 'vue';
|
|
|
+import errType from '../../config/errtype';
|
|
|
+document.title = '文本检测';
|
|
|
const loading = ref(false);
|
|
|
-const rawText = ref("");
|
|
|
+const rawText = ref('');
|
|
|
const editor = ref(null);
|
|
|
const tabSelect = reactive([true, true, true, true, true]);
|
|
|
|
|
|
@@ -458,10 +474,20 @@ let search = reactive({
|
|
|
const tabAct = ref(0);
|
|
|
const select = ref(0);
|
|
|
|
|
|
+function clearError() {
|
|
|
+ const ori = localStorage.getItem('media_editor') || '';
|
|
|
+ if (!ori) return;
|
|
|
+ rawText.value = ori;
|
|
|
+ search.list = [];
|
|
|
+ search.list1 = [];
|
|
|
+ search.list2 = [];
|
|
|
+ search.tabs = [{ num: 0 }];
|
|
|
+}
|
|
|
+
|
|
|
function getTypeError(key, type) {
|
|
|
- if (type == "rgb") return type + "(" + errType[key] + ")";
|
|
|
- if (type == "rgba") return type + "(" + errType[key] + ", 0.1)";
|
|
|
- return "";
|
|
|
+ if (type == 'rgb') return type + '(' + errType[key] + ')';
|
|
|
+ if (type == 'rgba') return type + '(' + errType[key] + ', 0.1)';
|
|
|
+ return '';
|
|
|
}
|
|
|
|
|
|
function changeselect(index) {
|
|
|
@@ -471,66 +497,71 @@ function changeselect(index) {
|
|
|
const newEle = document.querySelector(
|
|
|
"[data-umpos='" + search.list[index].colorPosition + "']"
|
|
|
);
|
|
|
- oldEle.style.backgroundColor = "";
|
|
|
+ oldEle.style.backgroundColor = '';
|
|
|
newEle.style.backgroundColor =
|
|
|
- "rgba(" + errType[search.list[index].um_error_level] + ", 0.5)";
|
|
|
+ 'rgba(' + errType[search.list[index].um_error_level] + ', 0.5)';
|
|
|
select.value = index;
|
|
|
}
|
|
|
|
|
|
function clearEle(colorPosition, text, i, type) {
|
|
|
const newEle = document.querySelector("[data-umpos='" + colorPosition + "']");
|
|
|
- newEle.setAttribute("style", "");
|
|
|
+ newEle.setAttribute('style', '');
|
|
|
newEle.innerText = text;
|
|
|
const item = JSON.parse(JSON.stringify(search.list[i]));
|
|
|
- search["list" + type].push(item);
|
|
|
+ search['list' + type].push(item);
|
|
|
search.list.splice(i, 1);
|
|
|
- rawText.value = document.querySelector(".Fle .text").innerHTML;
|
|
|
+ rawText.value = document.querySelector('.Fle .text').innerHTML;
|
|
|
}
|
|
|
|
|
|
-function isDel(id){
|
|
|
- return id == 105 || id == 112 || id == 111 || id == 108 || id == 201
|
|
|
+function isDel(id) {
|
|
|
+ const Del = {
|
|
|
+ 105: true,
|
|
|
+ 108: true,
|
|
|
+ 112: true,
|
|
|
+ 111: true,
|
|
|
+ 201: true,
|
|
|
+ };
|
|
|
+ return Del[id];
|
|
|
}
|
|
|
|
|
|
-function removeEle(colorPosition, text, i){
|
|
|
- const newEle = document.querySelector("[data-umpos='" + colorPosition + "']");
|
|
|
- newEle.remove();
|
|
|
- rawText.value = document.querySelector(".text").innerHTML;
|
|
|
- search.list.splice(i, 1);
|
|
|
+function removeEle(colorPosition, text, i) {
|
|
|
+ const newEle = document.querySelector("[data-umpos='" + colorPosition + "']");
|
|
|
+ newEle.remove();
|
|
|
+ rawText.value = document.querySelector('.text').innerHTML;
|
|
|
+ search.list.splice(i, 1);
|
|
|
}
|
|
|
|
|
|
function back(v, i, type) {
|
|
|
const newEle = document.querySelector(
|
|
|
"[data-umpos='" + v.colorPosition + "']"
|
|
|
);
|
|
|
- newEle.style.borderColor = "rgb(" + errType[v.um_error_level] + ")";
|
|
|
- const item = JSON.parse(JSON.stringify(search["list" + type][i]));
|
|
|
+ newEle.style.borderColor = 'rgb(' + errType[v.um_error_level] + ')';
|
|
|
+ const item = JSON.parse(JSON.stringify(search['list' + type][i]));
|
|
|
search.list.push(item);
|
|
|
- search["list" + type].splice(i, 1);
|
|
|
+ search['list' + type].splice(i, 1);
|
|
|
}
|
|
|
function getServer() {
|
|
|
if (!window.fetch) return;
|
|
|
loading.value = true;
|
|
|
window
|
|
|
- .fetch("https://topic.smcic.net/youmei/check", {
|
|
|
- method: "POST",
|
|
|
+ .fetch('https://topic.smcic.net/youmei/check', {
|
|
|
+ method: 'POST',
|
|
|
body: JSON.stringify({
|
|
|
text: editor.value.editor.innerHTML,
|
|
|
// text: editor.value.valueHtml,
|
|
|
}),
|
|
|
headers: {
|
|
|
- "Content-Type": "application/json",
|
|
|
+ 'Content-Type': 'application/json',
|
|
|
},
|
|
|
})
|
|
|
- .then(json => {
|
|
|
- return json.json();
|
|
|
- })
|
|
|
+ .then(json => json.json())
|
|
|
.then(res => {
|
|
|
loading.value = false;
|
|
|
- if (!res || res.code !== 0) return ElMessage.error("请稍后再试！");
|
|
|
+ if (!res || res.code !== 0) return ElMessage.error('请稍后再试！');
|
|
|
search.list = res.data.checklist || [];
|
|
|
search.list1 = [];
|
|
|
search.list2 = [];
|
|
|
- rawText.value = res.data.rawText || "";
|
|
|
+ rawText.value = res.data.rawText || '';
|
|
|
nextTick(() => {
|
|
|
const tabs = [
|
|
|
{
|
|
|
@@ -542,7 +573,7 @@ function getServer() {
|
|
|
const ele = document.querySelector(
|
|
|
"[data-umpos='" + item.colorPosition + "']"
|
|
|
);
|
|
|
- ele.style.borderColor = "rgb(" + errType[item.um_error_level] + ")";
|
|
|
+ ele.style.borderColor = 'rgb(' + errType[item.um_error_level] + ')';
|
|
|
if (!tabs[item.um_error_level])
|
|
|
tabs[item.um_error_level] = {
|
|
|
num: 0,
|
|
|
@@ -551,7 +582,7 @@ function getServer() {
|
|
|
tabs[item.um_error_level].num += 1;
|
|
|
if (i !== 0) continue;
|
|
|
ele.style.backgroundColor =
|
|
|
- "rgba(" + errType[item.um_error_level] + ",0.5)";
|
|
|
+ 'rgba(' + errType[item.um_error_level] + ',0.5)';
|
|
|
}
|
|
|
search.tabs = tabs;
|
|
|
});
|
|
|
@@ -563,8 +594,8 @@ function changeTab(i) {
|
|
|
}
|
|
|
|
|
|
function changeTabAll() {
|
|
|
- let t = tabSelect.filter(v=>!v).length ? true : false;
|
|
|
- for(let i = 0; i < tabSelect.length; i++){
|
|
|
+ let t = tabSelect.filter(v => !v).length ? true : false;
|
|
|
+ for (let i = 0; i < tabSelect.length; i++) {
|
|
|
tabSelect[i] = t;
|
|
|
}
|
|
|
}
|
|
|
@@ -648,7 +679,10 @@ function changeTabAll() {
|
|
|
height: calc(100vh-226px);
|
|
|
}
|
|
|
.tab p {
|
|
|
- white-space: nowrap;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+.clearError {
|
|
|
+ float: right;
|
|
|
}
|
|
|
</style>
|
|
|
|
liyongli