更新

src/views/test/detail.vue

@@ -1,33 +1,59 @@
 <template>
-  <div id="index">
+  <div id="detail">
     <el-row>
       <el-col :span="24" class="index">
         <el-col :span="24" class="top">
           <topInfo :topTitle="pageTitle"></topInfo>
         </el-col>
+        <el-col :span="24" class="main">
+          <data-form :fields="fields" :data="form" :rules="rules" @save="drawerSave" :isNew="drawerIsNew"></data-form>
+        </el-col>
       </el-col>
     </el-row>
   </div>
 </template>
+
 <script>
 import topInfo from '@/layout/public/top.vue';
-
-import { mapActions, mapState, createNamespacedHelpers } from 'vuex';
+import dataForm from '@/components/form.vue';
+import { mapState, createNamespacedHelpers } from 'vuex';
 
 export default {
-  name: 'index',
+  name: 'detail',
   props: {},
   components: {
     topInfo,
+    dataForm,
+  },
+  data: function() {
+    return {
+      drawerIsNew: true,
+      form: {},
+      fields: [
+        { label: '机构代码或邀请码', prop: 'code', model: 'code' },
+        { label: '姓名', prop: 'name', model: 'name' },
+        { label: '机构名称', prop: 'deptname', model: 'deptname' },
+        { label: '手机号', prop: 'phone', model: 'phone' },
+        { label: '密码', prop: 'password', model: 'password', type: 'password' },
+      ],
+      rules: {
+        code: [{ required: true, message: '请输入推荐码' }],
+      },
+    };
   },
-  data: () => ({
-    list: [],
-    total: 0,
-  }),
   created() {},
-  methods: {},
+  methods: {
+    async search() {},
+    // 创建&修改
+    async drawerSave({ data, isNew }) {},
+  },
   computed: {
-    ...mapState(['user']),
+    id() {
+      return this.$route.query.id;
+    },
+    isNew() {
+      return this.$route.query.id ? false : true;
+    },
     pageTitle() {
       return `${this.$route.meta.title}`;
     },
@@ -35,12 +61,17 @@ export default {
   metaInfo() {
     return { title: this.$route.meta.title };
   },
+  watch: {
+    isNew: {
+      handler(val) {
+        if (!val) {
+          this.search();
+        }
+      },
+      immediate: true,
+    },
+  },
 };
 </script>
-<style lang="less" scoped>
-.add {
-  height: 40px;
-  line-height: 40px;
-  padding: 0 15px;
-}
-</style>
+
+<style lang="less" scoped></style>