提交 ed9820d2 authored 作者: Yroc's avatar Yroc

后端优化

上级 7421b204
<!-- -->
<script>
/**
* @Author: AnthonyD
* @Date: 2023-03-28 10:34:24
* @Last Modified by: AnthonyD
* @Last Modified time: 2023-04-15 18:02:16
*/
</script><!-- -->
<template>
<div class="chart_container" :id="chart_id"></div>
</template>
<script>
export default {
props: ['chart_data', 'chart_id'],
data() {
return {
};
return {};
},
components: {},
computed: {},
created() {
},
created() {},
mounted() {
this.initChart();
// console.log('@@@@@@@@@@@');
// console.log(this.chart_data);
},
methods: {
initChart() {
let colors = ['#bcdfdc', '#47afa0', '#cd9f50'];
let series = this.changData(this.chart_data);
let legend_data = this.chart_data.labers.map(item => {
return item.key
})
// console.log(series);
let legend_data = this.chart_data.labers.map((item) => {
return item.key;
});
let _that = this;
let dom = document.getElementById(`${this.chart_id}`);
let myChart = this.$echarts.init(dom, null, {
renderer: 'canvas',
useDirtyRect: false
useDirtyRect: false,
});
let labers = this.chart_data.labers.map((item) => {
return item.label;
});
let option;
option = {
color: ['#cd9f50', '#47afa0', '#bcdfdc'],
color: colors,
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
type: 'shadow',
},
},
legend: {
// data: ['Forest', 'Steppe', 'Desert', 'Wetland']
// data: legend_data,
formatter: (name) => {
let objs = this.chart_data.labers.filter(itme => {
/* formatter: (name) => {
let objs = this.chart_data.labers.filter((itme) => {
return itme.key == name;
})
return objs[0].label
}
});
return objs[0].label;
}, */
data: labers,
},
toolbox: {
show: false,
......@@ -62,64 +73,30 @@ export default {
dataView: { show: true, readOnly: false },
magicType: { show: true, type: ['line', 'bar', 'stack'] },
restore: { show: true },
saveAsImage: { show: true }
}
saveAsImage: { show: true },
},
},
xAxis: [
{
type: 'category',
axisTick: { show: false },
// data: ['2012', '2013', '2014', '2015', '2016']
data: this.chart_data.keys
}
data: this.chart_data.keys,
interval: 0,
axisLabel: {
show: true,
rotate: -90,
},
},
],
yAxis: [
{
type: 'value'
}
type: 'value',
},
],
// series: [
// {
// name: 'Forest',
// type: 'bar',
// barGap: 0,
// // label: labelOption,
// emphasis: {
// focus: 'series'
// },
// data: [320, 332, 301, 334, 390]
// },
// {
// name: 'Steppe',
// type: 'bar',
// // label: labelOption,
// emphasis: {
// focus: 'series'
// },
// data: [220, 182, 191, 234, 290]
// },
// {
// name: 'Desert',
// type: 'bar',
// // label: labelOption,
// emphasis: {
// focus: 'series'
// },
// data: [150, 232, 201, 154, 190]
// },
// {
// name: 'Wetland',
// type: 'bar',
// // label: labelOption,
// emphasis: {
// focus: 'series'
// },
// data: [98, 77, 101, 99, 40]
// }
// ]
series: series
};
series: series,
};
if (option && typeof option === 'object') {
myChart.setOption(option);
......@@ -132,24 +109,26 @@ export default {
let list = [];
data.labers.forEach((item, index) => {
let obj = {
name: item.key,
itemStyle: {
normal: { label: { show: true, position: 'top' } },
},
name: item.label,
type: 'bar',
barGap: 0,
emphasis: {
focus: 'series'
focus: 'series',
},
data: []
}
data.keys.forEach(element => {
data: [],
};
data.keys.forEach((element) => {
obj.data.push(data.raw_data[element][item.key]);
});
list.push(obj)
list.push(obj);
});
return list
return list;
},
}
}
},
};
</script>
<style scoped>
.chart_container {
......
......@@ -9,38 +9,132 @@
<div class="container_box">
<table class="table_box">
<tr>
<th v-for="(e, i) in labers" :key="i">{{ e.label }}</th>
<th v-for="(e, i) in labers" :key="i" style="padding: 15px 10px">
{{ e.label
}}<i
class="el-icon-caret-bottom"
:style="
'color: ' +
(e.key == sort_field && sort_type == 'desc' ? '#038d6e' : '')
"
@click="sort(e.key, 'desc')"
></i
><i
class="el-icon-caret-top"
:style="
'color: ' +
(e.key == sort_field && sort_type == 'asc' ? '#038d6e' : '')
"
@click="sort(e.key, 'asc')"
></i>
</th>
</tr>
<tr v-for="(item, index) in table_data" :key="index">
<td v-for="(e, i) in labers" :key="i">
<div v-if="typeof item[e.key] === 'object'">
<el-popover placement="top-start" width="200" trigger="hover">
<!-- <el-popover placement="top-start" width="200" trigger="hover">
<div>
<el-form label-width="80px">
<!-- <el-form-item label="正确数据: ">
<span v-for="(o, b) in item[e.key].exactness.value">{{ o
}},</span>
</el-form-item> -->
<el-form-item label="错误数据: ">
<span v-for="(o, b) in item[e.key].wrong.value">{{ o }},</span>
<span v-for="(o, b) in item[e.key].wrong.value" :key="b"
>{{ o }},</span
>
</el-form-item>
</el-form>
</div>
<el-button slot="reference" type="text" size="mini">{{ item[e.key].accuracy.value }}</el-button>
</el-popover>
<el-button slot="reference" type="text" size="mini">{{
item[e.key].accuracy.value
}}</el-button>
</el-popover> -->
<span slot="reference" type="text" size="mini">
{{ item[e.key] }}
</span>
</div>
<el-popover
v-else-if="e.key === 'stability'"
placement="top-start"
width="100%"
trigger="hover"
>
<div
v-if="
Object.prototype.toString.call(item.conclusion_data) ===
'[object Array]'
"
>
学员答案:{{ item.conclusion_data.join(',') }}
</div>
<div v-else>
<el-table
:data="table_data[index].conclusion_table"
height="250"
border
style="width: 100%"
>
<el-table-column
prop="student_id"
sortable
label="学员信息"
width="180"
>
<template slot-scope="scope">
{{ scope.row.name }}({{ scope.row.student_id }})
</template>
</el-table-column>
<el-table-column
prop="conclusion"
sortable
label="稳定性"
width="180"
>
</el-table-column>
<el-table-column
label="学员答案"
sortable
prop="conclusion_data"
width="180"
>
<template slot-scope="scope">
{{ scope.row.conclusion_data.join(',') }}
</template>
</el-table-column>
</el-table>
</div>
<span slot="reference">{{ item[e.key] }}</span>
</el-popover>
<div v-else>{{ item[e.key] }}</div>
</td>
</tr>
</table>
<!-- <el-table :data="table_data" border style="width: 100%">
<el-table-column
v-for="(item, index) in labers"
:key="index"
:label="item.label"
:width="item.width"
>
<template slot="header">
<div>{{ item.label }}</div>
</template>
<template slot-scope="scope">
<div>{{ scope.row[item.key] }}</div>
</template>
</el-table-column>
</el-table> -->
</div>
</template>
<script>
export default {
props: ['table_data', 'labers'],
props: ['table_data', 'labers', 'is_pover'],
data() {
return {
sort_field: null,
sort_type: null,
};
},
......@@ -48,25 +142,66 @@ export default {
computed: {},
created() {
// console.log(this.table_data);
// console.log(this.labers);
},
mounted() { },
mounted() {},
methods: {
test(item) {
console.log('判断对象');
console.log(item);
console.log(typeof item == 'object');
},
sort(col, type = 'desc') {
this.sort_field = col;
this.sort_type = type;
if (type == 'asc') {
this.table_data.sort((a, b) => {
let a_n =
parseFloat(a[col]) != a[col] ? a[col].split('~')[0] : a[col];
let b_n =
parseFloat(b[col]) != b[col] ? b[col].split('~')[0] : b[col];
if (parseFloat(a_n) == a_n && parseFloat(b_n) == b_n) {
return a_n - b_n;
} else if (a_n < b_n) {
return -1;
} else if (a_n > b_n) {
return 1;
} else {
return 0;
}
}
}); //升序
} else {
this.table_data.sort((a, b) => {
let a_n =
parseFloat(a[col]) != a[col] ? a[col].split('~')[0] : a[col];
let b_n =
parseFloat(b[col]) != b[col] ? b[col].split('~')[0] : b[col];
if (parseFloat(a_n) == a_n && parseFloat(b_n) == b_n) {
return b_n - a_n;
} else if (b_n < a_n) {
return -1;
} else if (b_n > a_n) {
return 1;
} else {
return 0;
}
}); //降序
}
},
},
};
</script>
<style lang="scss" scoped>
.container_box {
width: 100%;
height: 100%;
position: relative;
}
.el-icon-caret-bottom {
position: absolute;
top: 20px;
}
.el-icon-caret-top {
position: absolute;
top: 13px;
}
.table_box {
......@@ -74,8 +209,8 @@ export default {
// min-height: 100%;
text-align: center;
font-size: 14px;
border-top: 1px solid #E4E7ED;
border-left: 1px solid #E4E7ED;
border-top: 1px solid #e4e7ed;
border-left: 1px solid #e4e7ed;
border-collapse: collapse;
th,
......@@ -83,8 +218,8 @@ export default {
margin: 0;
padding: 0;
font-size: 14px;
border-bottom: 1px solid #E4E7ED;
border-right: 1px solid #E4E7ED;
border-bottom: 1px solid #e4e7ed;
border-right: 1px solid #e4e7ed;
}
th {
......
<!--
* @Author: czj
* @Date: 2023-03-21 10:14:46
* @Description:
* @FilePath: \AdministrationHome\src\components\AnalyseModule\components\table.vue
-->
<!-- -->
<template>
<div class="container_box">
<div>
<el-select
v-model="select_value"
style="width: 100%"
@change="selectChange"
>
<el-option v-for="(e, i) in select_list" :label="e" :value="e" :key="i">
</el-option>
</el-select>
</div>
<table class="table_box">
<tr>
<!-- #038d6e -->
<th v-for="(e, i) in labers" :key="i" style="padding: 15px 10px">
{{ e.label
}}<span
><i
class="el-icon-caret-bottom"
:style="
'color: ' +
(e.key == sort_field && sort_type == 'desc' ? '#038d6e' : '')
"
@click="sort(e.key, 'desc')"
></i
><i
class="el-icon-caret-top"
:style="
'color: ' +
(e.key == sort_field && sort_type == 'asc' ? '#038d6e' : '')
"
@click="sort(e.key, 'asc')"
></i
></span>
</th>
</tr>
<tr v-for="(item, index) in table_list" :key="index">
<td v-for="(e, i) in labers" :key="i">
<div>{{ item[e.key] }}</div>
</td>
</tr>
</table>
</div>
</template>
<script>
export default {
props: ['table_data', 'labers'],
data() {
return {
sort_field: null,
sort_type: null,
table_list: null,
select_list: [],
select_value: '',
};
},
components: {},
computed: {},
created() {
// console.log('是否加载');
// console.log(this.table_data);
// console.log(this.labers);
this.select_value = this.table_data.select_value;
this.select_list = [...this.table_data.topic];
this.table_list = this.table_data.list[this.table_data.topic[0]];
},
mounted() {},
methods: {
sort(col, type = 'desc') {
this.sort_field = col;
this.sort_type = type;
if (type == 'asc') {
this.table_list.sort((a, b) => {
let a_n =
parseFloat(a[col]) != a[col] ? a[col].split('~')[0] : a[col];
let b_n =
parseFloat(b[col]) != b[col] ? b[col].split('~')[0] : b[col];
if (parseFloat(a_n) == a_n && parseFloat(b_n) == b_n) {
return a_n - b_n;
} else if (a_n < b_n) {
return -1;
} else if (a_n > b_n) {
return 1;
} else {
return 0;
}
}); //升序
} else {
this.table_list.sort((a, b) => {
let a_n =
parseFloat(a[col]) != a[col] ? a[col].split('~')[0] : a[col];
let b_n =
parseFloat(b[col]) != b[col] ? b[col].split('~')[0] : b[col];
if (parseFloat(a_n) == a_n && parseFloat(b_n) == b_n) {
return b_n - a_n;
} else if (b_n < a_n) {
return -1;
} else if (b_n > a_n) {
return 1;
} else {
return 0;
}
}); //降序
}
},
//选择监听
selectChange(val) {
console.log('val');
console.log(val);
this.table_list = [...this.table_data.list[val]];
},
},
};
</script>
<style lang="scss" scoped>
.container_box {
width: 100%;
height: 100%;
position: relative;
}
.el-icon-caret-bottom {
position: absolute;
top: 56px;
}
.el-icon-caret-top {
position: absolute;
top: 49px;
}
.table_box {
width: 100%;
// min-height: 100%;
text-align: center;
font-size: 14px;
border-top: 1px solid #e4e7ed;
border-left: 1px solid #e4e7ed;
border-collapse: collapse;
th,
td {
margin: 0;
padding: 0;
font-size: 14px;
border-bottom: 1px solid #e4e7ed;
border-right: 1px solid #e4e7ed;
}
th {
padding: 15px 0;
color: #909399;
}
td {
padding: 5px 0;
color: #303133;
}
}
</style>
......@@ -7,6 +7,9 @@
<!-- -->
<template>
<div class="container_box">
<!-- <el-select v-model="">
<el-option></el-option>
</el-select> -->
<table class="table_box">
<!-- <tr>
<th v-for="(e, i) in labers" :key="i">{{ e.label }}</th>
......@@ -22,22 +25,27 @@
<script>
export default {
props: ['table_data',],
props: ['table_data'],
data() {
return {
sel: '',
};
},
components: {},
computed: {},
created() {
created() {},
mounted() {
// console.log(this.table_data);
},
mounted() { },
methods: {
//保留两位,四舍五入
keepTwoDecimal(num) {
if (num.includes(',')) {
return num;
} else {
var result = parseFloat(num);
if (isNaN(result)) {
return false;
......@@ -46,8 +54,9 @@ export default {
return result;
}
}
}
}
},
},
};
</script>
<style lang="scss" scoped>
.container_box {
......@@ -60,8 +69,8 @@ export default {
min-height: 100%;
text-align: center;
font-size: 14px;
border-top: 1px solid #E4E7ED;
border-left: 1px solid #E4E7ED;
border-top: 1px solid #e4e7ed;
border-left: 1px solid #e4e7ed;
border-collapse: collapse;
th,
......@@ -69,8 +78,8 @@ export default {
margin: 0;
padding: 0;
font-size: 14px;
border-bottom: 1px solid #E4E7ED;
border-right: 1px solid #E4E7ED;
border-bottom: 1px solid #e4e7ed;
border-right: 1px solid #e4e7ed;
}
th {
......
......@@ -9,31 +9,75 @@
<div class="container_box">
<table class="table_box">
<tr>
<th v-for="(e, i) in labers" :key="i">{{ e.label }}</th>
<th v-for="(e, i) in labers" :key="i" style="padding: 15px 10px">
{{ e.label
}}<span
><i
class="el-icon-caret-bottom"
:style="
'color: ' +
(e.key == sort_field && sort_type == 'desc' ? '#038d6e' : '')
"
@click="sort(e.key, 'desc')"
></i
><i
class="el-icon-caret-top"
:style="
'color: ' +
(e.key == sort_field && sort_type == 'asc' ? '#038d6e' : '')
"
@click="sort(e.key, 'asc')"
></i
></span>
</th>
</tr>
<tr v-for="(item, index) in table_data" :key="index">
<td v-for="(e, i) in labers" :key="i">
<div v-if="e.key == 'distribute'">
<div v-if="item['distribute'].length > 3">
<el-popover placement="right" title="标题" width="200" trigger="click">
<div
v-if="
typeof item['distribute'] == 'object' &&
item['distribute'].length > 3
"
>
<el-popover
placement="right"
title="标题"
width="200"
trigger="click"
>
<div v-for="(h, key, j) in item['distribute']" :key="j">
{{ key }}({{ item['distribute'][key] }}题)
</div>
<el-button slot="reference" type="text" size="mini">...</el-button>
<el-button slot="reference" type="text" size="mini"
>...</el-button
>
</el-popover>
</div>
<div v-else>
<div v-else-if="typeof item['distribute'] == 'object'">
<div v-for="(h, key, j) in item['distribute']" :key="j">
{{ key }}({{ item['distribute'][key] }}题),
{{ key }}({{ item['distribute'][key] }}题)
</div>
</div>
<div v-else>
<div>
{{ item['distribute'] }}
</div>
</div>
</div>
<div v-else-if="Array.isArray(item[e.key])">
<el-popover placement="right" width="200" trigger="click" v-if="item[e.key].length > 0">
<el-popover
placement="right"
width="200"
trigger="click"
v-if="item[e.key].length > 0"
>
<div v-for="(h, j) in item[e.key]" :key="j">
{{ h }}
</div>
<el-button slot="reference" type="text" size="mini">...</el-button>
<el-button slot="reference" type="text" size="mini"
>...</el-button
>
</el-popover>
</div>
<div v-else>{{ item[e.key] }}</div>
......@@ -48,23 +92,72 @@ export default {
props: ['table_data', 'labers'],
data() {
return {
sort_field: null,
sort_type: null,
};
},
components: {},
computed: {},
created() {},
mounted() {},
mounted() { },
methods: {}
}
methods: {
sort(col, type = 'desc') {
this.sort_field = col;
this.sort_type = type;
if (type == 'asc') {
this.table_data.sort((a, b) => {
let a_n =
parseFloat(a[col]) != a[col] ? a[col].split('~')[0] : a[col];
let b_n =
parseFloat(b[col]) != b[col] ? b[col].split('~')[0] : b[col];
if (parseFloat(a_n) == a_n && parseFloat(b_n) == b_n) {
return a_n - b_n;
} else if (a_n < b_n) {
return -1;
} else if (a_n > b_n) {
return 1;
} else {
return 0;
}
}); //升序
} else {
this.table_data.sort((a, b) => {
let a_n =
parseFloat(a[col]) != a[col] ? a[col].split('~')[0] : a[col];
let b_n =
parseFloat(b[col]) != b[col] ? b[col].split('~')[0] : b[col];
if (parseFloat(a_n) == a_n && parseFloat(b_n) == b_n) {
return b_n - a_n;
} else if (b_n < a_n) {
return -1;
} else if (b_n > a_n) {
return 1;
} else {
return 0;
}
}); //降序
}
},
},
};
</script>
<style lang="scss" scoped>
.container_box {
width: 100%;
height: 100%;
position: relative;
}
.el-icon-caret-bottom {
position: absolute;
top: 20px;
}
.el-icon-caret-top {
position: absolute;
top: 13px;
}
.table_box {
......@@ -72,8 +165,8 @@ export default {
// min-height: 100%;
text-align: center;
font-size: 14px;
border-top: 1px solid #E4E7ED;
border-left: 1px solid #E4E7ED;
border-top: 1px solid #e4e7ed;
border-left: 1px solid #e4e7ed;
border-collapse: collapse;
th,
......@@ -81,8 +174,8 @@ export default {
margin: 0;
padding: 0;
font-size: 14px;
border-bottom: 1px solid #E4E7ED;
border-right: 1px solid #E4E7ED;
border-bottom: 1px solid #e4e7ed;
border-right: 1px solid #e4e7ed;
}
th {
......
......@@ -16,33 +16,64 @@
<div class="header_box">
<el-row>
<el-col :span="12">
<div class="title_box" :title="original_data.title"> {{ original_data.title }}</div>
<div class="title_box" :title="original_data.title">
{{ original_data.title }}
</div>
</el-col>
<el-col :span="12" style="text-align: right;">
<el-checkbox v-if="original_data.is_show" v-model="original_data.is_show.value" @change="changeSelect">{{
original_data.is_show.value ? '显示' : '隐藏'
}}</el-checkbox>
<el-col :span="12" style="text-align: right">
<el-checkbox
v-if="original_data.is_show"
v-model="original_data.is_show.value"
@change="changeSelect"
>{{ original_data.is_show.value ? '显示' : '隐藏' }}</el-checkbox
>
</el-col>
</el-row>
</div>
<div class="content_container" v-if="original_data.type == 'table'">
<Table :table_data="original_data.list" :labers="original_data.labers"></Table>
<Table
v-if="original_data"
:table_data="original_data.list"
:labers="original_data.labers"
></Table>
</div>
<div class="content_container" v-if="original_data.type == 'select_table'">
<SelectTabe
v-if="original_data"
:table_data="original_data"
:labers="original_data.labers"
>
</SelectTabe>
</div>
<div class="content_container" v-if="false">
<line-chart :chart_data="original_data.data" :chart_id="original_data.chart_id"></line-chart>
<line-chart
:chart_data="original_data.data"
:chart_id="original_data.chart_id"
></line-chart>
</div>
<div class="content_container" v-if="original_data.type == 'bar'">
<bar-chart
:chart_data="{ raw_data: original_data.raw_data, keys: original_data.keys, labers: original_data.labers }"
:chart_id="original_data.chart_id"></bar-chart>
:chart_data="{
raw_data: original_data.raw_data,
keys: original_data.keys,
labers: original_data.labers,
}"
:chart_id="original_data.chart_id"
></bar-chart>
</div>
<div class="content_container" v-if="original_data.type == 'simple_table'">
<simple-table :table_data="original_data"></simple-table>
</div>
<!-- 眼光稳定性 -->
<div class="content_container" v-if="original_data.type == 'eye_stability_table'">
<eye-stability-table :table_data="original_data.list" :labers="original_data.labers"></eye-stability-table>
<div
class="content_container"
v-if="original_data.type == 'eye_stability_table'"
>
<eye-stability-table
:table_data="original_data.list"
:labers="original_data.labers"
></eye-stability-table>
</div>
</div>
</template>
......@@ -53,31 +84,38 @@ import LineChart from './components/LineChart.vue';
import BarChart from './components/BarChart.vue';
import SimpleTable from './components/SimpleTable.vue';
import EyeStabilityTable from './components/EyeStabilityTable.vue';
import SelectTabe from './components/SelectTabe.vue';
export default {
props: ['module_data'],
data() {
return {
original_data: {},
original_data: null,
};
},
components: { Table, LineChart, BarChart, SimpleTable, EyeStabilityTable },
components: {
Table,
LineChart,
BarChart,
SimpleTable,
EyeStabilityTable,
SelectTabe,
},
computed: {},
created() {
this.original_data = { ...this.module_data };
console.log(this.original_data);
},
mounted() {
},
mounted() {},
methods: {
//选择框监听
changeSelect() {
this.$emit('changeSelect', this.original_data.is_show);
},
}
}
},
};
</script>
<style lang="scss" scoped>
.analyse_container {
......
......@@ -10,16 +10,33 @@
<el-row>
<el-col :span="12">
<div>
<el-button type="text" icon="el-icon-arrow-left" size="mini" class="back_btn" @click="back">返回</el-button>
<el-button
type="text"
icon="el-icon-arrow-left"
size="mini"
class="back_btn"
@click="back"
>返回</el-button
>
<h2 class="title_box">
<div v-if="Array.isArray(info_data.title)">
<span>{{ info_data.title[0] }}</span>
<el-popover placement="bottom" title="多个标题" width="200" trigger="hover">
<!-- <span>{{ info_data.title[0] }}</span> -->
<el-popover placement="bottom" width="480" trigger="hover">
<div>
<el-tag type="info" v-for="(item, index) in info_data.title" :key="index"
style="margin-bottom: 10px;">{{ item }}</el-tag>
<el-tag
type="info"
v-for="(item, index) in info_data.title"
:key="index"
style="margin-bottom: 10px"
>{{ item }}</el-tag
>
</div>
<el-button slot="reference" type="text">...</el-button>
<el-button
style="color: #000; font-size: 20px"
slot="reference"
type="text"
>{{ info_data.title[0] }}</el-button
>
</el-popover>
</div>
<div v-else>
......@@ -28,15 +45,18 @@
</h2>
</div>
</el-col>
<el-col :span="12" style="text-align: right;">
<el-button type="primary" v-for="(item, index) in info_data.right_buttons" :key="index" :icon="item.icon"
@click="btnClick(item.event)">
<el-col :span="12" style="text-align: right">
<el-button
type="primary"
v-for="(item, index) in info_data.right_buttons"
:key="index"
:icon="item.icon"
@click="btnClick(item.event)"
>
{{ item.text }}
</el-button>
</el-col>
</el-row>
</div>
</template>
......@@ -56,10 +76,10 @@ export default {
computed: {},
created() {
this.info_data = { ...this.examination_questions };
console.log('头部接受到的数据');
console.log(this.examination_questions);
// console.log('头部接受到的数据');
// console.log(this.examination_questions);
},
mounted() { },
mounted() {},
methods: {
back() {
......@@ -67,24 +87,23 @@ export default {
},
seconds_to_minutes(str) {
if (str) {
return secondsToMinutes(str)
return secondsToMinutes(str);
} else {
return '暂无'
return '暂无';
}
},
btnClick(val) {
this.$emit('btnClick', val);
},
}
}
},
};
</script>
<style lang="scss" scoped>
.back_btn {
/* font-size: 16px; */
color: #303133;
border-right: 1px solid #DCDFE6;
border-right: 1px solid #dcdfe6;
padding: 3px 10px 3px 0;
border-radius: none;
}
......
<!--
* @Author: czj
* @Date: 2023-03-03 10:41:57
* @Description:
* @FilePath: \AdministrationHome\src\components\TableHead\index.vue
-->
<!-- -->
<template>
<div>
<el-row :gutter="20">
<el-col :span="9">
<div v-if="head_data.is_search_show">
<span>搜索:</span>
<el-input
placeholder="输入名称"
class="search_box"
v-model="search_val"
:placeholder="
!head_data.search_placeholder
? '搜索'
: head_data.search_placeholder
"
@change="searchChange"
></el-input>
<el-button type="warning" size="small" @click="search"
>搜索</el-button
>
<el-button size="small" @click="resetting">重置</el-button>
</div>
<div v-else style="opacity: 0; pointer-events: none">暂无</div>
</el-col>
<el-col :span="13" style="text-align: right; padding-right: 0">
<span
v-for="(item, index) in head_data.right_buttons"
:key="index"
style="margin: 0 8px"
>
<el-button
v-if="upload_btns.indexOf(item.event) == -1"
type="primary"
:icon="item.icon"
@click="btnClick(item.event)"
>{{ item.text }}</el-button
>
<el-upload
v-else
id="upload_moudel"
class="avatar-uploader"
action="#"
:show-file-list="false"
accept=""
:http-request="sliderRequest"
>
<el-button
type="primary"
:icon="item.icon"
@click="uploadCode(item.event)"
>{{ item.text }}</el-button
>
</el-upload>
</span>
</el-col>
<el-col :span="2"
><span v-if="head_data.ensembel_btn"
><el-badge :value="head_data.number_value">
<el-popover
placement="bottom"
width="400"
style="overflow-y: hidden"
trigger="hover"
v-model="visible"
>
<el-table
:data="head_data.select_data"
height="600"
style="width: 100%"
>
<el-table-column prop="id" label="编号"> </el-table-column>
<el-table-column prop="title" label="考试标题" width="180">
</el-table-column>
<el-table-column prop="address" label="操作">
<template slot-scope="scope">
<el-button
type="danger"
icon="el-icon-delete"
@click="deleteSelectData(scope)"
circle
></el-button>
</template>
</el-table-column>
</el-table>
<el-button
style="float: right; margin-top: 10px"
@click="
btnClick(head_data.ensembel_btn.event), (visible = !visible)
"
type="primary"
>{{ head_data.ensembel_btn.text }}</el-button
>
<el-button
slot="reference"
:icon="head_data.ensembel_btn.icon"
type="primary"
>{{ head_data.ensembel_btn.text }}</el-button
>
</el-popover>
</el-badge></span
></el-col
>
</el-row>
</div>
</template>
<script>
export default {
props: ['head_data'],
data() {
return {
search_val: '',
select_ids: [],
upload_btns: [
'upload',
'examination_questions_upload',
'batch_reservation',
],
btn_code: '',
visible: false,
};
},
components: {},
watch: {
head_data: {
handler(newValue, oldVlue) {
this.head_data = newValue;
},
deep: true,
},
},
computed: {},
mounted() {
// console.log(this.head_data);
},
methods: {
search() {
this.$emit('search', this.search_val);
},
searchChange() {
this.$emit('change', this.search_val);
},
resetting() {
this.search_val = null;
this.$emit('resetting', null);
},
addEvent() {
this.$emit('add');
},
//右侧按钮事件
btnClick(val) {
this.$emit('btnClick', val);
},
uploadCode(val) {
this.btn_code = val;
},
// 上传代理
sliderRequest(upload) {
let uploads = { ...upload };
uploads['btn_code'] = this.btn_code;
this.$emit('upload', uploads);
},
//删除购物车内容
deleteSelectData(scope) {
this.$emit('deleteSelectData', scope.$index, scope.row.id);
// this.head_data.select_data.splice(scope.$index, 1);
},
},
};
</script>
<style scoped>
.search_box {
width: 200px;
margin-right: 15px;
}
.avatar-uploader {
display: inline-block;
}
</style>
......@@ -11,25 +11,67 @@
<el-col :span="9">
<div v-if="head_data.is_search_show">
<span>搜索:</span>
<el-input placeholder="输入名称" class="search_box" v-model="search_val"
:placeholder="!head_data.search_placeholder ? '搜索' : head_data.search_placeholder"
@change="searchChange"></el-input>
<el-button type="warning" size="small" @click="search">搜索</el-button>
<el-input
placeholder="输入名称"
class="search_box"
v-model="search_val"
:placeholder="
!head_data.search_placeholder
? '搜索'
: head_data.search_placeholder
"
@change="searchChange"
></el-input>
<el-button type="warning" size="small" @click="search"
>搜索</el-button
>
<el-button size="small" @click="resetting">重置</el-button>
</div>
<div v-else style="opacity: 0;pointer-events: none;">暂无</div>
<div v-else style="opacity: 0; pointer-events: none">暂无</div>
</el-col>
<el-col :span="15" style="text-align: right;">
<span v-for="(item, index) in head_data.right_buttons" :key="index" style="margin: 0 8px;">
<el-button v-if="upload_btns.indexOf(item.event) == -1" type="primary" :icon="item.icon"
@click="btnClick(item.event)">{{
item.text }}</el-button>
<el-upload v-else id="upload_moudel" class="avatar-uploader" action="#" :show-file-list="false" accept=""
:http-request="sliderRequest">
<el-button type="primary" :icon="item.icon" @click="uploadCode(item.event)">{{ item.text }}</el-button>
<el-col :span="15" style="text-align: right; padding-right: 0">
<span
v-for="(item, index) in head_data.right_buttons"
:key="index"
style="margin: 0 8px"
>
<el-button
v-if="upload_btns.indexOf(item.event) == -1"
type="primary"
:icon="item.icon"
@click="btnClick(item.event)"
>{{ item.text }}</el-button
>
<el-upload
v-else
id="upload_moudel"
class="avatar-uploader"
action="#"
:show-file-list="false"
accept=""
:http-request="sliderRequest"
>
<el-button
type="primary"
:icon="item.icon"
@click="uploadCode(item.event)"
>{{ item.text }}</el-button
>
</el-upload>
</span>
</el-col>
<!-- <el-col :span="2"
><span v-if="head_data.ensembel_btn"
><el-badge :value="head_data.number_value">
<el-button
:icon="head_data.ensembel_btn.icon"
@click="btnClick(head_data.ensembel_btn.event)"
type="primary"
>{{ head_data.ensembel_btn.text }}</el-button
>
</el-badge></span
></el-col
> -->
</el-row>
</div>
</template>
......@@ -40,16 +82,29 @@ export default {
data() {
return {
search_val: '',
upload_btns: ['upload', 'examination_questions_upload', 'batch_reservation'],
upload_btns: [
'upload',
'examination_questions_upload',
'batch_reservation',
],
btn_code: '',
};
},
components: {},
watch: {
head_data: {
handler(newValue, oldVlue) {
this.head_data = newValue;
},
deep: true,
},
},
computed: {},
mounted() { },
mounted() {
console.log(this.head_data);
},
methods: {
search() {
......@@ -59,7 +114,7 @@ export default {
this.$emit('change', this.search_val);
},
resetting() {
this.search_val = null
this.search_val = null;
this.$emit('resetting', null);
},
addEvent() {
......@@ -75,13 +130,12 @@ export default {
},
// 上传代理
sliderRequest(upload) {
let uploads = { ...upload }
uploads['btn_code'] = this.btn_code
this.$emit('upload', uploads)
let uploads = { ...upload };
uploads['btn_code'] = this.btn_code;
this.$emit('upload', uploads);
},
}
}
},
};
</script>
<style scoped>
.search_box {
......
/**
* @Author: AnthonyD
* @Date: 2023-03-23 15:22:21
* @Last Modified by: AnthonyD
* @Last Modified time: 2023-03-30 15:05:46
*/
import Cookies from 'js-cookie'
const TokenKey = 'Admin-Token'
const TokenKey = 'Admin-Token_min'
export function getToken() {
return Cookies.get(TokenKey)
......
......@@ -55,10 +55,24 @@ export function secondsToMinutes(s) {
//两个数,求百分比
export function toPercent(num, total) {
if (num == 0) {
return '0%'
} else {
return (Math.round(num / total * 10000) / 100.00 + "%");// 小数点后两位百分比
}
}
}
//取至小数点后两位,四舍五入
export function keepTwoDecimal(num) {
var result = parseFloat(num);
if (isNaN(result)) {
return false;
} else {
result = Math.round(num * 100) / 100;
return result;
}
}
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑!
请 注册 或者 后发表评论