| .env.production | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| src/layout/components/Sidebar/Logo.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| src/styles/index.scss | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| src/styles/variables.scss | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| src/views/dashboard/index.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| src/views/user/inemployees.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 |
.env.production
@@ -2,5 +2,5 @@ ENV = 'production' # base api VUE_APP_BASE_API = 'https://apicloud.mrbird.cn:8301/' VUE_APP_BASE_API = 'http://120.24.23.155:8301/'
@@ -45,7 +45,7 @@ width: 100%; height: 54px; line-height: 54px; background: #272c33; background: rgba(163, 44, 48, 1); text-align: center; overflow: hidden;
@@ -258,7 +258,7 @@ line-height: 38px; } .el-menu-item.is-active { background-color: #1f2328 !important; background-color: rgba(0,0,0,.1) !important; } .el-button { padding: 10px 20px; src/styles/variables.scss
@@ -14,11 +14,11 @@ $menuActiveText:#fff; $subMenuActiveText:#fff; // https://github.com/ElemeFE/element/issues/12951 $menuBg:#272c33; $menuHover:#rgba(0,0,0,.1); $menuBg:rgba(163, 44, 48, 1); $menuHover:rgba(0,0,0,.1); $subMenuBg:#272c33; $subMenuHover:#rgba(0,0,0,.1); $subMenuBg:rgba(163, 44, 48, 1); $subMenuHover:rgba(0,0,0,.1); $sideBarWidth: 255px;
@@ -1,41 +1,207 @@ <template> <div class="main"> <el-row> <el-col :span="24"><div class="grid-content bg-purple-dark" /></el-col> <el-col :span="8"><div> </div></el-col> <el-col :span="8"> <ul class="data-ul"> <li>今日</li> <li>本周</li> <li>本月</li> <li>今年</li> </ul> </el-col> <el-col :span="8"> <el-date-picker v-model="value2" type="datetimerange" :picker-options="pickerOptions" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" align="right" /></el-col> </el-row> <el-row :gutter="20"> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>在职员工总数</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>离职员工总数</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>新进人员</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>正常离职人员</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>自动离职人员</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>有效合同</p> </el-card> </el-col> </el-row> <el-row :gutter="20"> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>到期合同</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>新签合同</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>续签合同</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>历史合同</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>出勤天数</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>员工请假</p> </el-card> </el-col> </el-row> <el-row :gutter="20"> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"><div class="grid-content bg-purple" /></el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>员工加班（天）</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>员工加班（小时）</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>员工旷工</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>证件到期</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>员工调岗</p> </el-card> </el-col> <el-col :span="4"> <el-card shadow="always"> <p class="card-number">12</p> <p>员工体检</p> </el-card> </el-col> </el-row> </div> </template> <script> export default { data() { return { pickerOptions: { shortcuts: [ { text: '最近一周', onClick(picker) { const end = new Date() const start = new Date() start.setTime(start.getTime() - 3600 * 1000 * 24 * 7) picker.$emit('pick', [start, end]) } }, { text: '最近一个月', onClick(picker) { const end = new Date() const start = new Date() start.setTime(start.getTime() - 3600 * 1000 * 24 * 30) picker.$emit('pick', [start, end]) } }, { text: '最近三个月', onClick(picker) { const end = new Date() const start = new Date() start.setTime(start.getTime() - 3600 * 1000 * 24 * 90) picker.$emit('pick', [start, end]) } } ] }, value2: '' } } } </script> <style lang="scss"> .el-card__body{ text-align: center; } .data-ul { margin-top: 1px; list-style: none; li { float: left; border: 1px solid; width: 60px; height: 30px; text-align: center; line-height: 30px; background: #ffffff; border: 1px solid #dcdfe6; } li:hover { border-color: #409eff; } } .card-number{ color:#0000BF; font-size:20px; } .el-row { margin-bottom: 20px; &:last-child { @@ -63,6 +229,4 @@ background-color: #f9fafc; } </style> <style lang="scss" scoped> </style> <style lang="scss" scoped></style> src/views/user/inemployees.vue
@@ -1,21 +1,70 @@ <template> <div> <el-container> <el-header :height="headerHeight"> <el-row> <el-col :span="18"><h3 class="bu-tian-jia-title">在职员工</h3></el-col> <el-col :span="6"><el-input v-model="input" placeholder="请输入内容" style="width:200px" /><el-button type="primary">查询</el-button> <el-button type="danger">高级查询</el-button></el-col> <el-col :span="16"><h3 class="bu-tian-jia-title">在职员工</h3></el-col> <el-col :span="8"> <el-input v-model="input" placeholder="请输入内容" style="width:200px" /><el-button type="primary">查询</el-button> <el-button type="danger" @click="advancedQueryShowMethods">高级查询</el-button></el-col> </el-row> <div v-show="advancedQueryShow"> <form> <el-row> <el-col :span="3">员工编号：<el-input v-model="input" placeholder="请输入内容" style="width:120px" /></el-col> <el-col :span="3">员工编号：<el-input v-model="input" placeholder="请输入内容" style="width:120px" /></el-col> <el-col :span="3">员工编号：<el-input v-model="input" placeholder="请输入内容" style="width:120px" /></el-col> <el-col :span="3">员工编号：<el-input v-model="input" placeholder="请输入内容" style="width:120px" /></el-col> <el-col :span="3">员工编号：<el-input v-model="input" placeholder="请输入内容" style="width:120px" /></el-col> <el-col :span="3">员工编号：<el-input v-model="input" placeholder="请输入内容" style="width:120px" /></el-col> <el-col :span="6"><el-button type="primary">查询</el-button> <el-button type="danger">高级查询</el-button></el-col> <el-col :span="3" >员工编号：<el-input v-model="input" placeholder="请输入内容" style="width:80px" /></el-col> <el-col :span="3" >员工编号：<el-input v-model="input" placeholder="请输入内容" style="width:80px" /></el-col> <el-col :span="3" >员工编号：<el-input v-model="input" placeholder="请输入内容" style="width:80px" /></el-col> <el-col :span="3" >员工编号：<el-input v-model="input" placeholder="请输入内容" style="width:80px" /></el-col> <el-col :span="3" >员工编号：<el-input v-model="input" placeholder="请输入内容" style="width:80px" /></el-col> <el-col :span="3" >员工编号：<el-input v-model="input" placeholder="请输入内容" style="width:80px" /></el-col> <el-col :span="6" ><el-button type="primary">查询</el-button> <el-button type="danger">重置</el-button></el-col> </el-row> <el-row> <el-col :span="24"> <form> <table> <tr><td>性别：</td><td><el-radio-group v-model="radio"> <el-radio :label="3">备选项</el-radio> @@ -53,10 +102,149 @@ <el-radio :label="9">备选项</el-radio> </el-radio-group></td></tr> </table> </form> </el-col> </el-row> </el-row></form> </div> </el-header> <el-container> <el-aside width="300px"> <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" /> </el-aside> <el-main> <el-table :data="tableData" style="width: 100%" > <el-table-column prop="date" label="日期" width="180" /> <el-table-column prop="name" label="姓名" width="180" /> <el-table-column prop="address" label="地址" /> </el-table></el-main> </el-container> </el-container> </div> </template> <script> export default { data() { return { headerHeight: '60px', advancedQueryShow: false, tableData: [{ date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄' }, { date: '2016-05-04', name: '王小虎', address: '上海市普陀区金沙江路 1517 弄' }, { date: '2016-05-01', name: '王小虎', address: '上海市普陀区金沙江路 1519 弄' }, { date: '2016-05-03', name: '王小虎', address: '上海市普陀区金沙江路 1516 弄' }], data: [ { label: '一级 1', children: [ { label: '二级 1-1', children: [ { label: '三级 1-1-1' } ] } ] }, { label: '一级 2', children: [ { label: '二级 2-1', children: [ { label: '三级 2-1-1' } ] }, { label: '二级 2-2', children: [ { label: '三级 2-2-1' } ] } ] }, { label: '一级 3', children: [ { label: '二级 3-1', children: [ { label: '三级 3-1-1' } ] }, { label: '二级 3-2', children: [ { label: '三级 3-2-1' } ] } ] } ], defaultProps: { children: 'children', label: 'label' } } }, methods: { handleNodeClick(data) { console.log(data) }, advancedQueryShowMethods() { if (this.advancedQueryShow) { this.headerHeight = '60px' this.advancedQueryShow = false } else { this.headerHeight = '300px' this.advancedQueryShow = true } } } } </script> <style lang="scss"> .el-aside{ padding: 20px; background: #f3f5f8; height: 600px; .el-tree{ height: 100%; } } .el-main{ height: 600px; } </style>
