|
|
@@ -14,7 +14,6 @@
|
|
|
<v-btn
|
|
|
text
|
|
|
color="primary"
|
|
|
- :disabled="item.performanceSolutionId === clickId"
|
|
|
@click.stop="onClick(item)"
|
|
|
>
|
|
|
查看方案
|
|
|
@@ -26,113 +25,153 @@
|
|
|
<v-card class="width-auto">
|
|
|
<div class="pa-3 fullscreen">
|
|
|
<div class="fullscreen d-flex flex-column">
|
|
|
- <template v-if="clickItem">
|
|
|
- <div class="mb-3">
|
|
|
- <v-tabs v-model="active">
|
|
|
- <v-tab
|
|
|
- v-for="item in clickItem"
|
|
|
- :key="item.category"
|
|
|
- >{{ item.category }}</v-tab>
|
|
|
- </v-tabs>
|
|
|
+ <v-card outlined class="height-auto">
|
|
|
+ <Toolbar
|
|
|
+ style="border-bottom: 1px solid #ccc"
|
|
|
+ :editor="editor"
|
|
|
+ :defaultConfig="toolbarConfig"
|
|
|
+ :mode="mode"
|
|
|
+ >11</Toolbar>
|
|
|
+ <Editor
|
|
|
+ style="overflow-y: hidden; height: calc(100% - 100px);"
|
|
|
+ v-model="editorHtml"
|
|
|
+ :defaultConfig="editorConfig"
|
|
|
+ :mode="mode"
|
|
|
+ @onCreated="onCreated"
|
|
|
+ />
|
|
|
+ <div class="d-flex align-end justify-end pa-3">
|
|
|
+ <v-btn color="primary">生成代码</v-btn>
|
|
|
</div>
|
|
|
- <v-card outlined class="height-auto">
|
|
|
- <div class="fullHeight d-flex">
|
|
|
- <div>
|
|
|
- <v-tabs v-model="tab" vertical>
|
|
|
- <v-tab>计算规则</v-tab>
|
|
|
- <v-tab>参数</v-tab>
|
|
|
- </v-tabs>
|
|
|
- </div>
|
|
|
- <div class="pa-3 width-auto">
|
|
|
- <div class="fullscreen overflow-y-auto">
|
|
|
- <v-tabs-items v-model="tab">
|
|
|
- <v-tab-item>
|
|
|
- <div v-html="ruleItem.calculateFormulas[0]?.content"></div>
|
|
|
- </v-tab-item>
|
|
|
- <v-tab-item class="pa-3">
|
|
|
- <v-expansion-panels
|
|
|
- v-model="panelActive"
|
|
|
- multiple
|
|
|
- >
|
|
|
- <v-expansion-panel
|
|
|
- v-for="(item,i) in ruleItem.calculateConfigurations"
|
|
|
- :key="i"
|
|
|
- >
|
|
|
- <v-expansion-panel-header>{{ item.name }}</v-expansion-panel-header>
|
|
|
- <v-expansion-panel-content>
|
|
|
- <div class="d-flex mb-3">
|
|
|
- <div>参数名称：</div>
|
|
|
- <div>{{ item.name }}</div>
|
|
|
- </div>
|
|
|
- <div class="d-flex">
|
|
|
- <div>参数值：</div>
|
|
|
- <div>
|
|
|
- <template v-if="item.valueCategory === 0">
|
|
|
- {{ item.value }}
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- <v-card outlined>
|
|
|
- <v-simple-table style="min-width: 500px;">
|
|
|
- <template v-slot:default>
|
|
|
- <thead>
|
|
|
- <tr>
|
|
|
- <th class="text-left"> 名称 </th>
|
|
|
- <th class="text-left"> 值 </th>
|
|
|
- </tr>
|
|
|
- </thead>
|
|
|
- <tbody>
|
|
|
- <tr
|
|
|
- v-for="val in JSON.parse(item.value)"
|
|
|
- :key="val.name"
|
|
|
- >
|
|
|
- <td>{{ val.name }}</td>
|
|
|
- <td>{{ val.value }}</td>
|
|
|
- </tr>
|
|
|
- </tbody>
|
|
|
- </template>
|
|
|
- </v-simple-table>
|
|
|
- </v-card>
|
|
|
- </template>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </v-expansion-panel-content>
|
|
|
- </v-expansion-panel>
|
|
|
- </v-expansion-panels>
|
|
|
- </v-tab-item>
|
|
|
- </v-tabs-items>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </v-card>
|
|
|
- </template>
|
|
|
- <div class="height-auto" v-else>
|
|
|
- <none-page></none-page>
|
|
|
- </div>
|
|
|
+ </v-card>
|
|
|
<div class="mt-3">
|
|
|
<v-textarea
|
|
|
v-model="code"
|
|
|
outlined
|
|
|
hide-details
|
|
|
label="请输入执行代码"
|
|
|
+ :rows="10"
|
|
|
dense
|
|
|
></v-textarea>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</v-card>
|
|
|
+ <v-navigation-drawer
|
|
|
+ v-model="drawer"
|
|
|
+ absolute
|
|
|
+ temporary
|
|
|
+ right
|
|
|
+ width="800"
|
|
|
+ >
|
|
|
+ <div class="fullHeight d-flex flex-column">
|
|
|
+ <div class="mb-3">
|
|
|
+ <v-tabs v-model="active">
|
|
|
+ <v-tab
|
|
|
+ v-for="item in clickItem"
|
|
|
+ :key="item.category"
|
|
|
+ >{{ item.category }}</v-tab>
|
|
|
+ </v-tabs>
|
|
|
+ </div>
|
|
|
+ <v-card class="height-auto">
|
|
|
+ <div class="fullHeight d-flex">
|
|
|
+ <div>
|
|
|
+ <v-tabs v-model="tab" vertical>
|
|
|
+ <v-tab>计算规则</v-tab>
|
|
|
+ <v-tab>参数</v-tab>
|
|
|
+ </v-tabs>
|
|
|
+ </div>
|
|
|
+ <div class="pa-3 width-auto">
|
|
|
+ <div class="fullscreen overflow-y-auto">
|
|
|
+ <v-tabs-items v-model="tab">
|
|
|
+ <v-tab-item>
|
|
|
+ <div v-html="ruleItem.calculateFormulas[0]?.content"></div>
|
|
|
+ </v-tab-item>
|
|
|
+ <v-tab-item class="pa-3">
|
|
|
+ <v-expansion-panels
|
|
|
+ v-model="panelActive"
|
|
|
+ multiple
|
|
|
+ >
|
|
|
+ <v-expansion-panel
|
|
|
+ v-for="(item,i) in ruleItem.calculateConfigurations"
|
|
|
+ :key="i"
|
|
|
+ >
|
|
|
+ <v-expansion-panel-header>{{ item.name }}</v-expansion-panel-header>
|
|
|
+ <v-expansion-panel-content>
|
|
|
+ <div class="d-flex mb-3">
|
|
|
+ <div>参数名称：</div>
|
|
|
+ <div>{{ item.name }}</div>
|
|
|
+ </div>
|
|
|
+ <div class="d-flex">
|
|
|
+ <div>参数值：</div>
|
|
|
+ <div>
|
|
|
+ <template v-if="item.valueCategory === 0">
|
|
|
+ {{ item.value }}
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <v-card outlined>
|
|
|
+ <v-simple-table style="min-width: 500px;">
|
|
|
+ <template v-slot:default>
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <th class="text-left"> 名称 </th>
|
|
|
+ <th class="text-left"> 值 </th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody>
|
|
|
+ <tr
|
|
|
+ v-for="val in JSON.parse(item.value)"
|
|
|
+ :key="val.name"
|
|
|
+ >
|
|
|
+ <td>{{ val.name }}</td>
|
|
|
+ <td>{{ val.value }}</td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </template>
|
|
|
+ </v-simple-table>
|
|
|
+ </v-card>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </v-expansion-panel-content>
|
|
|
+ </v-expansion-panel>
|
|
|
+ </v-expansion-panels>
|
|
|
+ </v-tab-item>
|
|
|
+ </v-tabs-items>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </v-card>
|
|
|
+ </div>
|
|
|
+ </v-navigation-drawer>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import NonePage from '@/components/Common/empty.vue'
|
|
|
+import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
|
|
|
+import '@wangeditor/editor/dist/css/style.css'
|
|
|
+// import NonePage from '@/components/Common/empty.vue'
|
|
|
import axios from 'axios'
|
|
|
export default {
|
|
|
name: 'editPage',
|
|
|
- components: {
|
|
|
- NonePage
|
|
|
- },
|
|
|
+ components: { Editor, Toolbar },
|
|
|
data () {
|
|
|
return {
|
|
|
+ drawer: false,
|
|
|
+ editor: null,
|
|
|
+ editorHtml: null,
|
|
|
+ toolbarConfig: {
|
|
|
+ toolbarKeys: [
|
|
|
+ 'headerSelect',
|
|
|
+ // 分割线
|
|
|
+ '|',
|
|
|
+ 'bold',
|
|
|
+ 'italic'
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ editorConfig: { placeholder: '请输入内容...' },
|
|
|
+ mode: 'default', // or 'simple'
|
|
|
+
|
|
|
+ code: null,
|
|
|
loading: false,
|
|
|
items: [],
|
|
|
rulesItems: [],
|
|
|
@@ -157,7 +196,15 @@ export default {
|
|
|
created () {
|
|
|
this.init()
|
|
|
},
|
|
|
+ beforeDestroy () {
|
|
|
+ const editor = this.editor
|
|
|
+ if (editor == null) return
|
|
|
+ editor.destroy() // 组件销毁时，及时销毁编辑器
|
|
|
+ },
|
|
|
methods: {
|
|
|
+ onCreated (editor) {
|
|
|
+ this.editor = Object.seal(editor) // 一定要用 Object.seal() ，否则会报错
|
|
|
+ },
|
|
|
async init () {
|
|
|
try {
|
|
|
this.loading = true
|
|
|
@@ -201,6 +248,7 @@ export default {
|
|
|
})
|
|
|
this.clickId = data.entity.performanceSolutionId
|
|
|
this.clickItem = data.performanceSolutionDetailRespCategoryVos
|
|
|
+ this.drawer = true
|
|
|
} catch (error) {
|
|
|
this.$snackbar.error(error)
|
|
|
} finally {
|
|
|
@@ -227,4 +275,7 @@ export default {
|
|
|
height: 0;
|
|
|
flex: 1;
|
|
|
}
|
|
|
+::v-deep ul {
|
|
|
+ padding-left: 0;
|
|
|
+}
|
|
|
</style>
|
zhengnaiwen_citu