wans

src/views/test/modules/Component.vue

@@ -9,11 +9,13 @@
       <a-textarea v-if="detail.type==='textarea'" v-bind="detail.attrs" v-decorator="[detail.value, { rules: [{ required: detail.required, message: detail.attrs.placeholder}] }]" />
       <!-- 下拉框 -->
       <a-select v-if="detail.type==='select'" v-bind="detail.attrs" v-decorator="[detail.value, { rules: [{ required: detail.required, message: detail.attrs.placeholder}] }]" >
-        <a-select-option v-for="item in detail.options" :value="item.value" :key="item.value">
+        <!-- <a-select-option v-for="item in detail.options" :value="item.value" :key="item.value">
           {{ item.label }}
-        </a-select-option>
+        </a-select-option> -->
       </a-select>
       <!-- 日期时间 -->
+      <a-date-picker v-if="detail.type==='date'" v-bind="detail.attrs" v-decorator="[detail.value, { rules: [{ required: detail.required, message: detail.attrs.placeholder}] }]" />
+      <!-- 单选框 -->
       <!-- 文件上传 -->
       <!-- 图片上传 -->
     </a-form-item>

src/views/test/modules/Detail.vue

@@ -6,6 +6,7 @@
     :active-tab-key="selectKey"
     @tabChange="onTabChange">
     <a-form
+      v-show="model.id"
       size="small"
       v-if="selectKey === '0'">
       <a-form-item label="标题">
@@ -53,12 +54,12 @@
       <template v-if="model.type === 'select'">
         <a-form-item label="选项">
           <VueDraggable
-            v-model="model.options"
+            v-model="model.attrs.options"
             :animation="150"
             handle=".handle"
           >
             <div
-              v-for="(item, index) in model.options"
+              v-for="(item, index) in model.attrs.options"
               :key="index"
               class="options"
             >
@@ -75,6 +76,15 @@
           <a-button @click="addOption" style="width:100%"><a-icon type="plus" /></a-button>
         </a-form-item>
       </template>
+      <a-popconfirm
+        title="确定删除该组件?"
+        ok-text="确定"
+        cancel-text="取消"
+        @confirm="deleteModel"
+      >
+        <a-button type="danger" style="width:100%">删除</a-button>
+      </a-popconfirm>
+
     </a-form>
     <a-form
       size="small"
@@ -133,13 +143,16 @@ export default {
       this.config = config
     },
     addOption () {
-      this.model.options.push({
-        label: '选项' + (this.model.options.length + 1),
-        value: 'newValue' + (this.model.options.length + 1)
+      this.model.attrs.options.push({
+        label: '选项' + (this.model.attrs.options.length + 1),
+        value: 'newValue' + (this.model.attrs.options.length + 1)
       })
     },
     deleteOption (i) {
-      this.model.options.splice(i, 1)
+      this.model.attrs.options.splice(i, 1)
+    },
+    deleteModel () {
+
     },
     onTabChange (key) {
       this.selectKey = key

src/views/test/modules/components.js

@@ -46,21 +46,21 @@ export const componentList = [
     dependentId: false,
     required: true,
     label: '下拉框',
-    options: [
-      {
-        label: '选项1',
-        value: '1'
-      },
-      {
-        label: '选项2',
-        value: '2'
-      },
-      {
-        label: '选项3',
-        value: '3'
-      }
-    ],
     attrs: {
+      options: [
+        {
+          label: '选项1',
+          value: '1'
+        },
+        {
+          label: '选项2',
+          value: '2'
+        },
+        {
+          label: '选项3',
+          value: '3'
+        }
+      ],
       placeholder: '请输入'
     }
   },