lyf zidingyi

DAPlatform-front/src/components/ReleaseTask.vue

@@ -170,18 +170,33 @@
             <el-form-item label="模板名称" :label-width="formLabelWidth">
               <el-input v-model="form.name" autocomplete="off"></el-input>
             </el-form-item>
+            <input  v-model="mm"  placeholder="输入实体或属性">{{mm}}</input>
 <!--            树状结构-->
-            <div class="custom-tree-container">
-              <div class="block">
-                <el-tree
-                  :data="data"
-                  show-checkbox
-                  node-key="id"
-                  default-expand-all
-                  :expand-on-click-node="false"
-                  :render-content="renderContent">
-                </el-tree>
-              </div>
+            <div class="block">
+              <el-tree
+                :data="data"
+                show-checkbox
+                node-key="id"
+                default-expand-all
+                :expand-on-click-node="false">
+                <span class="custom-tree-node" slot-scope="{ node, data }">
+                  <span>{{ node.label }}</span>
+                  <span>
+                      <el-button
+                        type="text"
+                        size="mini"
+                        @click="() => append(data,mm)">
+                        Append
+                      </el-button>
+                      <el-button
+                        type="text"
+                        size="mini"
+                        @click="() => remove(node, data)">
+                        Delete
+                      </el-button>
+                   </span>
+                </span>
+              </el-tree>
             </div>
           </el-form>
           <div slot="footer" class="dialog-footer">
@@ -250,14 +265,15 @@
     align-items: center;
     justify-content: space-between;
     font-size: 14px;
-    padding-right: 8px;
+    padding-right: 2px;
+    height: 50px;
   }
 </style>
 <script>
     let id = 100;
     export default {
         data() {
-            const data = [{
+            var data = [{
                 id: 1,
                 label: '一级 1',
                 children: [{
@@ -293,6 +309,7 @@
                 }]
             }];
             return {
+                m:'好的撒',
                 dialogFormVisible: false,
                 form: {
                     name: '',
@@ -425,14 +442,20 @@
             change(e){
                 this.$forceUpdate();
             },
+            changeInput(e,a){
+                // input.focus();
+                //alert('111');
+                //alert(a);
+                this.$forceUpdate();
+            },
             handleClick(tab, event) {
                 console.log(tab, event);
             },
-            createModle(d){
+            createModle(m){
                 alert('111');
             },
-            append(data) {
-                const newChild = { id: id++, label: 'testtest', children: [] };
+            append(data,mm) {
+                const newChild = { id: id++, label: mm, children: [] };
                 if (!data.children) {
                     this.$set(data, 'children', []);
                 }
@@ -445,18 +468,6 @@
                 const index = children.findIndex(d => d.id === data.id);
                 children.splice(index, 1);
             },
-
-            renderContent(h, { node, data, store }) {
-                return (
-                    <span class="custom-tree-node">
-                    <span>{node.label}</span>
-                    <span>
-                    <el-button size="mini" type="text" on-click={ () => this.append(data) }>Add</el-button>
-                <el-button size="mini" type="text" on-click={ () => this.remove(node, data) }>Delete</el-button>
-                </span>
-                </span>);
-            },
-
             rePage(){
                 // alert("111");
                 dialogFormVisible :false;