更新

src/views/userManage/companyInfo/index.vue

@@ -0,0 +1,19 @@
+<template>
+  <div id="index">
+    <p>index</p>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'index',
+  props: {},
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="scss" scoped></style>

src/views/userManage/companyType/index.vue

@@ -1,6 +1,47 @@
 <template>
   <div id="index">
-    <p>index</p>
+    <el-row class="main">
+      <el-col :span="24" class="top">
+        <!-- <el-button><el-link href="./detail">添加</el-link></el-button> -->
+        <el-col :span="1" class="home">
+          <i class="el-icon-s-home"></i>
+        </el-col>
+        <el-col :span="23">
+          <el-breadcrumb separator-class="el-icon-arrow-right">
+            <el-breadcrumb-item :to="{ path: '/' }"> 我的主页</el-breadcrumb-item>
+            <el-breadcrumb-item>企业单位、管理类别</el-breadcrumb-item>
+          </el-breadcrumb>
+        </el-col>
+      </el-col>
+      <el-col :span="22" class="sousuo">
+        查询企业类别、名称 <el-input v-model="input" placeholder="请输入企业类别、名称" size="mini" style="width:200px"></el-input>
+
+        查询企业类别、编码<el-input v-model="input" placeholder="请输入企业类别、编码" size="mini" style="width:200px;margin-left: 10px"></el-input>
+        <el-button type="primary" icon="el-icon-search" @click="onSubmit" size="mini">查询</el-button>
+        <el-button type="success" icon="el-icon-check" @click="toadd()" size="mini">添加企业、单位类别</el-button>
+      </el-col>
+      <el-col :span="24" class="biaoge">
+        <el-table :data="tableData" style="width: 100%" border>
+          <el-table-column prop="name" label="类别名称" align="center"> </el-table-column>
+          <el-table-column prop="code" label="类别编码" align="center"> </el-table-column>
+          <el-table-column label="操作" width="180" align="center">
+            <el-button type="text" size="mini" icon="el-icon-edit" @click="onSubmit"></el-button>
+            <el-button type="text" size="mini" icon="el-icon-document" @click="onSubmit"></el-button>
+            <el-button type="text" size="mini" icon="el-icon-delete" @click="onSubmit"></el-button>
+          </el-table-column>
+        </el-table>
+        <el-col class="page" :span="24">
+          <el-pagination
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            :current-page="currentPage"
+            layout="total,  prev, pager, next, jumper"
+            :total="1"
+          >
+          </el-pagination>
+        </el-col>
+      </el-col>
+    </el-row>
   </div>
 </template>
 
@@ -9,11 +50,96 @@ export default {
   name: 'index',
   props: {},
   components: {},
-  data: () => ({}),
+  data: () => ({
+    currentPage: 1,
+    input: '',
+    formInline: {
+      card: '',
+      name: '',
+      region: '',
+    },
+    tableData: [
+      {
+        name: '',
+        code: '',
+      },
+      {
+        name: '王小虎',
+        code: '',
+      },
+    ],
+  }),
   created() {},
   computed: {},
-  methods: {},
+  methods: {
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+    },
+    toadd() {
+      this.$router.push({ path: './detail' });
+    },
+    onSubmit() {
+      console.log('submit!');
+    },
+    handleEdit(index, row) {
+      console.log(index, row);
+    },
+    handleDelete(index, row) {
+      console.log(index, row);
+    },
+  },
 };
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="less" scoped>
+.top {
+  height: 40px;
+  width: 100%;
+  border-bottom: 1px solid #e5e5e5;
+  background-color: #f5f5f5;
+}
+.home {
+  font-size: 15px;
+  padding: 10px 0px 0px 20px;
+}
+
+/deep/.el-breadcrumb {
+  font-size: 14px;
+  line-height: 3;
+}
+.sousuo {
+  height: 40px;
+  width: 100%;
+  padding: 0 20px;
+  font-size: 10px;
+  line-height: 40px;
+}
+.biaoge {
+  padding: 0 20px;
+}
+/deep/.el-input__inner {
+  border-radius: 0px;
+}
+
+.el-button {
+  border-radius: 0px;
+  margin: 0 0 0 10px;
+}
+
+/deep/.el-table__header tr,
+/deep/.el-table__header th {
+  padding: 0;
+  height: 40px;
+}
+/deep/.el-table__body tr,
+/deep/.el-table__body td {
+  padding: 0;
+  height: 40px;
+}
+.page {
+  text-align: center;
+}
+</style>

src/views/userManage/user/detail.vue

@@ -50,8 +50,9 @@
               <el-input type="textarea" v-model="form.content"></el-input>
             </el-form-item>
             <el-col class="btn">
-              <el-button>返回</el-button>
-              <el-button type="primary" @click="onSubmit">提交</el-button>
+              <!-- <el-button type="primary" icon="el-icon-back" @click="$router.push({ path: '/userManage/user/index' })">返回</el-button> -->
+              <el-button type="primary" @click="handleCancel">取消</el-button>
+              <el-button type="primary" @click="handleEdit">提交</el-button>
             </el-col>
           </el-form>
         </el-col>
@@ -66,13 +67,35 @@ export default {
   props: {},
   components: {},
   data: () => ({
-    form: {},
+    form: {
+      sfzh: '',
+      name: '',
+      title: '',
+      tel: '',
+      email: '',
+      date: '',
+    },
   }),
   created() {},
   computed: {},
   methods: {
-    onSubmit() {
-      console.log('submit!');
+    handleEdit() {
+      let chData = this.form;
+      console.log(chData);
+      const { index, ...form } = chData;
+      if (index !== undefined) {
+        this.$set(this.tableData, `${index}`, form);
+        this.$set(this.tableData, `${index}`, form);
+        this.$message.success('修改成功');
+      } else {
+        // this.tableData.push(form);
+        console.log(form);
+      }
+      this.handleCancel();
+    },
+    handleCancel() {
+      this.form = {};
+      this.$router.push({ path: './index' });
     },
   },
 };

src/views/userManage/user/index.vue

@@ -18,7 +18,7 @@
 
         查询名称<el-input v-model="input" placeholder="查询名称" size="mini" style="width:200px;margin-left: 10px"></el-input>
         <el-button type="primary" icon="el-icon-search" @click="onSubmit" size="mini">查询</el-button>
-        <el-button type="success" icon="el-icon-check" @click="toadd()" size="mini">添加用户</el-button>
+        <el-button type="success" icon="el-icon-check" @click="openDialog()" size="mini">添加用户</el-button>
       </el-col>
       <el-col :span="24" class="biaoge">
         <el-table :data="tableData" style="width: 100%" border>
@@ -30,11 +30,27 @@
           <el-table-column prop="email" label="电子邮箱" width="208" align="center"> </el-table-column>
           <el-table-column prop="date" label="创建时间" width="120" align="center"> </el-table-column>
           <el-table-column label="操作" width="180" align="center">
-            <el-button type="text" size="mini" icon="el-icon-edit" @click="onSubmit"></el-button>
-            <el-button type="text" size="mini" icon="el-icon-document" @click="onSubmit"></el-button>
-            <el-button type="text" size="mini" icon="el-icon-delete" @click="onSubmit"></el-button>
+            <template slot-scope="scoped">
+              <el-button size="mini" type="text" icon="el-icon-edit" @click="openDialog(scoped.$index)"></el-button>
+
+              <el-button type="text" size="mini" icon="el-icon-document" @click="openDialogs(scoped.$index.tableData)"></el-button>
+              <el-button size="mini" type="text" icon="el-icon-delete" @click.prevent="deleteRow(scoped.$index.tableData)"> </el-button>
+            </template>
           </el-table-column>
         </el-table>
+        <el-dialog title="详情页" :visible.sync="dialog" width="30%">
+          <el-col>
+            <el-col :span="24"> 姓名 </el-col>
+            <el-col :span="24">身份证号</el-col>
+            <el-col :span="24">登陆名称</el-col>
+            <el-col :span="24">联系电话</el-col>
+            <el-col :span="24">联系电话</el-col>
+            <el-col :span="24">电子邮箱</el-col>
+            <el-col :span="24">创建时间</el-col>
+          </el-col>
+          <el-button>取 消</el-button>
+          <el-button type="primary">确 定</el-button>
+        </el-dialog>
       </el-col>
     </el-row>
   </div>
@@ -46,12 +62,9 @@ export default {
   props: {},
   components: {},
   data: () => ({
+    dialog: false,
+    currentPage: 1,
     input: '',
-    formInline: {
-      card: '',
-      name: '',
-      region: '',
-    },
     tableData: [
       {
         name: '王小开虎',
@@ -61,22 +74,37 @@ export default {
         email: '17319450324@163.com',
         date: '2019-01-08',
       },
-      {
-        name: '王小虎',
-        sfzh: '1234568912345689',
-        title: '测试',
-        tel: '0431-123456',
-        email: '123456@163.com',
-        date: '2019-01-08',
-      },
     ],
   }),
   created() {},
   computed: {},
   methods: {
-    toadd() {
-      this.$router.push({ path: './detail' });
+    openDialogs(index) {
+      this.dialog = true;
+    },
+    openDialog(index) {
+      if (index !== undefined) {
+        let data = JSON.parse(JSON.stringify(this.tableData[index]));
+        data[`index`] = index;
+        this.$set(this, `form`, data);
+        this.$router.push({ path: './detail' });
+      } else {
+        this.form = {};
+        this.$router.push({ path: './detail' });
+      }
+    },
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
     },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+    },
+    deleteRow(index, rows) {
+      rows.splice(index, 1);
+    },
+    // toadd() {
+    //   this.$router.push({ path: './detail' });
+    // },
     onSubmit() {
       console.log('submit!');
     },
@@ -135,4 +163,7 @@ export default {
   padding: 0;
   height: 40px;
 }
+.page {
+  text-align: center;
+}
 </style>