zhangyanpeng
2020-01-19 8692fe61d8d4af99e847471cabb9bb1fd40c30ce
新增
4个文件已添加
222 ■■■■■ 已修改文件
src/views/Overview.vue 87 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/calendarTask.vue 12 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/login.vue 109 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
vue.config.js 14 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/Overview.vue
New file
@@ -0,0 +1,87 @@
<template>
    <div class="class_overview">
        <div style="float: left; width: 100%; height: 50px;">
            <span>请选择项目:</span>
            <el-select v-model="value" placeholder="请选择" size="small">
                <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
            </el-select>
            <el-button type="primary" style="float: right;" @click="addProject">新建项目</el-button>
        </div>
        <div style="float: left; margin-left: 1%; width: 69%; height: 80vh; ">
            <div style="float: left; margin: 10px;  width: 46%; height: 43%; border: 1px solid #42B983;"></div>
            <div style="float: left; margin: 10px; width: 46%; height: 43%; border: 1px solid #42B983;"></div>
            <div style="float: left; margin: 10px; width: 46%; height: 43%; border: 1px solid #42B983;"></div>
            <div style="float: left; margin: 10px; width: 46%; height: 43%; border: 1px solid #42B983;"></div>
        </div>
        <div style="float: right; margin-right: 1%; width: 28%; height: 80vh; border: 1px solid #42B983;"></div>
        <el-dialog @close="Cancel" width="70%" top="50px" :visible.sync="dialog_1" append-to-body>
          <newProject @closeNewProject="closeNewProject"></newProject>
        </el-dialog>
    </div>
</template>
<script>
    import newProject from '../components/popup/newProject.vue'
    export default {
        components: {
          newProject
        },
        data() {
            return {
                options: [
                    {
                        value: '选项1',
                        label: '黄金糕'
                    }, {
                        value: '选项2',
                        label: '双皮奶'
                    }, {
                        value: '选项3',
                        label: '蚵仔煎'
                    }, {
                        value: '选项4',
                        label: '龙须面'
                    }, {
                        value: '选项5',
                        label: '北京烤鸭'
                    }
                ],
                value: '',
                dialog_1: false,
            }
        },
        methods: {
            addProject() {
                this.dialog_1 = true;
            },
            Cancel() {
            },
            closeNewProject() {
                this.dialog_1 = false
            },
        }
    }
</script>
<style>
    .class_overview {
        text-align: left;
        background-color: #dee0e2;
    }
</style>
src/views/calendarTask.vue
New file
@@ -0,0 +1,12 @@
<template>
    <div>日历任务列表</div>
</template>
<script>
    export default {
    };
</script>
<style>
</style>
src/views/login.vue
New file
@@ -0,0 +1,109 @@
<template>
  <div class="login">
    <div class="img-container">
      <img :src="loginImg" alt="">
    </div>
    <el-form ref="loginForm" :model="loginForm" class="login-form" auto-complete="on" label-position="left">
      <el-form-item prop="username">
        <el-input
          v-model="loginForm.username"
          placeholder="输入用户名"
          name="username"
          type="text"
          auto-complete="on"
        >
          <span v-show="isClearIconShow" slot="suffix" class="suffix-icon" @click="clearUsername">
            <svg-icon icon-class="close-circle" />
          </span>
        </el-input>
      </el-form-item>
      <el-form-item prop="password">
        <el-input
          :type="passwordType"
          v-model="loginForm.password"
          placeholder="输入密码"
          name="password"
          auto-complete="on"
          @keyup.enter.native="handleLogin"
        >
          <span slot="suffix" class="suffix-icon" :class="{eyeOpen: isOpen}" @click="showPwd">
            <svg-icon :icon-class="eyeIconClass" />
          </span>
        </el-input>
      </el-form-item>
      <div class="user-action">
        <a @click="handleForgetPassword">
          <span>忘记密码</span>
        </a>
      </div>
      <el-button :loading="loading" class="loginButton" type="primary" @click.native.prevent="handleLogin">登录</el-button>
    </el-form>
  </div>
</template>
<script>
/**
 * 登录组件
 * @author Sky
 */
export default {
  name: 'Login',
  data () {
    return {
   //   path: '/' + process.env.VUE_APP_FACTORY_KEY + '/user/confirm-password',
   //   loginImg: require('@/assets/img/login-logo.png'),
      loginForm: { // 表单数据
        username: process.env.VUE_APP_BUILD_MODE === 'production' ? '' : 'bayer_admin',
        password: process.env.VUE_APP_BUILD_MODE === 'production' ? '' : '123456'
      },
      passwordType: 'password', // 输入框类型
      loading: false, // 加载中
      eyeIconClass: 'eye-off', // 密码图标显示
      isOpen: false // 根据状态显示不同样式类名
    }
  },
  computed: {
    isClearIconShow () {
      return this.loginForm.username.length
    }
  },
  methods: {
    // 忘记密码回调
    handleForgetPassword () {
      this.$alert('', '请联系公司管理员修改密码', {
        confirmButtonText: '知道了',
        center: true,
        showClose: true
      })
    },
    // 清除用户名
    clearUsername () {
      if (this.loginForm.username) {
        this.loginForm.username = ''
      }
    },
    // 密码显示切换
    showPwd () {
      if (this.passwordType === 'password') {
        this.passwordType = ''
        this.eyeIconClass = 'eye'
        this.isOpen = true
      } else {
        this.passwordType = 'password'
        this.eyeIconClass = 'eye-off'
        this.isOpen = false
      }
    },
    // 登录
    handleLogin () {
            localStorage.setItem('userId','user001');
            this.$router.push('/');
        },
  }
}
</script>
<style rel="stylesheet/scss" lang="scss">
</style>
vue.config.js
New file
@@ -0,0 +1,14 @@
module.exports = {
    publicPath: '/',
    devServer: {
        proxy: {
            '/api/api': {
                target: 'http://192.168.31.233:8090',
                changeOrigin: true,
                pathRewrite: {
                        '^/api/api': ''
                }
            }
        }
    }
}