feat: update form to 1.1.10

package.json

@@ -9,7 +9,7 @@
   },
   "dependencies": {
     "@antv/data-set": "^0.10.1",
-    "ant-design-vue": "^1.1.10-beta",
+    "ant-design-vue": "^1.1.10",
     "axios": "^0.18.0",
     "dayjs": "^1.7.5",
     "enquire.js": "^2.1.6",

src/views/form/BasicForm.vue

@@ -6,10 +6,10 @@
         :labelCol="{lg: {span: 7}, sm: {span: 7}}"
         :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
         <a-input
-          v-decorator="{
-            id: 'name',
-            options: {rules: [{ required: true, message: '请输入标题' }]}
-          }"
+          v-decorator="[
+            'name',
+            {rules: [{ required: true, message: '请输入标题' }]}
+          ]"
           name="name"
           placeholder="给目标起个名字" />
       </a-form-item>
@@ -20,34 +20,34 @@
         <a-range-picker
           name="buildTime"
           style="width: 100%"
-          v-decorator="{
-            id: 'buildTime',
-            options: {rules: [{ required: true, message: '请选择起止日期' }]}
-          }" />
+          v-decorator="[
+            'buildTime',
+            {rules: [{ required: true, message: '请选择起止日期' }]}
+          ]" />
       </a-form-item>
       <a-form-item
         label="目标描述"
         :labelCol="{lg: {span: 7}, sm: {span: 7}}"
         :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
         <a-textarea
-          v-decorator="{
-            id: 'description',
-            options: {rules: [{ required: true, message: '请输入目标描述' }]}
-          }"
           rows="4"
-          placeholder="请输入你阶段性工作目标" />
+          placeholder="请输入你阶段性工作目标"
+          v-decorator="[
+            'description',
+            {rules: [{ required: true, message: '请输入目标描述' }]}
+          ]" />
       </a-form-item>
       <a-form-item
         label="衡量标准"
         :labelCol="{lg: {span: 7}, sm: {span: 7}}"
         :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
         <a-textarea
-          v-decorator="{
-            id: 'type',
-            options: {rules: [{ required: true, message: '请输入衡量标准' }]}
-          }"
           rows="4"
-          placeholder="请输入衡量标准" />
+          placeholder="请输入衡量标准"
+          v-decorator="[
+            'type',
+            {rules: [{ required: true, message: '请输入衡量标准' }]}
+          ]" />
       </a-form-item>
       <a-form-item
         label="客户"
@@ -55,10 +55,10 @@
         :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
         <a-input 
           placeholder="请描述你服务的客户，内部客户直接 @姓名／工号"
-          v-decorator="{
-            id: 'customer',
-            options: {rules: [{ required: true, message: '请描述你服务的客户' }]}
-          }" />
+          v-decorator="[
+            'customer',
+            {rules: [{ required: true, message: '请描述你服务的客户' }]}
+          ]" />
       </a-form-item>
       <a-form-item
         label="邀评人"

src/views/form/advancedForm/AdvancedForm.vue

@@ -38,7 +38,7 @@
               <span v-else>
                 <a @click="saveRow(record.key)">保存</a>
                 <a-divider type="vertical" />
-                <a @click="cancle(record.key)">取消</a>
+                <a @click="cancel(record.key)">取消</a>
               </span>
             </template>
             <span v-else>
@@ -50,7 +50,7 @@
             </span>
           </template>
         </a-table>
-        <a-button style="width: 100%; margin-top: 16px; margin-bottom: 8px" type="dashed" icon="plus" @click="newMeber">新增成员</a-button>
+        <a-button style="width: 100%; margin-top: 16px; margin-bottom: 8px" type="dashed" icon="plus" @click="newMember">新增成员</a-button>
       </form>
     </a-card>
 
@@ -136,7 +136,7 @@
       handleSubmit (e) {
         e.preventDefault()
       },
-      newMeber () {
+      newMember () {
         this.data.push({
           key: '-1',
           name: '',
@@ -163,7 +163,7 @@
         const data = this.data
         return (newData || data).filter(item => item.key === key)[0]
       },
-      cancle (key) {
+      cancel (key) {
         let target = this.data.filter(item => item.key === key)[0]
         target.editable = false
       },

src/views/form/advancedForm/RepositoryForm.vue

@@ -1,111 +1,119 @@
-<template>
-  <a-form @submit="handleSubmit" :autoFormCreate="(form) => this.form = form" class="form">
-    <a-row class="form-row" :gutter="16">
-      <a-col :lg="6" :md="12" :sm="24">
-        <a-form-item
-          label="仓库名"
-          fieldDecoratorId="repository.name"
-          :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入仓库名称', whitespace: true}]}"
-        >
-          <a-input placeholder="请输入仓库名称" />
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-        <a-form-item
-          label="仓库域名"
-          fieldDecoratorId="repository.domain"
-          :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入仓库域名', whitespace: true}, {validator: validate}]}"
-        >
-          <a-input addonBefore="http://" addonAfter=".com" placeholder="请输入"/>
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-        <a-form-item
-          label="仓库管理员"
-          fieldDecoratorId="repository.manager"
-          :fieldDecoratorOptions="{rules: [{ required: true, message: '请选择管理员'}]}"
-        >
-          <a-select placeholder="请选择管理员">
-            <a-select-option value="王同学">王同学</a-select-option>
-            <a-select-option value="李同学">李同学</a-select-option>
-            <a-select-option value="黄同学">黄同学</a-select-option>
-          </a-select>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-row class="form-row" :gutter="16">
-      <a-col :lg="6" :md="12" :sm="24">
-        <a-form-item
-          label="审批人"
-          fieldDecoratorId="repository.auditor"
-          :fieldDecoratorOptions="{rules: [{ required: true, message: '请选择审批员'}]}"
-        >
-          <a-select placeholder="请选择审批员">
-            <a-select-option value="王晓丽">王晓丽</a-select-option>
-            <a-select-option value="李军">李军</a-select-option>
-          </a-select>
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-        <a-form-item
-          label="生效日期"
-          fieldDecoratorId="repository.effectiveDate"
-          :fieldDecoratorOptions="{rules: [{ required: true, message: '请选择生效日期'}]}"
-        >
-          <a-range-picker style="width: 100%" />
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-        <a-form-item
-          label="仓库类型"
-          fieldDecoratorId="repository.type"
-          :fieldDecoratorOptions="{rules: [{ required: true, message: '请选择仓库类型'}]}"
-        >
-          <a-select placeholder="请选择仓库类型">
-            <a-select-option value="公开">公开</a-select-option>
-            <a-select-option value="私密">私密</a-select-option>
-          </a-select>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-form-item v-if="showSubmit">
-      <a-button htmlType="submit" >Submit</a-button>
-    </a-form-item>
-  </a-form>
-</template>
-
-<script>
-  export default {
-    name: "RepositoryForm",
-    props: {
-      showSubmit: {
-        type: Boolean,
-        default: false
-      }
-    },
-    methods: {
-      handleSubmit (e) {
-        e.preventDefault()
-        this.form.validateFields((err, values) => {
-          if (!err) {
-            this.$notification['error']({
-              message: 'Received values of form:',
-              description: values
-            })
-          }
-        })
-      },
-      validate (rule, value, callback) {
-        const regex = /^user-(.*)$/
-        if (!regex.test(value)) {
-          callback('需要以 user- 开头')
-        }
-        callback()
-      }
-    }
-  }
-</script>
-
-<style scoped>
-
+<template>
+  <a-form @submit="handleSubmit" :form="form" class="form">
+    <a-row class="form-row" :gutter="16">
+      <a-col :lg="6" :md="12" :sm="24">
+        <a-form-item label="仓库名">
+          <a-input
+            placeholder="请输入仓库名称"
+            v-decorator="[
+              'repository.name',
+              {rules: [{ required: true, message: '请输入仓库名称', whitespace: true}]}
+            ]" />
+        </a-form-item>
+      </a-col>
+      <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
+        <a-form-item
+          label="仓库域名">
+          <a-input
+            addonBefore="http://"
+            addonAfter=".com"
+            placeholder="请输入"
+            v-decorator="[
+              'repository.domain',
+              {rules: [{ required: true, message: '请输入仓库域名', whitespace: true}, {validator: validate}]}
+            ]" />
+        </a-form-item>
+      </a-col>
+      <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
+        <a-form-item
+          label="仓库管理员">
+          <a-select placeholder="请选择管理员" v-decorator="[ 'repository.manager', {rules: [{ required: true, message: '请选择管理员'}]} ]">
+            <a-select-option value="王同学">王同学</a-select-option>
+            <a-select-option value="李同学">李同学</a-select-option>
+            <a-select-option value="黄同学">黄同学</a-select-option>
+          </a-select>
+        </a-form-item>
+      </a-col>
+    </a-row>
+    <a-row class="form-row" :gutter="16">
+      <a-col :lg="6" :md="12" :sm="24">
+        <a-form-item
+          label="审批人">
+          <a-select placeholder="请选择审批员" v-decorator="[ 'repository.auditor', {rules: [{ required: true, message: '请选择审批员'}]} ]">
+            <a-select-option value="王晓丽">王晓丽</a-select-option>
+            <a-select-option value="李军">李军</a-select-option>
+          </a-select>
+        </a-form-item>
+      </a-col>
+      <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
+        <a-form-item
+          label="生效日期">
+          <a-range-picker
+            style="width: 100%"
+            v-decorator="[
+              'repository.effectiveDate',
+              {rules: [{ required: true, message: '请选择生效日期'}]}
+            ]" />
+        </a-form-item>
+      </a-col>
+      <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
+        <a-form-item
+          label="仓库类型">
+          <a-select
+            placeholder="请选择仓库类型"
+            v-decorator="[
+              'repository.type',
+              {rules: [{ required: true, message: '请选择仓库类型'}]}
+            ]" >
+            <a-select-option value="公开">公开</a-select-option>
+            <a-select-option value="私密">私密</a-select-option>
+          </a-select>
+        </a-form-item>
+      </a-col>
+    </a-row>
+    <a-form-item v-if="showSubmit">
+      <a-button htmlType="submit" >Submit</a-button>
+    </a-form-item>
+  </a-form>
+</template>
+
+<script>
+  export default {
+    name: "RepositoryForm",
+    props: {
+      showSubmit: {
+        type: Boolean,
+        default: false
+      }
+    },
+    data () {
+      return {
+        form: this.$form.createForm(this)
+      }
+    },
+    methods: {
+      handleSubmit (e) {
+        e.preventDefault()
+        this.form.validateFields((err, values) => {
+          if (!err) {
+            this.$notification['error']({
+              message: 'Received values of form:',
+              description: values
+            })
+          }
+        })
+      },
+      validate (rule, value, callback) {
+        const regex = /^user-(.*)$/
+        if (!regex.test(value)) {
+          callback('需要以 user- 开头')
+        }
+        callback()
+      }
+    }
+  }
+</script>
+
+<style scoped>
+
 </style>

src/views/form/advancedForm/TaskForm.vue

@@ -1,103 +1,107 @@
-<template>
-  <a-form @submit="handleSubmit" :autoFormCreate="(form) => this.form = form" class="form">
-    <a-row class="form-row" :gutter="16">
-      <a-col :lg="6" :md="12" :sm="24">
-        <a-form-item
-          label="任务名"
-          fieldDecoratorId="task.name"
-          :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入任务名称', whitespace: true}]}"
-        >
-          <a-input placeholder="请输入任务名称" />
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-        <a-form-item
-          label="任务描述"
-          fieldDecoratorId="task.description"
-          :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入任务描述', whitespace: true}]}"
-        >
-          <a-input placeholder="请输入任务描述"/>
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-        <a-form-item
-          label="执行人"
-          fieldDecoratorId="task.executor"
-          :fieldDecoratorOptions="{rules: [{ required: true, message: '请选择执行人'}]}"
-        >
-          <a-select placeholder="请选择执行人">
-            <a-select-option value="黄丽丽">黄丽丽</a-select-option>
-            <a-select-option value="李大刀">李大刀</a-select-option>
-          </a-select>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-row class="form-row" :gutter="16">
-      <a-col :lg="6" :md="12" :sm="24">
-        <a-form-item
-          label="责任人"
-          fieldDecoratorId="task.manager"
-          :fieldDecoratorOptions="{rules: [{ required: true, message: '请选择责任人'}]}"
-        >
-          <a-select placeholder="请选择责任人">
-            <a-select-option value="王伟">王伟</a-select-option>
-            <a-select-option value="李红军">李红军</a-select-option>
-          </a-select>
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
-        <a-form-item
-          label="提醒时间"
-          fieldDecoratorId="task.time"
-          :fieldDecoratorOptions="{rules: [{ required: true, message: '请选择提醒时间'}]}"
-        >
-          <a-time-picker style="width: 100%" />
-        </a-form-item>
-      </a-col>
-      <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
-        <a-form-item
-          label="任务类型"
-          fieldDecoratorId="task.type"
-          :fieldDecoratorOptions="{rules: [{ required: true, message: '请选择任务类型'}]}"
-        >
-          <a-select placeholder="请选择任务类型">
-            <a-select-option value="定时执行">定时执行</a-select-option>
-            <a-select-option value="周期执行">周期执行</a-select-option>
-          </a-select>
-        </a-form-item>
-      </a-col>
-    </a-row>
-    <a-form-item v-if="showSubmit">
-      <a-button htmlType="submit" >Submit</a-button>
-    </a-form-item>
-  </a-form>
-</template>
-
-<script>
-  export default {
-    name: "TaskForm",
-    props: {
-      showSubmit: {
-        type: Boolean,
-        default: false
-      }
-    },
-    methods: {
-      handleSubmit (e) {
-        e.preventDefault()
-        this.form.validateFields((err, values) => {
-          if (!err) {
-            this.$notification['error']({
-              message: 'Received values of form:',
-              description: values
-            })
-          }
-        })
-      }
-    }
-  }
-</script>
-
-<style scoped>
-
+<template>
+  <a-form @submit="handleSubmit" :form="form" class="form">
+    <a-row class="form-row" :gutter="16">
+      <a-col :lg="6" :md="12" :sm="24">
+        <a-form-item
+          label="任务名">
+          <a-input placeholder="请输入任务名称" v-decorator="[ 'task.name', {rules: [{ required: true, message: '请输入任务名称', whitespace: true}]} ]" />
+        </a-form-item>
+      </a-col>
+      <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
+        <a-form-item
+          label="任务描述">
+          <a-input placeholder="请输入任务描述" v-decorator="[ 'task.description', {rules: [{ required: true, message: '请输入任务描述', whitespace: true}]} ]" />
+        </a-form-item>
+      </a-col>
+      <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
+        <a-form-item
+          label="执行人">
+          <a-select
+            placeholder="请选择执行人"
+            v-decorator="[
+              'task.executor',
+              {rules: [{ required: true, message: '请选择执行人'}]}
+            ]" >
+            <a-select-option value="黄丽丽">黄丽丽</a-select-option>
+            <a-select-option value="李大刀">李大刀</a-select-option>
+          </a-select>
+        </a-form-item>
+      </a-col>
+    </a-row>
+    <a-row class="form-row" :gutter="16">
+      <a-col :lg="6" :md="12" :sm="24">
+        <a-form-item
+          label="责任人">
+          <a-select
+            placeholder="请选择责任人"
+            v-decorator="[
+              'task.manager',
+              {rules: [{ required: true, message: '请选择责任人'}]}
+            ]" >
+            <a-select-option value="王伟">王伟</a-select-option>
+            <a-select-option value="李红军">李红军</a-select-option>
+          </a-select>
+        </a-form-item>
+      </a-col>
+      <a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
+        <a-form-item
+          label="提醒时间">
+          <a-time-picker
+            style="width: 100%"
+            v-decorator="[
+              'task.time',
+              {rules: [{ required: true, message: '请选择提醒时间'}]}
+            ]" />
+        </a-form-item>
+      </a-col>
+      <a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
+        <a-form-item
+          label="任务类型">
+          <a-select
+            placeholder="请选择任务类型"
+            v-decorator="[ 'task.type', {rules: [{ required: true, message: '请选择任务类型'}]} ]" >
+            <a-select-option value="定时执行">定时执行</a-select-option>
+            <a-select-option value="周期执行">周期执行</a-select-option>
+          </a-select>
+        </a-form-item>
+      </a-col>
+    </a-row>
+    <a-form-item v-if="showSubmit">
+      <a-button htmlType="submit" >Submit</a-button>
+    </a-form-item>
+  </a-form>
+</template>
+
+<script>
+  export default {
+    name: "TaskForm",
+    props: {
+      showSubmit: {
+        type: Boolean,
+        default: false
+      }
+    },
+    data () {
+      return {
+        form: this.$form.createForm(this)
+      }
+    },
+    methods: {
+      handleSubmit (e) {
+        e.preventDefault()
+        this.form.validateFields((err, values) => {
+          if (!err) {
+            this.$notification['error']({
+              message: 'Received values of form:',
+              description: values
+            })
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style scoped>
+
 </style>

src/views/form/stepForm/Step3.vue

@@ -22,7 +22,7 @@
         </div>
         <div slot="action">
           <a-button type="primary" @click="finish">再转一笔</a-button>
-          <a-button style="margin-left: 8px">查看账单</a-button>
+          <a-button style="margin-left: 8px" @click="toOrderList">查看账单</a-button>
         </div>
       </result>
     </a-form>
@@ -45,6 +45,9 @@
     methods: {
       finish () {
         this.$emit('finish')
+      },
+      toOrderList () {
+        this.$router.push('/list/query-list')
       }
     }
   }

yarn.lock

@@ -1366,10 +1366,10 @@ ansi-styles@^3.2.0, ansi-styles@^3.2.1:
   dependencies:
     color-convert "^1.9.0"
 
-ant-design-vue@^1.1.10-beta:
-  version "1.1.10-beta"
-  resolved "https://registry.yarnpkg.com/ant-design-vue/-/ant-design-vue-1.1.10-beta.tgz#6f0aeb3db2d512de8ab447a74ab7e51d39fcd434"
-  integrity sha512-Vj5y9RCCpKkGCsRVqUaXighvEfAAMkQlir+uBCO08FgfBWM73Q8NYJ8RSehpt55ucdb3RE1fHmowzio3p6glnQ==
+ant-design-vue@^1.1.10:
+  version "1.1.10"
+  resolved "https://registry.yarnpkg.com/ant-design-vue/-/ant-design-vue-1.1.10.tgz#b9ebcbab6dc72e0576920f8dc3fe7498e9d4bf61"
+  integrity sha512-NJefmFr1WZO6HQVtENDyIquTYMx+3NLKgQdb0PY/U1+VYfnCw21TBl3eOLJTFDC7YKamnCH3pz0Ok0OKr7IVfw==
   dependencies:
     add-dom-event-listener "^1.0.2"
     array-tree-filter "^2.1.0"
@@ -1392,7 +1392,7 @@ ant-design-vue@^1.1.10-beta:
     resize-observer-polyfill "^1.5.0"
     shallow-equal "^1.0.0"
     shallowequal "^1.0.2"
-    vue-ref "^1.0.2"
+    vue-ref "^1.0.3"
     warning "^3.0.0"
 
 anymatch@^2.0.0:
@@ -9056,10 +9056,10 @@ vue-ls@^3.2.0:
   resolved "https://registry.yarnpkg.com/vue-ls/-/vue-ls-3.2.0.tgz#33356ad3ec9c30dac203757cf4036abe4ff767b3"
   integrity sha512-39FGQMrT9NbG5WGDJfxWj19ZD1tsVoBBN1n8qvq6/+uRB9BansQ9NSyclQ9TzZatRkkM/VEQo5oTsijdM5hGFw==
 
-vue-ref@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/vue-ref/-/vue-ref-1.0.2.tgz#8822640ece91665f01e958bd1fde4038c75e0f34"
-  integrity sha512-VQ9/uWlELEaFO7Qws94BAvr83tx4H310nvE32PUaMgHwLqIFtE9tmvxA6G0dUdegUeOrWXSgkg2HGUpqSMjYPw==
+vue-ref@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/vue-ref/-/vue-ref-1.0.3.tgz#5b7bbfc6f5833e13f5a9155ac686fafdb03dbcad"
+  integrity sha512-6t9bwx6qJGKF+Mo6wEQWMzBAwx+h/oiEKuTC4+eiKzLdIRDPbbvTpsemWFsOKBOUwRGi6WKKqMzVQkkE8QcEfg==
 
 vue-router@^3.0.1:
   version "3.0.2"