Merge remote-tracking branch 'origin/master'
# Conflicts:
# .env.development
¶Ô±ÈÐÂÎļþ |
| | |
| | | import request from '@/utils/request' |
| | | |
| | | //è·åè´£ä»»äººé¡¹ç®æ°ç»è®¡ |
| | | export function getDutyMater(params) { |
| | | return request({ |
| | | url: '/work/dutyMater', |
| | | method: 'get', |
| | | params |
| | | }) |
| | | } |
| | | |
| | | //è·åè´£ä»»äººåæ¶ç |
| | | export function getDutyTimely(params) { |
| | | return request({ |
| | | url: '/work/dutytimely', |
| | | method: 'get', |
| | | params |
| | | }) |
| | | } |
| | | //è·åæ§è¡äººé¡¹ç®æ°ç»è®¡ |
| | | export function getExecuteMater(params) { |
| | | return request({ |
| | | url: '/work/executeMater', |
| | | method: 'get', |
| | | params |
| | | }) |
| | | } |
| | | |
| | | //è·åæ§è¡äººåæ¶ç |
| | | export function getExecuteTimely(params) { |
| | | return request({ |
| | | url: '/work/executetimely', |
| | | method: 'get', |
| | | params |
| | | }) |
| | | } |
| | |
| | | params |
| | | }) |
| | | } |
| | | |
| | | export function addRoleInfo(data) { |
| | | return request({ |
| | | url: '/role-manager/addRoleInfo', |
| | | method: 'post', |
| | | data |
| | | }) |
| | | } |
| | | |
| | | export function assertRepeat(params) { |
| | | return request({ |
| | | url: '/role-manager/assertRepeat', |
| | | method: 'get', |
| | | params |
| | | }) |
| | | } |
| | | |
| | | //getAllRoleAndMenuInfo |
| | | export function getAllRoleAndMenuInfo(params) { |
| | | return request({ |
| | | url: '/role-manager/getAllRoleAndMenuInfo', |
| | | method: 'get', |
| | | params |
| | | }) |
| | | } |
| | |
| | | |
| | | <div class="right-menu"> |
| | | <div class="right-serves"> |
| | | <i class="el-icon-setting" /> |
| | | <i class="el-icon-bell" /> |
| | | <i class="el-icon-time" /> |
| | | <!-- <i class="el-icon-setting" /> --> |
| | | |
| | | <p @click="toMessage"><el-badge is-dot class="el-icon-bell message-icon"></el-badge></p> |
| | | <!-- <i class="el-icon-time" /> --> |
| | | </div> |
| | | <el-dropdown class="avatar-container" trigger="click"> |
| | | <div class="avatar-wrapper"> |
| | | <a class="user-avatar">{{ user.name.slice(0,1) }}</a> |
| | | </div> |
| | | <el-dropdown-menu slot="dropdown" class="user-dropdown"> |
| | | <router-link to="/"> |
| | | <el-dropdown-item> |
| | | ä¿®æ¹å¯ç |
| | | <p @click="dialogFormVisible = true">ä¿®æ¹å¯ç </p> |
| | | </el-dropdown-item> |
| | | </router-link> |
| | | <el-dropdown-item divided @click.native="logout"> |
| | | <span style="display:block;">éåºç»å½</span> |
| | | </el-dropdown-item> |
| | | </el-dropdown-menu> |
| | | </el-dropdown> |
| | | <el-dialog title="ä¿®æ¹å¯ç " :visible.sync="dialogFormVisible" :append-to-body="true"> |
| | | <el-form :model="form"> |
| | | <el-form-item label="æ§å¯ç " :label-width="formLabelWidth"> |
| | | <el-input v-model="form.oldPwd" autocomplete="off"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="æ°å¯ç " :label-width="formLabelWidth"> |
| | | <el-input maxlength="30" show-word-limit v-model="form.newPwd" autocomplete="off"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="确认å¯ç " :label-width="formLabelWidth"> |
| | | <el-input maxlength="30" show-word-limit v-model="form.confirmPwd" autocomplete="off"></el-input> |
| | | </el-form-item> |
| | | </el-form> |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button @click="reset()">å æ¶</el-button> |
| | | <el-button type="primary" @click="editPwd">ç¡® å®</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | </div> |
| | | </div> |
| | | </template> |
| | |
| | | } from "@/api/util/requestUtil.js" |
| | | |
| | | export default { |
| | | data(){ |
| | | return { |
| | | form: { |
| | | oldPwd: '', |
| | | newPwd: '', |
| | | confirmPwd: '' |
| | | }, |
| | | dialogFormVisible: false, |
| | | formLabelWidth: '120px' |
| | | } |
| | | }, |
| | | components: { |
| | | // Breadcrumb, |
| | | // Hamburger |
| | |
| | | this.getUser() |
| | | }, |
| | | methods: { |
| | | reset(){ |
| | | this.dialogFormVisible = false; |
| | | this.form.oldPwd = ''; |
| | | this.form.newPwd = ''; |
| | | this.form.confirmPwd = ''; |
| | | }, |
| | | toMessage(){ |
| | | this.$router.push('/message/toDo'); |
| | | }, |
| | | editPwd(){ |
| | | console.log(1); |
| | | }, |
| | | toggleSideBar() { |
| | | this.$store.dispatch('app/toggleSideBar') |
| | | }, |
| | |
| | | border-bottom: 1px solid #f0f2f5; |
| | | // box-shadow: 0 0 0.857143rem rgba(0, 0, 0, 0.12); |
| | | // box-shadow: 0 1px 4px rgba(0,21,41,.08); |
| | | |
| | | .message-icon{ |
| | | margin-right: 10px; |
| | | cursor: pointer; |
| | | } |
| | | .v-modal{ |
| | | z-index: 8; |
| | | } |
| | | .hamburger-container { |
| | | line-height: 46px; |
| | | height: 100%; |
| | |
| | | { |
| | | path: '/message', |
| | | component: Layout, |
| | | redirect: '/message/message', |
| | | redirect: '/message/toDo', |
| | | name: 'Message', |
| | | meta: { title: 'æ¶æ¯å¾
å', icon: 'el-icon-s-help' }, |
| | | children: [ |
| | | { |
| | | path: 'message', |
| | | name: 'Message', |
| | | component: () => import('@/views/message/message/index'), |
| | | meta: { title: 'æçæ¶æ¯', icon: 'table' } |
| | | }, |
| | | { |
| | | path: 'toDo', |
| | | name: 'ToDo', |
| | | component: () => import('@/views/message/toDo/index'), |
| | | meta: { title: 'æçå¾
å', icon: 'tree' } |
| | | } |
| | | }, |
| | | { |
| | | path: 'message', |
| | | name: 'Message', |
| | | // hidden: true, |
| | | component: () => import('@/views/message/message/index'), |
| | | // meta: { title: 'æçæ¶æ¯', icon: 'table' } |
| | | }, |
| | | ] |
| | | }, |
| | | { |
| | |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .content-main { |
| | | .el-form .el-form-item .el-form-item__content { |
| | | width: 100% !important; |
| | | } |
| | | |
| | | .top-bar { |
| | | margin: -25px -15px; |
| | | background: #fff; |
| | |
| | | tr, |
| | | td { |
| | | padding: 10px; |
| | | } |
| | | </style> |
| | | <style > |
| | | .content-main { |
| | | .el-form .el-form-item .el-form-item__content { |
| | | width: 100% !important; |
| | | } |
| | | } |
| | | </style> |
| | |
| | | <el-row :gutter="10"> |
| | | <el-col :span="24"> |
| | | <el-card> |
| | | <el-form :inline="true" :model="formInline" class="demo-form-inline"> |
| | | <el-form-item> |
| | | <el-form :rules="rules" ref="formInline" :inline="true" |
| | | :model="formInline" class="demo-form-inline"> |
| | | <el-form-item prop="date"> |
| | | <p><span>*</span>æ£æµæ¥æ:</p> |
| | | <el-date-picker |
| | | v-model="dateTime" |
| | | v-model="formInline.date" |
| | | format="yyyy-MM-dd" |
| | | value-format="yyyy-MM-dd" |
| | | type="daterange" |
| | | range-separator="è³" |
| | | start-placeholder="å¼å§æ¥æ" |
| | | end-placeholder="ç»ææ¥æ"> |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-form-item prop="type"> |
| | | <p><span>*</span>æ£éªç±»å:</p> |
| | | <el-select v-model="formInline.region" placeholder="éè´å
¥åº"> |
| | | <el-option label="åºåä¸" value="shanghai"></el-option> |
| | | <el-option label="åºåäº" value="beijing"></el-option> |
| | | <el-select v-model="formInline.type" placeholder="éè´å
¥åº"> |
| | | <el-option label="åææ" value="0"></el-option> |
| | | <el-option label="æå" value="1"></el-option> |
| | | <el-option label="å§æå" value="2"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item class="buttons"> |
| | | <el-button>æ¸
空</el-button> |
| | | <el-button type="primary" @click="onSubmit">æ¥è¯¢</el-button> |
| | | <el-button @click="resetForm('formInline')">æ¸
空</el-button> |
| | | <el-button type="primary" @click="onSubmit('formInline')">æ¥è¯¢</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | </el-card> |
| | |
| | | <el-col :span="12"> |
| | | <el-card> |
| | | <p>è´è´£äººåæ¶ç</p> |
| | | <div id="leaderTimly" style="width:100%;height:400px;"></div> |
| | | <div id="leaderTimely" style="width:100%;height:400px;"></div> |
| | | </el-card> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-card> |
| | | <p>å®éªååæ¶ç</p> |
| | | <div id="testerTimly" style="width:100%;height:400px;"></div> |
| | | <div id="testerTimely" style="width:100%;height:400px;"></div> |
| | | </el-card> |
| | | </el-col> |
| | | </el-row> |
| | | </div> |
| | | <div class="work-foot"></div> |
| | | <div class="work-foot"> |
| | | <el-button type="primary">æ°æ®å¯¼åº</el-button> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import * as echarts from 'echarts'; |
| | | import { getDutyMater,getDutyTimely,getExecuteMater,getExecuteTimely |
| | | } from '@/api/chart/work/index' |
| | | export default { |
| | | data() { |
| | | return { |
| | | formInline: { |
| | | user: '', |
| | | region: '' |
| | | date: null, |
| | | type: '' |
| | | }, |
| | | dateTime: '', |
| | | rules: { |
| | | type: [ |
| | | { required: true, message: 'è¯·éæ©æ£æµç±»å', trigger: 'change' } |
| | | ], |
| | | date: [ |
| | | {required: true, message: 'è¯·éæ©æ¥æ', trigger: 'change' } |
| | | ] |
| | | }, |
| | | } |
| | | }, |
| | | mounted(){ |
| | | this.initLeaderStatiChart('leaderStati'); |
| | | this.initLeaderTimlyChart(); |
| | | this.initLeaderStatiChart('testerStati'); |
| | | this.initTesterTimlyChart(); |
| | | // this.initLeaderStatiChart(""); |
| | | this.initLeaderTimelyChart("leaderTimely"); |
| | | this.initTesterStatiChart("testerStati"); |
| | | this.initTesterTimelyChart("testerTimely"); |
| | | }, |
| | | methods: { |
| | | onSubmit() { |
| | | console.log('submit!'); |
| | | async queryData(){ |
| | | let date = this.formInline.date; |
| | | let obj = { |
| | | startTime : date[0], |
| | | endTime : date[1], |
| | | type : this.formInline.type |
| | | } |
| | | const dutyMater = await getDutyMater(obj); |
| | | const dutyTimely = await getDutyTimely(obj); |
| | | const executeMater = await getExecuteMater(obj); |
| | | const executeTimely = await getExecuteTimely(obj); |
| | | console.log("dm",dutyMater.data); |
| | | console.log("dt",dutyTimely.data); |
| | | console.log("em",executeMater.data.length); |
| | | console.log("et",executeTimely.data); |
| | | this.initLeaderStatiChart("leaderStati",dutyMater.data); |
| | | this.initLeaderTimelyChart("leaderTimely",dutyTimely.data); |
| | | this.initTesterStatiChart("testerStati",executeMater.data); |
| | | this.initTesterTimelyChart("testerTimely",executeTimely.data); |
| | | }, |
| | | initLeaderStatiChart(id){ |
| | | onSubmit(formName) { |
| | | this.$refs[formName].validate((valid) => { |
| | | if (valid) { |
| | | this.queryData(); |
| | | } else { |
| | | console.log('error submit!!'); |
| | | return false; |
| | | } |
| | | }); |
| | | }, |
| | | resetForm(formName) { |
| | | this.formInline.date = null; |
| | | this.formInline.type = null; |
| | | this.$refs[formName].resetFields(); |
| | | }, |
| | | initLeaderStatiChart(id,dutyMater){ |
| | | var chartDom = document.getElementById(id); |
| | | var myChart = echarts.init(chartDom); |
| | | window.addEventListener('resize', function() { |
| | | myChart.resize(); |
| | | }); |
| | | var option; |
| | | |
| | | let max = 0; |
| | | let xAxisData = []; |
| | | let data1 = []; |
| | | let data2 = []; |
| | | let data3 = []; |
| | | let data4 = []; |
| | | for (let i = 0; i < 10; i++) { |
| | | xAxisData.push('Class' + i); |
| | | data1.push(+(Math.random() * 2).toFixed(2)); |
| | | data2.push(+(Math.random() * 5).toFixed(2)); |
| | | data3.push(+(Math.random() + 0.3).toFixed(2)); |
| | | data4.push(+Math.random().toFixed(2)); |
| | | for(let i=0;i<dutyMater.length;i++){ |
| | | xAxisData.push(dutyMater[i].name); |
| | | data1.push(dutyMater[i].finsh); |
| | | data2.push(dutyMater[i].unfinish); |
| | | let sum = dutyMater[i].finsh + dutyMater[i].unfinish; |
| | | if( sum > max ){ |
| | | max = sum; |
| | | } |
| | | } |
| | | var emphasisStyle = { |
| | | itemStyle: { |
| | |
| | | }; |
| | | option = { |
| | | legend: { |
| | | data: ['bar', 'bar2'], |
| | | data: ['已宿', 'æªå®æ'], |
| | | left: 'center' |
| | | }, |
| | | tooltip: {}, |
| | |
| | | splitLine: { show: false }, |
| | | splitArea: { show: false } |
| | | }, |
| | | yAxis: {}, |
| | | yAxis: { |
| | | min: 0, |
| | | max: max, |
| | | interval: max, |
| | | }, |
| | | grid: { |
| | | bottom: 100 |
| | | }, |
| | | series: [ |
| | | { |
| | | name: 'bar', |
| | | name: '已宿', |
| | | barWidth: '20%', |
| | | type: 'bar', |
| | | stack: 'one', |
| | | emphasis: emphasisStyle, |
| | | data: data1 |
| | | data: data1, |
| | | itemStyle: { |
| | | color: '#80d9c5' |
| | | } |
| | | }, |
| | | { |
| | | name: 'bar2', |
| | | name: 'æªå®æ', |
| | | barWidth: '20%', |
| | | type: 'bar', |
| | | stack: 'one', |
| | | emphasis: emphasisStyle, |
| | | data: data2 |
| | | data: data2, |
| | | itemStyle: { |
| | | color: '#f2d09d' |
| | | }, |
| | | } |
| | | ] |
| | | }; |
| | | myChart.on('brushSelected', function (params) { |
| | | var brushed = []; |
| | | var brushComponent = params.batch[0]; |
| | | for (var sIdx = 0; sIdx < brushComponent.selected.length; sIdx++) { |
| | | var rawIndices = brushComponent.selected[sIdx].dataIndex; |
| | | brushed.push('[Series ' + sIdx + '] ' + rawIndices.join(', ')); |
| | | } |
| | | myChart.setOption({ |
| | | title: { |
| | | backgroundColor: '#333', |
| | | text: 'SELECTED DATA INDICES: \n' + brushed.join('\n'), |
| | | bottom: 0, |
| | | right: '10%', |
| | | width: 100, |
| | | textStyle: { |
| | | fontSize: 12, |
| | | color: '#fff' |
| | | } |
| | | } |
| | | option && myChart.setOption(option); |
| | | }, |
| | | initTesterStatiChart(id,executeMater){ |
| | | console.log("qqq----",executeMater); |
| | | var chartDom = document.getElementById(id); |
| | | var myChart = echarts.init(chartDom); |
| | | window.addEventListener('resize', function() { |
| | | myChart.resize(); |
| | | }); |
| | | var option; |
| | | |
| | | let xAxisData = []; |
| | | let data1 = []; |
| | | let data2 = []; |
| | | // for(let i=0;i<executeMater.length;i++){ |
| | | // xAxisData.push(executeMater[i].name); |
| | | // data1.push(executeMater[i].finsh); |
| | | // data2.push(executeMater[i].unfinsh); |
| | | // } |
| | | var emphasisStyle = { |
| | | itemStyle: { |
| | | shadowBlur: 10, |
| | | shadowColor: 'rgba(0,0,0,0.3)' |
| | | } |
| | | }; |
| | | option = { |
| | | legend: { |
| | | data: ['æ°æ®1', 'æ°æ®2'], |
| | | left: 'center' |
| | | }, |
| | | tooltip: {}, |
| | | xAxis: { |
| | | data: xAxisData, |
| | | name: 'å§å', |
| | | axisLine: { onZero: true }, |
| | | splitLine: { show: false }, |
| | | splitArea: { show: false } |
| | | }, |
| | | yAxis: { |
| | | min: 0, |
| | | max: 60, |
| | | interval: 10, |
| | | }, |
| | | grid: { |
| | | bottom: 100 |
| | | }, |
| | | series: [ |
| | | { |
| | | name: 'æ°æ®1', |
| | | type: 'bar', |
| | | stack: 'one', |
| | | emphasis: emphasisStyle, |
| | | data: data1, |
| | | itemStyle:{ |
| | | color: "#d97559" |
| | | } |
| | | }, |
| | | { |
| | | name: 'æ°æ®2', |
| | | type: 'bar', |
| | | stack: 'one', |
| | | emphasis: emphasisStyle, |
| | | data: data2, |
| | | itemStyle:{ |
| | | color: "#e4c477" |
| | | } |
| | | } |
| | | ] |
| | | }; |
| | | option && myChart.setOption(option); |
| | | }, |
| | | initLeaderTimelyChart(id,dutyTimely){ |
| | | var chartDom = document.getElementById(id); |
| | | var myChart = echarts.init(chartDom); |
| | | window.addEventListener('resize', function() { |
| | | myChart.resize(); |
| | | }); |
| | | var option; |
| | | option = { |
| | | tooltip: { |
| | | trigger: 'axis', |
| | | axisPointer: { |
| | | type: 'cross', |
| | | crossStyle: { |
| | | color: '#999' |
| | | } |
| | | } |
| | | }, |
| | | legend: { |
| | | data: ['æ ·åæ°', '宿忶ç'] |
| | | }, |
| | | xAxis: [ |
| | | { |
| | | name: 'å§å', |
| | | type: 'category', |
| | | data: ['æ²ç§',], |
| | | axisPointer: { |
| | | type: 'shadow' |
| | | }, |
| | | itemStyle: { |
| | | top: '20px' |
| | | } |
| | | } |
| | | ], |
| | | yAxis: [ |
| | | { |
| | | type: 'value', |
| | | name: 'æ°é', |
| | | min: 0, |
| | | max: 10, |
| | | interval: 1, |
| | | axisLabel: { |
| | | formatter: '{value}' |
| | | } |
| | | }, |
| | | { |
| | | type: 'value', |
| | | name: 'ç¾åæ¯', |
| | | min: 0, |
| | | max: 100, |
| | | interval: 10, |
| | | axisLabel: { |
| | | formatter: '{value} %' |
| | | } |
| | | } |
| | | ], |
| | | series: [ |
| | | { |
| | | name: 'æ ·åæ°', |
| | | type: 'bar', |
| | | barWidth: '20%', |
| | | tooltip: { |
| | | valueFormatter: function (value) { |
| | | return value; |
| | | } |
| | | }, |
| | | data: [4.0], |
| | | itemStyle: { |
| | | color: '#9fceff' |
| | | } |
| | | }, |
| | | { |
| | | name: '宿忶ç', |
| | | type: 'line', |
| | | tooltip: { |
| | | valueFormatter: function (value) { |
| | | return value + ' %'; |
| | | } |
| | | }, |
| | | data: [7.5], |
| | | itemStyle: { |
| | | color: '#d2eec5' |
| | | } |
| | | }, |
| | | ] |
| | | }; |
| | | |
| | | option && myChart.setOption(option); |
| | | }, |
| | | initTesterStatiChart(){ |
| | | |
| | | initTesterTimelyChart(id,executeTimely){ |
| | | var chartDom = document.getElementById(id); |
| | | var myChart = echarts.init(chartDom); |
| | | window.addEventListener('resize', function() { |
| | | myChart.resize(); |
| | | }); |
| | | var option; |
| | | option = { |
| | | tooltip: { |
| | | trigger: 'axis', |
| | | axisPointer: { |
| | | type: 'cross', |
| | | crossStyle: { |
| | | color: '#999' |
| | | } |
| | | } |
| | | }, |
| | | initLeaderTimlyChart(){ |
| | | |
| | | legend: { |
| | | data: ['é¡¹ç®æ°', '宿忶ç'], |
| | | show: true |
| | | }, |
| | | initTesterTimlyChart(){ |
| | | xAxis: [ |
| | | { |
| | | type: 'category', |
| | | data: ["","",""], |
| | | axisPointer: { |
| | | type: 'shadow' |
| | | } |
| | | } |
| | | ], |
| | | yAxis: [ |
| | | { |
| | | type: 'value', |
| | | name: '', |
| | | min: 0, |
| | | max: 50, |
| | | interval: 5, |
| | | axisLabel: { |
| | | formatter: '{value}' |
| | | } |
| | | }, |
| | | { |
| | | type: 'value', |
| | | name: '', |
| | | min: 0, |
| | | max: 100, |
| | | interval: 10, |
| | | axisLabel: { |
| | | formatter: '{value} %' |
| | | } |
| | | } |
| | | ], |
| | | series: [ |
| | | { |
| | | name: 'é¡¹ç®æ°', |
| | | type: 'bar', |
| | | tooltip: { |
| | | valueFormatter: function (value) { |
| | | return value ; |
| | | } |
| | | }, |
| | | data: [2.0, 4.9, 7.0], |
| | | itemStyle: { |
| | | color: '#5087ec' |
| | | } |
| | | }, |
| | | { |
| | | name: '宿忶ç', |
| | | type: 'line', |
| | | yAxisIndex: 1, |
| | | tooltip: { |
| | | valueFormatter: function (value) { |
| | | return value + ' %'; |
| | | } |
| | | }, |
| | | data: [2.0, 2.2, 3.3], |
| | | itemStyle: { |
| | | color: '#68bbc4' |
| | | } |
| | | } |
| | | ] |
| | | }; |
| | | |
| | | option && myChart.setOption(option); |
| | | }, |
| | | } |
| | | } |
| | |
| | | padding: 0; |
| | | .work-head{ |
| | | width:94%; |
| | | height:100; |
| | | height:100px; |
| | | margin: 5px 10px; |
| | | position: fixed; |
| | | z-index: 10; |
| | |
| | | } |
| | | } |
| | | .buttons{ |
| | | margin: 40px 0px 0px 900px; |
| | | margin: 40px 0px 0px 50%; |
| | | } |
| | | } |
| | | } |
| | | .work-center{ |
| | | margin: 0px 0px 5px 10px; |
| | | margin: 0px 0px 150px 10px; |
| | | padding: 18vh 0px 5px 0px; |
| | | .el-card{ |
| | | margin: 5px 0px; |
| | | height:500px; |
| | | p{ |
| | | font-size: 22px; |
| | | margin: 0; |
| | | padding: 0; |
| | | } |
| | | } |
| | | } |
| | | .work-foot{ |
| | | width:100%; |
| | | height:50px; |
| | | position: fixed; |
| | | bottom: 0px; |
| | | z-index: 10; |
| | | text-align: right; |
| | | .el-button{ |
| | | margin-right: 7%; |
| | | } |
| | | } |
| | | } |
| | |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-card :body-style="{ padding: '0px',height:'25vh' }"> |
| | | <p style="z-index: 10;position: absolute;font-size: 10px;margin-left: 10px;color: #ff0000;">æªæ£éª</p> |
| | | <p style="z-index: 2;position: absolute;font-size: 10px;margin-left: 10px;color: #ff0000;">æªæ£éª</p> |
| | | <el-table |
| | | :data="uncheckedData" |
| | | :cell-style="cell" |
| | |
| | | import * as echarts from 'echarts'; |
| | | import { getVerifiedTop3,getUncheckedTop4,getMatAndFinshQualified, |
| | | getCheckAndProjectNum,getTurno |
| | | } from '@/api/home' |
| | | } from '@/api/home/index' |
| | | export default { |
| | | name: "home", |
| | | data() { |
| | |
| | | insNum: 0, |
| | | insUnNum: 0, |
| | | insproNum: 0, |
| | | insproUnNum: 1110, |
| | | insproUnNum: 0, |
| | | radioType: "æ¬å¹´", |
| | | imgSrc: require("@/assets/404_images/bg.png"), |
| | | verifiedData: new Array(), |
| | |
| | | <el-input v-model="searchData.roleName" class="input-form" placeholder="请è¾å
¥è§è²åç§°" style="width:250px"> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item label="æéï¼" class="sermargin"> |
| | | <el-input v-model="searchData.permission" class="input-form" placeholder="请è¾å
¥æé" style="width:250px"> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item class="rightBtn"> |
| | | <el-button type="primary">æ¥è¯¢</el-button> |
| | | <el-button type="primary" plain>éç½®</el-button> |
| | |
| | | <el-table :max-height="800" :cell-style="{ textAlign: 'center' }" |
| | | :header-cell-style="{ border: '0px', background: '#f5f7fa', color: '#606266', boxShadow: 'inset 0 1px 0 #ebeef5', textAlign: 'center' }" |
| | | :data="roleTable" style="width: 100%"> |
| | | <el-table-column type="selection" min-width="8%" /> |
| | | <el-table-column prop="rolename" label="è§è²åç§°" min-width="20%" /> |
| | | <el-table-column prop="permission" label="æé" min-width="20%" /> |
| | | <el-table-column prop="create_time" label="å建æ¶é´" min-width="20%" /> |
| | | <el-table-column prop="update_time" label="æ´æ°æ¶é´" min-width="20%" /> |
| | | <el-table-column type="index" min-width="8%" /> |
| | | <el-table-column prop="roleName" label="è§è²åç§°" min-width="20%" /> |
| | | <el-table-column prop="createTime" label="å建æ¶é´" min-width="20%" /> |
| | | <el-table-column prop="updateTime" label="æ´æ°æ¶é´" min-width="20%" /> |
| | | <el-table-column label="æä½" min-width="12%"> |
| | | <template slot-scope="scope"> |
| | | <el-button type="text" size="small">ç¼è¾</el-button> |
| | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <el-dialog title="æ°å¢è§è²" :visible.sync="dialogTableVisible" width="60%"> |
| | | <el-dialog title="æ°å¢è§è²" :visible.sync="dialogTableVisible" width="50%"> |
| | | <el-form :model="roleAdd" ref="roleAdd" label-position="right" label-width="100px"> |
| | | <el-form-item label="è§è²å:"> |
| | | <el-input style="width: 300px" v-model="roleAdd.roleName" placeholder="请è¾å
¥è§è²å"> |
| | | <el-col :span="24" style="display: flex;justify-content: space-between;"> |
| | | <el-form-item :rules="nameaRules" label="è§è²å:"> |
| | | <el-input @blur="assertName" style="width: 300px" v-model="roleAdd.roleName" placeholder="请è¾å
¥è§è²å"> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item label="åè½éæ©:"> |
| | | <el-cascader size="medium " v-model="roleAdd.menuData" :options="menuInfo"> |
| | | <template slot-scope="{ node, data }"> |
| | | <!-- <el-form-item label="èåéæ©:"> |
| | | <el-cascader style="width: 300px" collapse-tags size="medium " filterable :props="props" |
| | | v-model="roleAdd.menuData" :options="menuInfo"> |
| | | <template slot-scope="{ data }"> |
| | | <span>{{ data.label }}</span> |
| | | <span v-if="!node.isLeaf"> ({{ }}) </span> |
| | | </template> |
| | | </el-cascader> |
| | | </el-form-item> |
| | | </el-form-item> --> |
| | | </el-col> |
| | | </el-form> |
| | | <el-col :span="24"> |
| | | <el-table height="300" :data="menuInfo" style="width: 100%;margin-bottom: 20px;" row-key="id" |
| | | :default-expand-all="false" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"> |
| | | <el-table-column highlight-current-row prop="parentId" label="èåç±»å" sortable width="180"> |
| | | <template slot-scope="scope"> |
| | | <span v-if="scope.row.parentId == 0 && scope.row.children != undefined" style="color: #409eff;">主èå</span> |
| | | <span v-if="scope.row.parentId == 0 && scope.row.children === undefined" style="color: #409eff;"> |
| | | 主èå |
| | | </span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="name" label="èåå" sortable width="180"> |
| | | <template slot-scope="scope"> |
| | | <el-col v-if="scope.row.parentId == 0"> |
| | | <span style="color: #409eff;">{{ scope.row.name }}</span> |
| | | </el-col> |
| | | <el-col v-else> |
| | | <span style="color: #40b815;">{{ scope.row.name }}</span> |
| | | </el-col> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="id" label="æä½æé"> |
| | | <template slot-scope="scope"> |
| | | <el-col v-if="scope.row.parentId == 0 && scope.row.children != undefined"> |
| | | <!-- <el-checkbox v-model="scope.row.select">æ¥è¯¢</el-checkbox> --> |
| | | </el-col> |
| | | <el-col v-else> |
| | | <el-checkbox size="medium" v-model="scope.row.selected" @change="chekSelect(scope)">æ¥è¯¢</el-checkbox> |
| | | <el-checkbox size="medium" v-model="scope.row.added" @change="chekAdd(scope)">æ·»å </el-checkbox> |
| | | <el-checkbox size="medium" v-model="scope.row.updated" @change="chekUpdate(scope)">ä¿®æ¹</el-checkbox> |
| | | <el-checkbox size="medium" v-model="scope.row.deleted" @change="chekDelet(scope)">å é¤</el-checkbox> |
| | | </el-col> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-col> |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button @click="dialogTableVisible = false">å æ¶</el-button> |
| | | <el-button @click="clearAll">å æ¶</el-button> |
| | | <el-button type="primary" @click="addRole">ç¡® å®</el-button> |
| | | </span> |
| | | </el-dialog> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { getMenusTree } from '@/api/laboratory/role' |
| | | import { getMenusTree, addRoleInfo, assertRepeat, getAllRoleAndMenuInfo } from '@/api/laboratory/role' |
| | | import { default as menuPower } from './menuPower.vue' |
| | | export default { |
| | | components: { |
| | | menuPower: () => import('./menuPower.vue') |
| | | }, |
| | | data() { |
| | | return { |
| | | props: { multiple: true }, |
| | |
| | | roleName: null, |
| | | menuData: null |
| | | }, |
| | | nameaRules: [{ required: true, message: '请è¾å
¥è§è²å' }], |
| | | menuTableTree: null, |
| | | searchData: { |
| | | roleName: '', |
| | | permission: '' |
| | | }, |
| | | assertRepeatName: true, |
| | | menuInfo: [], |
| | | roleTable: [{ |
| | | rolename: 'é¨é¿', |
| | | permission: 'ROOT', |
| | | create_time: '2023-07-04 12:12:12', |
| | | update_time: '2023-07-04 12:12:12' |
| | | }, { |
| | | rolename: 'ç»é¿', |
| | | permission: '--', |
| | | create_time: '2023-07-04 12:12:12', |
| | | update_time: '2023-07-04 12:12:12' |
| | | }], |
| | | roleTable: [], |
| | | updateData: { |
| | | oldPassWord: '', |
| | | newPassWord: '', |
| | |
| | | created() { |
| | | |
| | | }, |
| | | mounted() { |
| | | this.start() |
| | | }, |
| | | methods: { |
| | | chekSelect(scope) { |
| | | |
| | | }, |
| | | async start() { |
| | | let res = await getAllRoleAndMenuInfo() |
| | | this.roleTable = res.data |
| | | console.log(res); |
| | | }, |
| | | async assertName() { |
| | | if (this.roleAdd.roleName == null || this.roleAdd.roleName == '') { |
| | | this.$message({ |
| | | message: '请è¾å
¥è§è²å', |
| | | type: 'warning' |
| | | }); |
| | | return |
| | | } |
| | | let res = await assertRepeat({ roleName: this.roleAdd.roleName }) |
| | | if (!res.data) { |
| | | this.assertRepeatName = false |
| | | this.$message({ |
| | | message: 'è§è²åéå¤ï¼è¯·éæ°è¾å
¥ï¼', |
| | | type: 'warning' |
| | | }); |
| | | } else { |
| | | this.assertRepeatName = true |
| | | } |
| | | }, |
| | | chekAdd(scope) { |
| | | scope.row.selected = true |
| | | }, |
| | | chekUpdate(scope) { |
| | | scope.row.selected = true |
| | | }, |
| | | chekDelet(scope) { |
| | | scope.row.selected = true |
| | | }, |
| | | async addClickRole() { |
| | | let res = await getMenusTree(); |
| | | this.menuInfo = res.data |
| | | this.menuInfo.forEach(item => { |
| | | item.select = false |
| | | item.add = false |
| | | item.update = false |
| | | item.delete = false |
| | | this.$set(item, 'selected', false); |
| | | this.$set(item, 'added', false); |
| | | this.$set(item, 'updated', false); |
| | | this.$set(item, 'deleted', false); |
| | | if (item.children.length == 0) { |
| | | delete item['children'] |
| | | } else { |
| | | item.children.forEach(c => { |
| | | c.select = false |
| | | c.add = false |
| | | c.update = false |
| | | c.delete = false |
| | | this.$set(c, 'selected', false); |
| | | this.$set(c, 'added', false); |
| | | this.$set(c, 'updated', false); |
| | | this.$set(c, 'deleted', false); |
| | | if (c.children.length == 0) { |
| | | delete c['children'] |
| | | } |
| | |
| | | } |
| | | }) |
| | | this.dialogTableVisible = true |
| | | // console.log(this.dialogTableVisible) |
| | | }, |
| | | addRole() { |
| | | console.log(this.roleAdd); |
| | | async addRole() { |
| | | if (this.roleAdd.roleName == null || this.roleAdd.roleName == '') { |
| | | this.$message({ |
| | | message: '请è¾å
¥è§è²å', |
| | | type: 'warning' |
| | | }); |
| | | return |
| | | } |
| | | if (!this.assertRepeatName) { |
| | | this.$message({ |
| | | message: 'è§è²åéå¤ï¼è¯·éæ°è¾å
¥', |
| | | type: 'warning' |
| | | }); |
| | | return |
| | | } |
| | | this.menuInfo.forEach(item => { |
| | | if (item.children != undefined) { |
| | | item.children.forEach(c => { |
| | | if (c.added) { |
| | | item.selected = true |
| | | } |
| | | if (c.selected) { |
| | | item.selected = true |
| | | } |
| | | if (c.updated) { |
| | | item.selected = true |
| | | } |
| | | if (c.deleted) { |
| | | item.selected = true |
| | | } |
| | | }) |
| | | } |
| | | }) |
| | | console.log(this.menuInfo); |
| | | this.roleAdd.menuData = JSON.parse(JSON.stringify(this.menuInfo)); |
| | | this.roleAdd.menuData.forEach(item => { |
| | | if (item.children != undefined) { |
| | | let child = item.children.filter(c => { |
| | | return c.added == true || c.selected == true || c.deleted == true || c.updated === true |
| | | }) |
| | | item.children = child |
| | | } |
| | | }) |
| | | this.roleAdd.menuData = this.roleAdd.menuData.filter(item => { |
| | | return item.selected == true |
| | | }) |
| | | let res = await addRoleInfo(this.roleAdd); |
| | | if (res.data) { |
| | | this.$message({ |
| | | message: 'æ·»å è§è²æå', |
| | | type: 'success' |
| | | }); |
| | | this.dialogTableVisible = false |
| | | } else { |
| | | this.$message.error('æ·»å 失败ï¼è¯·éæ°æä½'); |
| | | } |
| | | }, |
| | | assertDml(a, b) { |
| | | a = b ? true : false |
| | | console.log(a); |
| | | return a |
| | | }, |
| | | // search(){}, |
| | | // reset(){}, |
| | |
| | | handleCurrentChange(val) { |
| | | console.log(`å½åæ¯ç¬¬${val}页`) |
| | | this.currentPage = val |
| | | }, |
| | | clearAll() { |
| | | this.roleAdd.roleName = null |
| | | this.roleAdd.menuData = null |
| | | this.menuInfo = [] |
| | | this.assertRepeatName = true |
| | | this.dialogTableVisible = false |
| | | } |
| | | } |
| | | } |
¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div> |
| | | |
| | | </div> |
| | | </template> |
| | | <script> |
| | | export default { |
| | | data() { |
| | | return { |
| | | |
| | | } |
| | | }, |
| | | created() { |
| | | |
| | | }, |
| | | methods: { |
| | | |
| | | } |
| | | } |
| | | </script> |
| | | <style scoped></style> |