赋能场景挂接增加能力输入

2022-07-18 13:53:01 +08:00 · 2022-07-18 13:53:01 +08:00 · ddd3d89a14
parent 2d12bf76d4
commit ddd3d89a14
3 changed files with 112 additions and 42 deletions
--- a/back/src/views/modules/ability/IntegratedServices-add.vue
+++ b/back/src/views/modules/ability/IntegratedServices-add.vue
@ -483,7 +483,6 @@ export default {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 32px;
-  background: pink;
  width: 120px;
 }

--- a/back/src/views/modules/ability/assignedScene/add-update-scene.vue
+++ b/back/src/views/modules/ability/assignedScene/add-update-scene.vue
@ -31,7 +31,8 @@
              基本信息
            </div>
            <el-form-item label="名称" prop="name">
-              <el-input v-model="dataForm.name" placeholder="请输入名称" :disabled="modalType === 'display'" style="width:90%"></el-input>
+              <el-input v-model="dataForm.name" placeholder="请输入名称" :disabled="modalType === 'display'"
+                style="width:90%"></el-input>
            </el-form-item>
            <el-form-item label="描述" prop="description">
              <el-input type="textarea" :rows="3" v-model="dataForm.description" placeholder="请输入描述" style="width:90%"
@ -46,6 +47,13 @@
            </integrated-combine-ability>
          </div>

+          <!-- 更多能力 -->
+          <div class="" style="marigin-bottom:40px" v-show="checkList.includes('更多能力')">
+            <common-question :dataForm="dataForm" @update="updateDataForm" ref="commonQuestion" title="更多能力"
+              :keyTextObj="moreKeyTextObj">
+            </common-question>
+          </div>
+
          <!-- 使用步骤 -->
          <div style="marigin-bottom:20px" v-show="checkList.includes('使用步骤')">
            <scene-use-step :dataForm="dataForm" @update="updateDataForm" :disabledType="modalType === 'display'"
@ -96,16 +104,28 @@ import qs from "qs";
 import SceneUseStep from '../components/scene-use-step.vue';
 import IntegratedCombineAbility from '../components/integrated-combine-ability.vue';
 import Cookies from 'js-cookie'
+import CommonQuestion from '../components/common-question.vue';

 export default {
  components: {
    SceneUseStep,
    IntegratedCombineAbility,
+    CommonQuestion,
  },
  data() {
    return {
      fileList: [],
      fileUploadUrl: `${window.SITE_CONFIG['apiURL']}/sys/oss/upload?token=${Cookies.get('ucsToken')}`,
+      moreKeyTextObj: {
+        nameObj: {
+          text: '能力名称',
+          key: 'name'
+        },
+        descObj: {
+          text: '能力描述',
+          key: 'description'
+        },
+      },
      dataForm: {
        "applicationArea": "",
        "description": "",
@ -113,7 +133,11 @@ export default {
          {
            "attrType": "使用步骤",
            "attrValue": [{ question: "", answer: "" }],
-          }
+          },
+          {
+            "attrType": "更多能力",
+            "attrValue": [{ name: "", description: "" }],
+          },
        ],
        "fuseResourceList": [
          {
@ -155,13 +179,18 @@ export default {
          key: 'combine',
          show: true,
        },
+        {
+          name: '更多能力',
+          key: 'more',
+          show: true,
+        },
        {
          name: '使用步骤',
          key: 'basic',
          show: true,
        },
      ],
-      checkList: ['基本信息', '关联能力', '使用步骤'],
+      checkList: ['基本信息', '关联能力', '更多能力', '使用步骤'],
      areaList: [],
      addOrUpdateVisibleCopy: this.addOrUpdateVisible,
      displayInfo: {
@ -170,7 +199,8 @@ export default {
      },
      displayListInfo: {
        '使用步骤': [],
-        '关联能力': []
+        '关联能力': [],
+        '更多能力': [],
      },
      modalTypeText: {
        add: '挂接',
@ -216,16 +246,26 @@ export default {
    },
    // 更新表单
    updateDataForm(data) {
-      if (data.title == '使用步骤') {
+      if (data.title == '关联能力') {
+        this.dataForm.fuseResourceList = data.list
+      } else {
+        // 更多能力、使用步骤
+        this.operateFuseAttrList(data.title, data)
+      }
+    },
+    operateFuseAttrList(title, data) {
+      if (this.dataForm.fuseAttrList.every(v => v.attrType !== title)) {
+        this.dataForm.fuseAttrList.push({
+          'attrType': title,
+          'attrValue': JSON.stringify(data.list)
+        })
+      } else {
        this.dataForm.fuseAttrList.map(v => {
-          if (v.attrType === '使用步骤') {
+          if (v.attrType === title) {
            v.attrValue = JSON.stringify(data.list)
          }
        })
      }
-      if (data.title == '关联能力') {
-        this.dataForm.fuseResourceList = data.list
-      }
    },
    // 改变按钮状态
    changeBtn(data) {
@ -281,28 +321,30 @@ export default {
      this.$nextTick(() => {
        this.$refs.combineAbility && this.$refs.combineAbility.getDataInfo(data)
        this.$refs.sceneUseUp && this.$refs.sceneUseUp.getDataInfo(data)
+        this.$refs.commonQuestion && this.$refs.commonQuestion.getDataInfo(data)
        console.log('this.dataForm----详情-------->', this.dataForm);
      })
    },
    // 重组数据
-    getDisPlayData() {
-      this.$nextTick(() => {
-        const questionObj = this.dataForm.fuseAttrList.find(v => v.attrType == '使用步骤') || {};
-        let fuseResourceList = this.dataForm.fuseResourceList || [];
-        let arr = []
-        fuseResourceList.map(v => {
-          if (v.resource) {
-            arr.push({
-              name: v.resource.name,
-              type: v.resource.type,
-            })
-          }
-        })
-        this.displayListInfo['使用步骤'] = JSON.parse(questionObj.attrValue || '[]')
-        this.displayListInfo['关联能力'] = arr
-      })
-
-    },
+    // getDisPlayData() {
+    //   this.$nextTick(() => {
+    //     const stepObj = this.dataForm.fuseAttrList.find(v => v.attrType == '使用步骤') || {};
+    //     const moreObj = this.dataForm.fuseAttrList.find(v => v.attrType == '更多能力') || {};
+    //     let fuseResourceList = this.dataForm.fuseResourceList || [];
+    //     let arr = []
+    //     fuseResourceList.map(v => {
+    //       if (v.resource) {
+    //         arr.push({
+    //           name: v.resource.name,
+    //           type: v.resource.type,
+    //         })
+    //       }
+    //     })
+    //     this.displayListInfo['使用步骤'] = JSON.parse(stepObj.attrValue || '[]')
+    //     this.displayListInfo['更多能力'] = JSON.parse(moreObj.attrValue || '[]')
+    //     this.displayListInfo['关联能力'] = arr
+    //   })
+    // },
  },
  beforeDestroy() {
    this.clearForm()
@ -403,7 +445,6 @@ export default {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 32px;
-  background: pink;
  width: 120px;
 }

--- a/back/src/views/modules/ability/components/common-question.vue
+++ b/back/src/views/modules/ability/components/common-question.vue
@ -1,14 +1,17 @@
 <template>
    <div class="question-box">
        <div class="title">
-            常见问题
+            {{ title }}
        </div>
        <div v-for="(item, index) in dataInfo" :key="index">
-            <el-form-item label="问题名称" prop="question">
-                <el-input v-model="item.question" placeholder="请输入问题名称" style="width:90%"></el-input>
+            <el-form-item :label="keyTextObj.nameObj.text">
+                <el-input v-model="item[keyTextObj.nameObj.key]" :placeholder="`请输入${keyTextObj.nameObj.text}`"
+                    style="width:90%">
+                </el-input>
            </el-form-item>
-            <el-form-item label="问题描述" prop="question">
-                <el-input type="textarea" :rows="2" v-model="item.answer" placeholder="请输入问题描述" style="width:90%">
+            <el-form-item :label="keyTextObj.descObj.text">
+                <el-input type="textarea" :rows="2" v-model="item[keyTextObj.descObj.key]"
+                    :placeholder="`请输入${keyTextObj.descObj.text}`" style="width:90%">
                </el-input>
                <el-button style="margin-left:10px" @click="deleteItem(index)" type="danger" size="small"
                    v-if="dataInfo.length > 1">删除
@ -26,6 +29,25 @@ export default {
        dataForm: {
            type: Object,
            default: () => { }
+        },
+        title: {
+            type: String,
+            default: '常见问题'
+        },
+        keyTextObj: {
+            type: Object,
+            default: () => {
+                return {
+                    nameObj: {
+                        text: '问题名称',
+                        key: 'question'
+                    },
+                    descObj: {
+                        text: '问题描述',
+                        key: 'answer'
+                    },
+                }
+            }
        }
    },
    data() {
@ -38,7 +60,7 @@ export default {
            handler(newVal) {
                this.dataInfo = newVal;
                this.$emit('update', {
-                    title: '常见问题',
+                    title: this.title,
                    list: newVal
                })
            },
@ -51,21 +73,29 @@ export default {
            let arr = []
            if (dataForm && (dataForm.id || dataForm.id === 0)) {
                let fuseAttrList = dataForm.fuseAttrList || [];
-                let obj = fuseAttrList.find(v => v.attrType === '常见问题') || {}
+                let obj = fuseAttrList.find(v => v.attrType === this.title) || {}
                let attrValue = JSON.parse(obj.attrValue || "[]")
                if (attrValue.length > 0) {
                    attrValue.map(v => {
                        arr.push({
-                            question: v.question,
-                            answer: v.answer,
+                            [this.keyTextObj.nameObj.key]: v[this.keyTextObj.nameObj.key],
+                            [this.keyTextObj.descObj.key]: v[this.keyTextObj.descObj.key],
                        })
                    })
+                } else {
+                    arr = []
+                    console.log('this.keyTextObj.nameObj.key------------>', this.keyTextObj.nameObj.key);
+                    arr.push({
+                        [this.keyTextObj.nameObj.key]: '',
+                        [this.keyTextObj.descObj.key]: '',
+                    })
                }
            } else {
                arr = []
+                console.log('this.keyTextObj.nameObj.key------------>', this.keyTextObj.nameObj.key);
                arr.push({
-                    question: "",
-                    answer: "",
+                    [this.keyTextObj.nameObj.key]: '',
+                    [this.keyTextObj.descObj.key]: '',
                })
            }
            this.dataInfo = arr;
@ -73,8 +103,8 @@ export default {
        // 新增
        addItem() {
            this.dataInfo.push({
-                question: "",
-                answer: "",
+                [this.keyTextObj.nameObj.key]: '',
+                [this.keyTextObj.descObj.key]: '',
            })
        },
        // 删除