|
|
@@ -0,0 +1,230 @@
|
|
|
+<template>
|
|
|
+ <div class="d-flex fullscreen" v-loading="loading">
|
|
|
+ <v-card style="width: 400px;" class="mr-3 fullHeight">
|
|
|
+ <v-banner>方案列表</v-banner>
|
|
|
+ <v-list>
|
|
|
+ <v-list-item
|
|
|
+ v-for="item in items"
|
|
|
+ :key="item.performanceSolutionId"
|
|
|
+ >
|
|
|
+ <v-list-item-content>
|
|
|
+ <v-list-item-title v-text="item.title"></v-list-item-title>
|
|
|
+ </v-list-item-content>
|
|
|
+ <v-list-item-action>
|
|
|
+ <v-btn
|
|
|
+ text
|
|
|
+ color="primary"
|
|
|
+ :disabled="item.performanceSolutionId === clickId"
|
|
|
+ @click.stop="onClick(item)"
|
|
|
+ >
|
|
|
+ 查看方案
|
|
|
+ </v-btn>
|
|
|
+ </v-list-item-action>
|
|
|
+ </v-list-item>
|
|
|
+ </v-list>
|
|
|
+ </v-card>
|
|
|
+ <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>
|
|
|
+ </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>
|
|
|
+ <div class="mt-3">
|
|
|
+ <v-textarea
|
|
|
+ v-model="code"
|
|
|
+ outlined
|
|
|
+ hide-details
|
|
|
+ label="请输入执行代码"
|
|
|
+ dense
|
|
|
+ ></v-textarea>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </v-card>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import NonePage from '@/components/Common/empty.vue'
|
|
|
+import axios from 'axios'
|
|
|
+export default {
|
|
|
+ name: 'editPage',
|
|
|
+ components: {
|
|
|
+ NonePage
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ loading: false,
|
|
|
+ items: [],
|
|
|
+ rulesItems: [],
|
|
|
+ active: 0,
|
|
|
+ tab: 0,
|
|
|
+ panelActive: [],
|
|
|
+ clickItem: null,
|
|
|
+ clickId: null
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ruleItem () {
|
|
|
+ if (!this.clickItem) {
|
|
|
+ return {
|
|
|
+ calculateFormulas: [],
|
|
|
+ calculateConfigurations: []
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return this.clickItem[this.active]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created () {
|
|
|
+ this.init()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async init () {
|
|
|
+ try {
|
|
|
+ this.loading = true
|
|
|
+ const { data } = await this.fetchData('/op/base/performance/solution/page', {
|
|
|
+ page: {
|
|
|
+ size: 999,
|
|
|
+ current: 1
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.items = data.records.map(e => e.entity)
|
|
|
+ } catch (err) {
|
|
|
+ this.items = []
|
|
|
+ this.$snackbar.error(err)
|
|
|
+ } finally {
|
|
|
+ this.loading = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fetchData (url, params) {
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ axios.post(url, params, { // 配置对象
|
|
|
+ headers: {
|
|
|
+ 'Content-Type': 'application/json'
|
|
|
+ },
|
|
|
+ timeout: 5000, // 超时时间(毫秒)
|
|
|
+ responseType: 'json' // 响应数据类型
|
|
|
+ }).then(res => {
|
|
|
+ const { data } = res
|
|
|
+ if (data.code !== 20000) {
|
|
|
+ reject(data.message)
|
|
|
+ return
|
|
|
+ }
|
|
|
+ resolve(data)
|
|
|
+ }).catch(reject)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ async onClick (e) {
|
|
|
+ this.loading = true
|
|
|
+ try {
|
|
|
+ const { data } = await this.fetchData('/op/base/performance/solution/detail', {
|
|
|
+ performanceSolutionId: e.performanceSolutionId
|
|
|
+ })
|
|
|
+ this.clickId = data.entity.performanceSolutionId
|
|
|
+ this.clickItem = data.performanceSolutionDetailRespCategoryVos
|
|
|
+ } catch (error) {
|
|
|
+ this.$snackbar.error(error)
|
|
|
+ } finally {
|
|
|
+ this.loading = false
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.fullscreen {
|
|
|
+ height: 100%;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+.fullHeight {
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+.width-auto {
|
|
|
+ width: 0;
|
|
|
+ flex: 1;
|
|
|
+}
|
|
|
+.height-auto {
|
|
|
+ height: 0;
|
|
|
+ flex: 1;
|
|
|
+}
|
|
|
+</style>
|
zhengnaiwen_citu