|
@@ -0,0 +1,496 @@
|
|
|
|
+<template>
|
|
|
|
+ <div v-if="editor" :loading="loading">
|
|
|
|
+ <el-row>
|
|
|
|
+ <span style="float: right;">
|
|
|
|
+ <el-col :span="1.5">
|
|
|
|
+ <el-button type="primary" plain icon="el-icon-check" size="mini" @click="handleApprove('2')" :loading="loading">审批</el-button>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="1.5" >
|
|
|
|
+ <el-button type="primary" plain icon="el-icon-close" size="mini" @click="handleApprove('5')" :loading="loading">驳回</el-button>
|
|
|
|
+ </el-col>
|
|
|
|
+ </span>
|
|
|
|
+ </el-row>
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="12">
|
|
|
|
+ <el-card style="margin:10px">
|
|
|
|
+ <el-button @click="highlight_new_h" :class="{
|
|
|
|
+ 'is-active': editor.isActive('highlight', { color: '#ff5d5d' }),
|
|
|
|
+ }">
|
|
|
|
+ 主体
|
|
|
|
+ </el-button>
|
|
|
|
+ <el-button @click="highlight_new_t" :class="{
|
|
|
|
+ 'is-active': editor.isActive('highlight', { color: '#119525' }),
|
|
|
|
+ }">
|
|
|
|
+ 客体
|
|
|
|
+ </el-button>
|
|
|
|
+ <el-button @click="editor.chain().focus().unsetHighlight().run()" :disabled="!editor.isActive('highlight')">
|
|
|
|
+ 取消标记
|
|
|
|
+ </el-button>
|
|
|
|
+
|
|
|
|
+ <el-select v-model="selectedRelationId" placeholder="请选择关系" @change="handleSelectRelation">
|
|
|
|
+ <el-option v-for="relation in relations" :label="relation.name" :value="relation.id"
|
|
|
|
+ :key="relation.id"></el-option>
|
|
|
|
+ <el-option v-if="showAddRelationOption" :label="'添加关系'" :value="-1"></el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ <el-dialog :visible.sync="dialogVisible" append-to-body>
|
|
|
|
+ <el-input v-model="newRelationName" placeholder="请输入关系名称"></el-input>
|
|
|
|
+ <div slot="footer">
|
|
|
|
+ <el-button @click="dialogVisible = false">取消</el-button>
|
|
|
|
+ <el-button type="primary" @click="handleAddRelation">确定</el-button>
|
|
|
|
+ </div>
|
|
|
|
+ </el-dialog>
|
|
|
|
+ <el-button type="primary" @click="summit" style="margin-left:20px">标记</el-button>
|
|
|
|
+ <bubble-menu :editor="editor" :tippy-options="{ duration: 100 }" v-if="editor">
|
|
|
|
+ <el-button @click="highlight_new_h" style="color: '#ff5d5d'">
|
|
|
|
+ 主体
|
|
|
|
+ </el-button>
|
|
|
|
+ <el-button @click="highlight_new_t">
|
|
|
|
+ 客体
|
|
|
|
+ </el-button>
|
|
|
|
+ <!-- <button @click="highlight_new_h" style="backgrand-color:red" :class="{
|
|
|
|
+ 'is-active': editor.isActive('highlight', { color: '#ff5d5d' }),
|
|
|
|
+ }">
|
|
|
|
+ 主体
|
|
|
|
+ </button>
|
|
|
|
+ <button @click="highlight_new_t" :class="{
|
|
|
|
+ 'is-active': editor.isActive('highlight', { color: '#119525' }),
|
|
|
|
+ }">
|
|
|
|
+ 客体
|
|
|
|
+ </button> -->
|
|
|
|
+ </bubble-menu>
|
|
|
|
+ <editor-content :editor="editor" />
|
|
|
|
+ </el-card>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="12">
|
|
|
|
+ <el-card style="margin:10px">
|
|
|
|
+ <el-table :data="input.knowledgeList" style="width: 100%">
|
|
|
|
+ <el-table-column prop="start" label="主体" width="180" />
|
|
|
|
+ <el-table-column prop="end" label="客体" width="180" />
|
|
|
|
+ <el-table-column prop="relation" label="关系" />
|
|
|
|
+ <el-table-column prop="" label="操作" min-width="180" align="center">
|
|
|
|
+ <template slot-scope="scope">
|
|
|
|
+ <el-button @click="handleDelete(scope.$index)" class="btn-text-red" type="danger" size="mini"
|
|
|
|
+ icon="el-icon-delete">删除
|
|
|
|
+ </el-button>
|
|
|
|
+ <el-button @click="handleSearch(scope.$index)" type="primary" size="mini" icon="el-icon-search">查找
|
|
|
|
+ </el-button>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ </el-table>
|
|
|
|
+ <!-- <div class="block" style="margin-top: 15px">
|
|
|
|
+ <el-pagination align="center" @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
|
|
|
+ :current-page="currentPage" :page-sizes="[1, 5, 10, 20]" :page-size="pageSize"
|
|
|
|
+ layout="total, sizes, prev, pager, next, jumper" :total="input.knowledgeList.length">
|
|
|
|
+ </el-pagination>
|
|
|
|
+ </div> -->
|
|
|
|
+ </el-card>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+import { getResultBySubTaskId, updateResult } from "@/api/extract/result";
|
|
|
|
+import { approveSubTask } from "@/api/extract/subTask";
|
|
|
|
+
|
|
|
|
+import Highlight from "@tiptap/extension-highlight";
|
|
|
|
+import { Editor, EditorContent, BubbleMenu } from "@tiptap/vue-2";
|
|
|
|
+import StarterKit from "@tiptap/starter-kit";
|
|
|
|
+import relationsData from "./relations.json";
|
|
|
|
+export default {
|
|
|
|
+ name: "ExtractResult",
|
|
|
|
+ components: {
|
|
|
|
+ EditorContent,
|
|
|
|
+ BubbleMenu,
|
|
|
|
+ },
|
|
|
|
+ props:{
|
|
|
|
+ subTask: {
|
|
|
|
+ type: Object,
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ loading: false,
|
|
|
|
+ result:{},
|
|
|
|
+ input: {
|
|
|
|
+ },
|
|
|
|
+ spo: {
|
|
|
|
+ sentenceId: -1,
|
|
|
|
+ sentence: "",
|
|
|
|
+ start: "",
|
|
|
|
+ end: "",
|
|
|
|
+ relation: "",
|
|
|
|
+ startPosition: [],
|
|
|
|
+ endPosition: [],
|
|
|
|
+ },
|
|
|
|
+ currentPage: 1, // 当前页码
|
|
|
|
+ total: 20, // 总条数
|
|
|
|
+ pageSize: 5, // 每页的数据条数
|
|
|
|
+ lengths: [],
|
|
|
|
+ counter: 0,
|
|
|
|
+ text: "",
|
|
|
|
+ hColor: "#ff5d5d",
|
|
|
|
+ tColor: "#119525",
|
|
|
|
+ editor: null,
|
|
|
|
+ selectedRelationId: "",
|
|
|
|
+ selectedRelationId: null,
|
|
|
|
+ dialogVisible: false,
|
|
|
|
+ newRelationName: "",
|
|
|
|
+ spo_list: [],
|
|
|
|
+ relations: relationsData,
|
|
|
|
+ startSentenceId: 114514,
|
|
|
|
+ endSentenceId: 114514,
|
|
|
|
+ };
|
|
|
|
+ },
|
|
|
|
+ created() {
|
|
|
|
+ this.getResult()
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ computed: {
|
|
|
|
+ showAddRelationOption() {
|
|
|
|
+ // 如果已经有添加关系的选项,则不显示
|
|
|
|
+ return !this.relations.some((r) => r.id === -1);
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ mounted() {
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ getResult(){
|
|
|
|
+ this.loading = true
|
|
|
|
+ getResultBySubTaskId(this.subTask.id).then(response => {
|
|
|
|
+ this.input = JSON.parse(response.data.result)
|
|
|
|
+ this.result = response.data
|
|
|
|
+ this.createEditor()
|
|
|
|
+ this.loading = false
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ createEditor(){
|
|
|
|
+ this.editor = new Editor({
|
|
|
|
+ extensions: [Highlight.configure({ multicolor: true }), StarterKit],
|
|
|
|
+ content: this.input.sentenceList.map((item) => item.text + '<br>').join(""),
|
|
|
|
+ });
|
|
|
|
+ this.lengths = this.getSentenceStartPositions(this.input);
|
|
|
|
+ for (let re in this.input.knowledgeList) {
|
|
|
|
+ this.highlight_h(
|
|
|
|
+ this.lengths[this.input.knowledgeList[re].sentenceId] +
|
|
|
|
+ 1 +
|
|
|
|
+ this.input.knowledgeList[re].startPosition[0],
|
|
|
|
+ this.lengths[this.input.knowledgeList[re].sentenceId] +
|
|
|
|
+ 1 +
|
|
|
|
+ this.input.knowledgeList[re].startPosition[1]
|
|
|
|
+ );
|
|
|
|
+ this.highlight_t(
|
|
|
|
+ this.lengths[this.input.knowledgeList[re].sentenceId] +
|
|
|
|
+ 1 +
|
|
|
|
+ this.input.knowledgeList[re].endPosition[0],
|
|
|
|
+ this.lengths[this.input.knowledgeList[re].sentenceId] +
|
|
|
|
+ 1 +
|
|
|
|
+ this.input.knowledgeList[re].endPosition[1]
|
|
|
|
+ );
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ //每页条数改变时触发 选择一页显示多少行
|
|
|
|
+ handleSizeChange(val) {
|
|
|
|
+ this.currentPage = 1;
|
|
|
|
+ this.pageSize = val;
|
|
|
|
+ },
|
|
|
|
+ //当前页改变时触发 跳转其他页
|
|
|
|
+ handleCurrentChange(val) {
|
|
|
|
+ this.currentPage = val;
|
|
|
|
+ },
|
|
|
|
+ highlight_h(from, to) {
|
|
|
|
+ this.editor.commands.setTextSelection({ from: from, to: to });
|
|
|
|
+ const docNode = this.editor.state.doc;
|
|
|
|
+ var flag = 0;
|
|
|
|
+ if (docNode.content.content[0].content.content.length == 1) {
|
|
|
|
+ this.editor.chain().focus().toggleHighlight({ color: "#ff5d5d" }).run();
|
|
|
|
+ } else {
|
|
|
|
+ docNode.descendants((node, pos) => {
|
|
|
|
+ if (pos <= from && pos + node.nodeSize >= to) {
|
|
|
|
+ if (node.marks.length > 0) {
|
|
|
|
+ flag = 1;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ if (flag == 0) {
|
|
|
|
+ this.editor
|
|
|
|
+ .chain()
|
|
|
|
+ .focus()
|
|
|
|
+ .toggleHighlight({ color: "#ff5d5d" })
|
|
|
|
+ .run();
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ highlight_t(from, to) {
|
|
|
|
+ this.editor.commands.setTextSelection({ from: from, to: to });
|
|
|
|
+ const docNode = this.editor.state.doc;
|
|
|
|
+ var flag = 0;
|
|
|
|
+ if (docNode.content.content[0].content.content.length == 1) {
|
|
|
|
+ this.editor.chain().focus().toggleHighlight({ color: "#119525" }).run();
|
|
|
|
+ } else {
|
|
|
|
+ docNode.descendants((node, pos) => {
|
|
|
|
+ if (pos <= from && pos + node.nodeSize >= to) {
|
|
|
|
+ if (node.marks.length > 0) {
|
|
|
|
+ flag = 1;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ if (flag == 0) {
|
|
|
|
+ this.editor
|
|
|
|
+ .chain()
|
|
|
|
+ .focus()
|
|
|
|
+ .toggleHighlight({ color: "#119525" })
|
|
|
|
+ .run();
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ highlight_new_h() {
|
|
|
|
+ // 获取当前选中的内容及其所在的位置
|
|
|
|
+ const selection = this.editor.view.state.selection;
|
|
|
|
+
|
|
|
|
+ // 获取选中内容的起始位置
|
|
|
|
+ const from = selection.from;
|
|
|
|
+
|
|
|
|
+ // 获取选中内容的结束位置
|
|
|
|
+ const to = selection.to;
|
|
|
|
+
|
|
|
|
+ const text = this.editor.view.state.doc.textBetween(from, to, "\n");
|
|
|
|
+ this.spo.start = text;
|
|
|
|
+ const {
|
|
|
|
+ sentenceIndex: a,
|
|
|
|
+ sentenceStartPosition: b,
|
|
|
|
+ sentenceEndPosition: c,
|
|
|
|
+ } = this.getPosition(this.lengths, from - 1, to - 1);
|
|
|
|
+ this.startSentenceId = a;
|
|
|
|
+ this.spo.startPosition = [b, c];
|
|
|
|
+
|
|
|
|
+ var flag = 0;
|
|
|
|
+ const docNode = this.editor.state.doc;
|
|
|
|
+ if (docNode.content.content[0].content.content.length == 1) {
|
|
|
|
+ this.editor.chain().focus().toggleHighlight({ color: "#ff5d5d" }).run();
|
|
|
|
+ } else {
|
|
|
|
+ docNode.descendants((node, pos) => {
|
|
|
|
+ if (pos <= from && pos + node.nodeSize >= to) {
|
|
|
|
+ if (node.marks.length > 0) {
|
|
|
|
+ flag = 1;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ if (flag == 0) {
|
|
|
|
+ this.editor
|
|
|
|
+ .chain()
|
|
|
|
+ .focus()
|
|
|
|
+ .toggleHighlight({ color: "#ff5d5d" })
|
|
|
|
+ .run();
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ highlight_new_t() {
|
|
|
|
+ // 获取当前选中的内容及其所在的位置
|
|
|
|
+ const selection = this.editor.view.state.selection;
|
|
|
|
+
|
|
|
|
+ // 获取选中内容的起始位置
|
|
|
|
+ const from = selection.from;
|
|
|
|
+
|
|
|
|
+ // 获取选中内容的结束位置
|
|
|
|
+ const to = selection.to;
|
|
|
|
+
|
|
|
|
+ const text = this.editor.view.state.doc.textBetween(from, to, "\n");
|
|
|
|
+ this.spo.end = text;
|
|
|
|
+ const {
|
|
|
|
+ sentenceIndex: a,
|
|
|
|
+ sentenceStartPosition: b,
|
|
|
|
+ sentenceEndPosition: c,
|
|
|
|
+ } = this.getPosition(this.lengths, from - 1, to - 1);
|
|
|
|
+ this.endSentenceId = a;
|
|
|
|
+ this.spo.endPosition = [b, c];
|
|
|
|
+ var flag = 0;
|
|
|
|
+ const docNode = this.editor.state.doc;
|
|
|
|
+ if (docNode.content.content[0].content.content.length == 1) {
|
|
|
|
+ this.editor.chain().focus().toggleHighlight({ color: "#119525" }).run();
|
|
|
|
+ } else {
|
|
|
|
+ docNode.descendants((node, pos) => {
|
|
|
|
+ if (pos <= from && pos + node.nodeSize >= to) {
|
|
|
|
+ if (node.marks.length > 0) {
|
|
|
|
+ flag = 1;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ if (flag == 0) {
|
|
|
|
+ this.editor
|
|
|
|
+ .chain()
|
|
|
|
+ .focus()
|
|
|
|
+ .toggleHighlight({ color: "#119525" })
|
|
|
|
+ .run();
|
|
|
|
+ } else {
|
|
|
|
+ this.editor
|
|
|
|
+ .chain()
|
|
|
|
+ .focus()
|
|
|
|
+ .toggleHighlight({ color: "#ff5d5d" })
|
|
|
|
+ .run();
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ summit() {
|
|
|
|
+ if (this.startSentenceId == this.endSentenceId) {
|
|
|
|
+ var id = this.startSentenceId;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ if (this.selectedRelationId == null) {
|
|
|
|
+ this.handleError();
|
|
|
|
+ } else {
|
|
|
|
+ this.spo.relation = this.relations[this.selectedRelationId - 1].name;
|
|
|
|
+ if (this.spo.start != "" && this.spo.end != "") {
|
|
|
|
+ this.spo.sentenceId = id;
|
|
|
|
+ this.spo.sentence = this.input.sentenceList[id].text;
|
|
|
|
+ this.input.knowledgeList.push(this.spo);
|
|
|
|
+ this.spo = {
|
|
|
|
+ sentenceId: 114514,
|
|
|
|
+ sentence: "",
|
|
|
|
+ start: "",
|
|
|
|
+ end: "",
|
|
|
|
+ relation: "",
|
|
|
|
+ startPosition: [],
|
|
|
|
+ endPosition: [],
|
|
|
|
+ };
|
|
|
|
+ } else {
|
|
|
|
+ this.handleError();
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ //this.editor.chain().focus().unsetHighlight().run()
|
|
|
|
+ },
|
|
|
|
+ handleSelectRelation(value) {
|
|
|
|
+ if (value === -1) {
|
|
|
|
+ this.dialogVisible = true;
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ handleAddRelation() {
|
|
|
|
+ const maxId = Math.max(...this.relations.map((r) => r.id));
|
|
|
|
+ const newId = maxId + 1;
|
|
|
|
+ const newRelation = { id: newId, name: this.newRelationName };
|
|
|
|
+ this.relations.push(newRelation);
|
|
|
|
+ this.selectedRelationId = newId;
|
|
|
|
+ this.dialogVisible = false;
|
|
|
|
+ setRelations(this.relations);
|
|
|
|
+ this.newRelationName = "";
|
|
|
|
+ },
|
|
|
|
+ getSentenceStartPositions(json) {
|
|
|
|
+ const sentenceList = json.sentenceList;
|
|
|
|
+ const lengths = [];
|
|
|
|
+
|
|
|
|
+ let currentPosition = 0;
|
|
|
|
+
|
|
|
|
+ for (let i = 0; i < sentenceList.length; i++) {
|
|
|
|
+ lengths.push(currentPosition);
|
|
|
|
+ currentPosition += sentenceList[i].text.length;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ return lengths;
|
|
|
|
+ },
|
|
|
|
+ handleDelete(index) {
|
|
|
|
+ this.input.knowledgeList.splice(index, 1);
|
|
|
|
+ },
|
|
|
|
+ handleError() {
|
|
|
|
+ this.$message.error(`标注内容不全`);
|
|
|
|
+ },
|
|
|
|
+ handleSearch(index) {
|
|
|
|
+ var num = (this.currentPage - 1) * this.pageSize + index;
|
|
|
|
+ var start =
|
|
|
|
+ this.lengths[this.input.knowledgeList[num].sentenceId] +
|
|
|
|
+ 1 +
|
|
|
|
+ this.input.knowledgeList[num].startPosition[0];
|
|
|
|
+ var end =
|
|
|
|
+ this.lengths[this.input.knowledgeList[num].sentenceId] +
|
|
|
|
+ 1 +
|
|
|
|
+ this.input.knowledgeList[num].startPosition[1];
|
|
|
|
+ this.editor.commands.setTextSelection({ from: start, to: end });
|
|
|
|
+ this.editor.chain().focus();
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ getPosition(lengths, start, end) {
|
|
|
|
+ // 获取start所在句子的索引
|
|
|
|
+ let sentenceIndex = 0;
|
|
|
|
+ let sum = 0;
|
|
|
|
+ for (let i = 0; i < lengths.length; i++) {
|
|
|
|
+ sum += lengths[i];
|
|
|
|
+ if (start < sum) {
|
|
|
|
+ sentenceIndex = i;
|
|
|
|
+ break;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ // 计算start和end在句子中的位置
|
|
|
|
+ const sentenceStartPosition = start - sum + lengths[sentenceIndex];
|
|
|
|
+ const sentenceEndPosition = end - sum + lengths[sentenceIndex];
|
|
|
|
+ sentenceIndex -= 1;
|
|
|
|
+
|
|
|
|
+ // 获取start和end所在句子的startPosition和endPosition
|
|
|
|
+ //const sentence = this.input.sentenceList[sentenceIndex];
|
|
|
|
+ //const startPosition = sentence.knowledgeList[0].startPosition[sentenceStartPosition];
|
|
|
|
+ //const endPosition = sentence.knowledgeList[0].endPosition[sentenceEndPosition];
|
|
|
|
+
|
|
|
|
+ return { sentenceIndex, sentenceStartPosition, sentenceEndPosition };
|
|
|
|
+ },
|
|
|
|
+ handleApprove(status) {
|
|
|
|
+ this.loading = true
|
|
|
|
+ this.result.result = JSON.stringify(this.input)
|
|
|
|
+ approveSubTask(this.subTask.id, status, this.result).then(resp => {
|
|
|
|
+ let message;
|
|
|
|
+ if (status == 2){
|
|
|
|
+ message = '审批成功'
|
|
|
|
+ } else {
|
|
|
|
+ message = '驳回成功'
|
|
|
|
+ }
|
|
|
|
+ this.$message({
|
|
|
|
+ message,
|
|
|
|
+ type: 'success'
|
|
|
|
+ });
|
|
|
|
+ this.loading = false
|
|
|
|
+ this.$emit("closeInfo")
|
|
|
|
+ })
|
|
|
|
+ .catch(() => {});
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ beforeUnmount() {
|
|
|
|
+ this.editor.destroy();
|
|
|
|
+ },
|
|
|
|
+};
|
|
|
|
+</script>
|
|
|
|
+<style>
|
|
|
|
+.wrapper {
|
|
|
|
+ display: flex;
|
|
|
|
+ flex-direction: row;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.left-card {
|
|
|
|
+ margin-right: 20px;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.right-card {
|
|
|
|
+ margin-left: 20px;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.editor-content {
|
|
|
|
+ min-width: 35em;
|
|
|
|
+ display: block;
|
|
|
|
+ text-align: unset;
|
|
|
|
+ border-radius: 20px;
|
|
|
|
+ padding: 1rem;
|
|
|
|
+ /* border: 1px solid rgba(0, 0, 0, 0.363); */
|
|
|
|
+}
|
|
|
|
+</style>
|
|
|
|
+<style scoped>
|
|
|
|
+.button {
|
|
|
|
+ background-color: aqua;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.el-card {
|
|
|
|
+ color: #e7e7e7
|
|
|
|
+}
|
|
|
|
+</style>
|