更新

src/components/upload.vue

@@ -0,0 +1,119 @@
+<template>
+  <div id="upload">
+    <el-upload
+      v-if="url"
+      ref="upload"
+      :action="url"
+      :list-type="listType"
+      :file-list="fileList"
+      :limit="limit"
+      :on-exceed="outLimit"
+      :on-preview="handlePictureCardPreview"
+      :before-remove="handleRemove"
+      :on-success="onSuccess"
+      :before-upload="beforeUpload"
+      :show-file-list="showList"
+      :accept="accept"
+    >
+      <el-button size="small" type="primary" v-if="isBtn">点击上传</el-button>
+      <template v-else-if="uploadBtn">
+        <el-button type="danger">选择文件</el-button>
+      </template>
+      <template v-else>
+        <i class="el-icon-plus"></i>
+      </template>
+      <template #tip v-if="tip">
+        {{ tip }}
+      </template>
+    </el-upload>
+    <el-dialog :visible.sync="dialogVisible">
+      <img width="100%" :src="dialogImageUrl" alt="" />
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import _ from 'lodash';
+export default {
+  name: 'upload',
+  props: {
+    url: { type: null },
+    limit: { type: Number },
+    data: { type: null },
+    type: { type: String },
+    isBtn: { type: Boolean, default: false },
+    uploadBtn: { type: Boolean, default: false },
+    showList: { type: Boolean, default: true },
+    accept: { type: String, default: '' },
+    tip: { type: String, default: undefined },
+    listType: { type: String, default: 'picture-card' },
+  },
+  components: {},
+  data: () => ({
+    dialogVisible: false,
+    dialogImageUrl: '',
+    fileList: [],
+  }),
+  created() {
+    if (this.data) {
+      this.defalutProcess(this.data);
+    }
+  },
+  watch: {
+    data: {
+      handler(val) {
+        this.defalutProcess(val);
+      },
+    },
+  },
+  computed: {},
+  methods: {
+    handlePictureCardPreview(file) {
+      this.dialogImageUrl = file.url;
+      this.dialogVisible = false;
+    },
+    handleRemove(file, fileList) {
+      let index = fileList.findIndex(f => _.isEqual(f, file));
+      this.$emit('delete', index);
+      return false;
+    },
+    outLimit() {
+      this.$message.error(`只允许上传${this.limit}个文件`);
+    },
+    onSuccess(response, file, fileList) {
+      //将文件整理好传回父组件
+      this.$emit('upload', { type: this.type, data: { ...response, name: file.name } });
+    },
+    beforeUpload(file) {
+      const sizeLimit = file.size / 1024 / 1024 < 10;
+      if (sizeLimit) return true;
+      else {
+        this.$message.error('文件超出10M！');
+        return false;
+      }
+    },
+    defalutProcess(val) {
+      if (_.isArray(val)) {
+        let newArr = val.map(item => {
+          let object = {};
+          object.name = item.name;
+          object.url = item.url;
+          return object;
+        });
+        this.$set(this, `fileList`, newArr);
+      } else if (_.isObject(val)) {
+        let object = {};
+        if (_.get(val, `url`)) {
+          object.name = val.name;
+          object.url = val.url;
+          this.$set(this, `fileList`, [object]);
+        }
+      } else if (typeof val === 'string') {
+        this.$set(this, `fileList`, [{ name: '附件', url: val }]);
+      }
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/components/uploadone.vue

@@ -0,0 +1,76 @@
+<template>
+  <div id="upload">
+    <el-upload
+      v-if="url"
+      ref="upload"
+      :action="url"
+      list-type="picture-card"
+      :file-list="fileList"
+      :limit="limit"
+      :on-exceed="outLimit"
+      :on-preview="handlePictureCardPreview"
+      :before-remove="handleRemove"
+      :on-success="onSuccess"
+      accept=".jpg,.jpeg,.png,.bmp,.gif,.svg"
+    >
+      <template>
+        <i class="el-icon-plus"></i>
+      </template>
+    </el-upload>
+    <el-dialog :visible.sync="dialogVisible">
+      <img width="100%" :src="dialogImageUrl" alt="" />
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'upload',
+  props: {
+    url: { type: null },
+    limit: { type: Number },
+    data: { type: null },
+    type: { type: String },
+  },
+  components: {},
+  data: () => ({
+    dialogVisible: false,
+    dialogImageUrl: '',
+    fileList: [],
+  }),
+  created() {
+    if (this.data) {
+      this.defalutProcess(this.data);
+    }
+  },
+  watch: {
+    data: {
+      handler(val) {
+        this.defalutProcess(val);
+      },
+    },
+  },
+  computed: {},
+  methods: {
+    handlePictureCardPreview(file) {
+      this.dialogImageUrl = file.url;
+      this.dialogVisible = true;
+    },
+    handleRemove(file) {
+      return true;
+    },
+    outLimit() {
+      this.$message.error('只允许上传1张图片');
+    },
+    onSuccess(response, file, fileList) {
+      //将文件整理好传回父组件
+      this.$emit('upload', { type: this.type, data: response });
+    },
+    defalutProcess(val) {
+      this.$set(this, `fileList`, [{ name: this.type, url: `${this.data}?${new Date().getTime()}` }]);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/router/index.js

@@ -9,6 +9,18 @@ const routes = [
     name: '',
     component: () => import('../views/index.vue'),
   },
+  // 登录
+  {
+    path: '/login',
+    meta: { title: '登录', subSite: true },
+    component: () => import('../views/login.vue'),
+  },
+  // 注册
+  {
+    path: '/register',
+    meta: { title: '注册', subSite: true },
+    component: () => import('../views/register.vue'),
+  },
   // 新闻动态
   {
     path: '/news/index',

src/views/login.vue

@@ -0,0 +1,82 @@
+<template>
+  <div id="login">
+    <el-row>
+      <el-col :span="24" class="style">
+        <el-col :span="24" class="top">
+          <top></top>
+        </el-col>
+        <el-col :span="24" class="menu">
+          <div class="w_1200">
+            <menus></menus>
+          </div>
+        </el-col>
+        <el-col :span="24" class="main">
+          <div class="w_1200">
+            <el-col :span="24" class="info">
+              德鲁
+            </el-col>
+          </div>
+        </el-col>
+        <el-col :span="24" class="foot">
+          <div class="w_1200">
+            <foot></foot>
+          </div>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import top from '@/layout/common/top.vue';
+import menus from '@/layout/common/menus.vue';
+import foot from '@/layout/common/foot.vue';
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'login',
+  props: {},
+  components: {
+    top,
+    menus,
+    foot,
+  },
+  data: function() {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.w_1200 {
+  width: 1200px;
+  margin: 0 auto;
+}
+.style {
+  .menu {
+    height: 70px;
+    margin: 0 0 10px 0;
+  }
+  .main {
+    min-height: 600px;
+    margin: 0 0 10px 0;
+    .info {
+      min-height: 600px;
+      background: #fff;
+    }
+  }
+  .foot {
+    height: 135px;
+  }
+}
+</style>

src/views/register.vue

@@ -0,0 +1,269 @@
+<template>
+  <div id="register">
+    <el-row>
+      <el-col :span="24" class="style">
+        <el-col :span="24" class="top">
+          <top></top>
+        </el-col>
+        <el-col :span="24" class="menu">
+          <div class="w_1200">
+            <menus></menus>
+          </div>
+        </el-col>
+        <el-col :span="24" class="main">
+          <div class="w_1200">
+            <el-col :span="24" class="info">
+              <el-col :span="24" class="top">
+                注册
+              </el-col>
+              <el-col :span="24" class="form">
+                <el-form :model="form" :rules="rules" ref="form" label-width="100px" class="demo-ruleForm">
+                  <el-form-item label="姓名" prop="name">
+                    <el-input v-model="form.name" placeholder="请输入姓名"></el-input>
+                  </el-form-item>
+                  <el-form-item label="手机号" prop="phone">
+                    <el-input v-model="form.phone" placeholder="请输入手机号"></el-input>
+                  </el-form-item>
+                  <el-form-item label="密码" prop="passwd">
+                    <el-input v-model="form.passwd" placeholder="请输入密码"></el-input>
+                  </el-form-item>
+                  <el-form-item label="用户类别" prop="type">
+                    <el-radio-group v-model="form.type">
+                      <el-radio label="3">普通用户</el-radio>
+                      <el-radio label="0">超级管理员</el-radio>
+                      <el-radio label="1">管理员</el-radio>
+                      <el-radio label="2">专家</el-radio>
+                    </el-radio-group>
+                  </el-form-item>
+                  <el-form-item label="性别" prop="gender" v-if="form.type == '0' || form.type == '1' || form.type == '2'">
+                    <el-radio-group v-model="form.gender">
+                      <el-radio label="0">女</el-radio>
+                      <el-radio label="1">男</el-radio>
+                    </el-radio-group>
+                  </el-form-item>
+                  <el-form-item label="家庭住址" prop="address" v-if="form.type == '0' || form.type == '1' || form.type == '2'">
+                    <el-input v-model="form.address" placeholder="请输入家庭住址"></el-input>
+                  </el-form-item>
+                  <el-form-item label="身份证号" prop="id_number" v-if="form.type == '0' || form.type == '1' || form.type == '2'">
+                    <el-input v-model="form.id_number" placeholder="请输入身份证号"></el-input>
+                  </el-form-item>
+                  <el-form-item label="所在部门" prop="dept_id" v-if="form.type == '0' || form.type == '1'">
+                    <el-select v-model="form.dept_id" filterable @change="selectChild">
+                      <el-option v-for="(item, index) in deptList" :key="index" :value="item.id" :label="item.name"></el-option>
+                    </el-select>
+                  </el-form-item>
+                  <el-form-item label="担任职务" prop="level_id" v-if="form.type == '0' || form.type == '1'">
+                    <el-select v-model="form.level_id" filterable @change="selectChild">
+                      <el-option v-for="(item, index) in levelList" :key="index" :value="item.id" :label="item.name"></el-option>
+                    </el-select>
+                  </el-form-item>
+                  <el-form-item label="邮箱" prop="email" v-if="form.type == '2'">
+                    <el-input v-model="form.email" placeholder="请输入邮箱"></el-input>
+                  </el-form-item>
+                  <el-form-item label="头像" prop="img_url" v-if="form.type == '2'">
+                    <upload :limit="1" :data="form.img_url" type="img_url" :url="'/files/imgpath/upload'" @upload="uploadSuccess"></upload>
+                  </el-form-item>
+                  <el-form-item label="出生" prop="birthday" v-if="form.type == '2'">
+                    <el-date-picker v-model="form.birthday" type="date" placeholder="选择日期" value-format="yyyy-MM-dd"> </el-date-picker>
+                  </el-form-item>
+                  <el-form-item label="职称级别" prop="level" v-if="form.type == '2'">
+                    <el-input v-model="form.level" placeholder="请输入职称级别"></el-input>
+                  </el-form-item>
+                  <el-form-item label="职称名称" prop="levelname" v-if="form.type == '2'">
+                    <el-input v-model="form.levelname" placeholder="请输入职称名称"></el-input>
+                  </el-form-item>
+                  <el-form-item label="职务" prop="position" v-if="form.type == '2'">
+                    <el-input v-model="form.position" placeholder="请输入职务"></el-input>
+                  </el-form-item>
+                  <el-form-item label="院校" prop="school" v-if="form.type == '2'">
+                    <el-input v-model="form.school" placeholder="请输入院校"></el-input>
+                  </el-form-item>
+                  <el-form-item label="学历" prop="education" v-if="form.type == '2'">
+                    <el-select v-model="form.education" placeholder="请选择学历要求">
+                      <el-option v-for="(item, index) in edu_list" :key="index" :label="item.name" :value="item.name"></el-option>
+                    </el-select>
+                  </el-form-item>
+                  <el-form-item label="学位" prop="degree" v-if="form.type == '2'">
+                    <el-select v-model="form.degree" placeholder="请选择学位">
+                      <el-option v-for="(item, index) in degree_list" :key="index" :label="item.name" :value="item.name"></el-option>
+                    </el-select>
+                  </el-form-item>
+                  <el-form-item label="专业" prop="major" v-if="form.type == '2'">
+                    <el-input v-model="form.major" placeholder="请输入专业"></el-input>
+                  </el-form-item>
+                  <el-form-item label="从事专业" prop="profession" v-if="form.type == '2'">
+                    <el-input v-model="form.profession" placeholder="请输入从事专业"></el-input>
+                  </el-form-item>
+                  <el-form-item label="项目" prop="project" v-if="form.type == '2'">
+                    <el-input v-model="form.project" placeholder="请输入项目"></el-input>
+                  </el-form-item>
+                  <el-form-item label="学术成就" prop="academic" v-if="form.type == '2'">
+                    <el-input v-model="form.academic" placeholder="请输入学术成就"></el-input>
+                  </el-form-item>
+                  <el-form-item label="工作简介" prop="resume" v-if="form.type == '2'">
+                    <el-input v-model="form.resume" type="textarea" placeholder="请输入工作简介"></el-input>
+                  </el-form-item>
+                  <el-col :span="24" style="text-align:center;">
+                    <el-button type="primary" @click="submitForm('form')">注册</el-button>
+                    <!-- <el-button @click="resetForm('ruleForm')">重置</el-button> -->
+                  </el-col>
+                </el-form>
+              </el-col>
+            </el-col>
+          </div>
+        </el-col>
+        <el-col :span="24" class="foot">
+          <div class="w_1200">
+            <foot></foot>
+          </div>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import top from '@/layout/common/top.vue';
+import menus from '@/layout/common/menus.vue';
+import foot from '@/layout/common/foot.vue';
+import upload from '@/components/uploadone.vue';
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'register',
+  props: {},
+  components: {
+    top,
+    menus,
+    foot,
+    upload,
+  },
+  data: function() {
+    return {
+      form: {
+        type: '3',
+      },
+      rules: {
+        name: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
+        phone: [{ required: true, message: '请输入手机号', trigger: 'blur' }],
+        passwd: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+        gender: [{ required: true, message: '请输入性别', trigger: 'blur' }],
+        address: [{ required: false, message: '请输入住址', trigger: 'blur' }],
+        id_number: [{ required: false, message: '请输入身份证号', trigger: 'blur' }],
+        dept_id: [{ required: true, message: '请输入部门', trigger: 'blur' }],
+        level_id: [{ required: true, message: '请输入职务', trigger: 'blur' }],
+        email: [{ required: false, message: '请输入邮箱', trigger: 'blur' }],
+        img_url: [{ required: false, message: '请输入头像', trigger: 'blur' }],
+        birthday: [{ required: false, message: '请输入出生日期', trigger: 'blur' }],
+        level: [{ required: false, message: '请输入职称级别', trigger: 'blur' }],
+        levelname: [{ required: false, message: '请输入职称名称', trigger: 'blur' }],
+        position: [{ required: false, message: '请输入职务', trigger: 'blur' }],
+        school: [{ required: false, message: '请输入院校', trigger: 'blur' }],
+        education: [{ required: false, message: '请输入学历', trigger: 'blur' }],
+        degree: [{ required: false, message: '请输入学位', trigger: 'blur' }],
+        major: [{ required: false, message: '请输入专业', trigger: 'blur' }],
+        profession: [{ required: false, message: '请输入从事专业', trigger: 'blur' }],
+        project: [{ required: false, message: '请输入项目', trigger: 'blur' }],
+        academic: [{ required: false, message: '请输入学术成就', trigger: 'blur' }],
+        resume: [{ required: false, message: '请输入工作简历', trigger: 'blur' }],
+      },
+      // 部门
+      deptList: [],
+      // 职务
+      levelList: [],
+      // 学历
+      edu_list: [
+        {
+          name: '中专及以上',
+        },
+        {
+          name: '大专及以上',
+        },
+        {
+          name: '本科及以上',
+        },
+        {
+          name: '研究生及以上',
+        },
+      ],
+      // 学位
+      degree_list: [
+        {
+          name: '学士',
+        },
+        {
+          name: '硕士',
+        },
+        {
+          name: '博士',
+        },
+        {
+          name: '其他',
+        },
+      ],
+    };
+  },
+  created() {},
+  methods: {
+    submitForm(formName) {
+      this.$refs[formName].validate(valid => {
+        if (valid) {
+          alert('submit!');
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
+    },
+    selectChild(type_id) {
+      console.log(type_id);
+      // let res = this.columnList.filter(fil => fil.id === product_type_id);
+      // if (res.length > 0) {
+      //   this.$set(this.form, `product_type_name`, res[0].name);
+      // }
+      // this.$forceUpdate();
+    },
+    uploadSuccess({ type, data }) {
+      this.$set(this.form, `${type}`, data.uri);
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.w_1200 {
+  width: 1200px;
+  margin: 0 auto;
+}
+.style {
+  .menu {
+    height: 70px;
+    margin: 0 0 10px 0;
+  }
+  .main {
+    min-height: 600px;
+    margin: 0 0 10px 0;
+    .info {
+      min-height: 600px;
+      background: #fff;
+      padding: 0 20px;
+      .top {
+        text-align: center;
+        padding: 50px 0;
+        font-size: 40px;
+      }
+    }
+  }
+  .foot {
+    height: 135px;
+  }
+}
+</style>

vue.config.js

@@ -19,15 +19,22 @@ module.exports = {
     port: '8001',
     //api地址前缀
     proxy: {
-      '/api': {
+      '/weixin': {
         target: 'http://smart.cc-lotus.info',
+        changeOrigin: true,
+        ws: true,
+      },
+      '/files': {
+        target: 'http://free.liaoningdoupo.com',
+      },
+      '/api': {
+        target: 'http://free.liaoningdoupo.com',
+        changeOrigin: true,
+        ws: true,
+      },
+      '/ws': {
+        target: 'http://free.liaoningdoupo.com',
         ws: true,
-        onProxyReq(proxyReq, req, res) {
-          proxyReq.setHeader('x-tenant', '99991');
-        },
-        '/files': {
-          target: 'http://free.liaoningdoupo.com',
-        },
       },
     },
   },