|
@@ -153,10 +153,12 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
- <!--学区or城市样式内容-->
|
|
|
|
- <div class="data-tables" style="height: 700px;width: 100%;" v-loading="searchLoading" :element-loading-text="$t(`product.prepareData`)+'...'">
|
|
|
|
- <el-auto-resizer>
|
|
|
|
- <template #default="{ height, width }">
|
|
|
|
|
|
+
|
|
|
|
+ <!--老師個人資料列表-->
|
|
|
|
+ <div class="data-tables-teacher" style="height: 700px;width: 100%;" v-loading="searchLoading" :element-loading-text="$t(`product.prepareData`)+'...'">
|
|
|
|
+ <el-button type="primary" @click="exportExcel()" style="display: block;margin-top: 10px;">匯出</el-button>
|
|
|
|
+ <el-auto-resizer>
|
|
|
|
+ <template #default="{ height, width }">
|
|
<el-table-v2 v-if="filterdata.length > 0" v-model:sort-state="sortState" :columns="columns" :data="filterdata" :width="width" :height="height" @column-sort="onSort" fixed :row-class="rowClassName" />
|
|
<el-table-v2 v-if="filterdata.length > 0" v-model:sort-state="sortState" :columns="columns" :data="filterdata" :width="width" :height="height" @column-sort="onSort" fixed :row-class="rowClassName" />
|
|
</template>
|
|
</template>
|
|
</el-auto-resizer>
|
|
</el-auto-resizer>
|
|
@@ -333,6 +335,8 @@ import { ref, reactive, getCurrentInstance, defineEmits, computed, onMounted } f
|
|
import { ElMessage, TableV2SortOrder, ElLoading, ElCheckbox,HeaderCellSlotProps,ElPopover,Column, RowClassNameGetter} from 'element-plus'
|
|
import { ElMessage, TableV2SortOrder, ElLoading, ElCheckbox,HeaderCellSlotProps,ElPopover,Column, RowClassNameGetter} from 'element-plus'
|
|
import Xlines from '@/components/echarts/Xline.vue'
|
|
import Xlines from '@/components/echarts/Xline.vue'
|
|
import * as echarts from 'echarts'
|
|
import * as echarts from 'echarts'
|
|
|
|
+import excel from "../../until/excel"
|
|
|
|
+
|
|
let props = defineProps({
|
|
let props = defineProps({
|
|
detailsData: Object,
|
|
detailsData: Object,
|
|
pattern:Object,
|
|
pattern:Object,
|
|
@@ -357,7 +361,21 @@ const sortState = ref({
|
|
})
|
|
})
|
|
let searchLoading=ref(false)
|
|
let searchLoading=ref(false)
|
|
let sortValue = reactive({})
|
|
let sortValue = reactive({})
|
|
-let columns = ref([
|
|
|
|
|
|
+let columns = ref([
|
|
|
|
+ {
|
|
|
|
+ key: "schoolName",
|
|
|
|
+ dataKey: "schoolName",//需要渲染当前列的数据字段,如{id:9527,name:'Mike'},则填id
|
|
|
|
+ title: proxy.$t(`product.schoolName`),//显示在单元格表头的文本
|
|
|
|
+ width: 100,//当前列的宽度,必须设置
|
|
|
|
+ headerClass: 'general',
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ key: "schoolId",
|
|
|
|
+ dataKey: "schoolId",//需要渲染当前列的数据字段,如{id:9527,name:'Mike'},则填id
|
|
|
|
+ title: proxy.$t(`product.simpleCode`),//显示在单元格表头的文本
|
|
|
|
+ width: 100,//当前列的宽度,必须设置
|
|
|
|
+ headerClass: 'general',
|
|
|
|
+ },
|
|
{
|
|
{
|
|
key: "name",
|
|
key: "name",
|
|
dataKey: "name",//需要渲染当前列的数据字段,如{id:9527,name:'Mike'},则填id
|
|
dataKey: "name",//需要渲染当前列的数据字段,如{id:9527,name:'Mike'},则填id
|
|
@@ -368,21 +386,24 @@ let columns = ref([
|
|
headerClass: 'general',
|
|
headerClass: 'general',
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- key: "date",
|
|
|
|
- dataKey: "date",//需要渲染当前列的数据字段,如{id:9527,name:'Mike'},则填id
|
|
|
|
- title: proxy.$t(`product.time`),//显示在单元格表头的文本
|
|
|
|
|
|
+ key: "tmid",
|
|
|
|
+ dataKey: "tmid",//需要渲染当前列的数据字段,如{id:9527,name:'Mike'},则填id
|
|
|
|
+ title: proxy.$t(`product.tmid`),//显示在单元格表头的文本
|
|
width: 100,//当前列的宽度,必须设置
|
|
width: 100,//当前列的宽度,必须设置
|
|
fixed: false,//是否固定列
|
|
fixed: false,//是否固定列
|
|
- sortable: true,
|
|
|
|
|
|
+ // sortable: true,
|
|
headerClass: 'general',
|
|
headerClass: 'general',
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- key: "schoolId",
|
|
|
|
- dataKey: "schoolId",//需要渲染当前列的数据字段,如{id:9527,name:'Mike'},则填id
|
|
|
|
- title: proxy.$t(`product.simpleCode`),//显示在单元格表头的文本
|
|
|
|
|
|
+ key: "date",
|
|
|
|
+ dataKey: "date",//需要渲染当前列的数据字段,如{id:9527,name:'Mike'},则填id
|
|
|
|
+ title: proxy.$t(`product.time`),//显示在单元格表头的文本
|
|
width: 100,//当前列的宽度,必须设置
|
|
width: 100,//当前列的宽度,必须设置
|
|
|
|
+ fixed: false,//是否固定列
|
|
|
|
+ sortable: true,
|
|
headerClass: 'general',
|
|
headerClass: 'general',
|
|
},
|
|
},
|
|
|
|
+
|
|
{
|
|
{
|
|
key: "deviceCnt",
|
|
key: "deviceCnt",
|
|
dataKey: "deviceCnt",//需要渲染当前列的数据字段,如{id:9527,name:'Mike'},则填id
|
|
dataKey: "deviceCnt",//需要渲染当前列的数据字段,如{id:9527,name:'Mike'},则填id
|
|
@@ -402,7 +423,7 @@ let columns = ref([
|
|
{
|
|
{
|
|
key: "stuShow",
|
|
key: "stuShow",
|
|
dataKey: "stuShow",//需要渲染当前列的数据字段,如{id:9527,name:'Mike'},则填id
|
|
dataKey: "stuShow",//需要渲染当前列的数据字段,如{id:9527,name:'Mike'},则填id
|
|
- title: proxy.$t(`product.studentNumber`),//显示在单元格表头的文本
|
|
|
|
|
|
+ title: proxy.$t(`product.studentNumberUnique`),//显示在单元格表头的文本
|
|
width: 100,//当前列的宽度,必须设置
|
|
width: 100,//当前列的宽度,必须设置
|
|
headerClass: 'general',
|
|
headerClass: 'general',
|
|
sortable:true
|
|
sortable:true
|
|
@@ -439,6 +460,46 @@ let columns = ref([
|
|
headerClass: 'general',
|
|
headerClass: 'general',
|
|
sortable:true
|
|
sortable:true
|
|
},
|
|
},
|
|
|
|
+ {
|
|
|
|
+ key: "stuLessonLengMin",
|
|
|
|
+ dataKey: "stuLessonLengMin",
|
|
|
|
+ title: proxy.$t(`product.stuLessonLengMin`),//显示在单元格表头的文本
|
|
|
|
+ width: 150,//当前列的宽度,必须设置
|
|
|
|
+ headerClass: 'general',
|
|
|
|
+ sortable:true
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ key: "lessonRecord",
|
|
|
|
+ dataKey: "lessonRecord",
|
|
|
|
+ title: proxy.$t(`product.lessonRecord`),//显示在单元格表头的文本
|
|
|
|
+ width: 100,//当前列的宽度,必须设置
|
|
|
|
+ headerClass: 'general',
|
|
|
|
+ sortable:true
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ key: "lessonLengMin",
|
|
|
|
+ dataKey: "lessonLengMin",
|
|
|
|
+ title: proxy.$t(`product.lessonLengMin`),//显示在单元格表头的文本
|
|
|
|
+ width: 100,//当前列的宽度,必须设置
|
|
|
|
+ headerClass: 'general',
|
|
|
|
+ sortable:true
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ key: "item",
|
|
|
|
+ dataKey: "item",
|
|
|
|
+ title: proxy.$t(`product.item`),//显示在单元格表头的文本
|
|
|
|
+ width: 100,//当前列的宽度,必须设置
|
|
|
|
+ headerClass: 'general',
|
|
|
|
+ sortable:true
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ key: "interact",
|
|
|
|
+ dataKey: "interact",
|
|
|
|
+ title: proxy.$t(`product.interact`),//显示在单元格表头的文本
|
|
|
|
+ width: 100,//当前列的宽度,必须设置
|
|
|
|
+ headerClass: 'general',
|
|
|
|
+ sortable:true
|
|
|
|
+ },
|
|
// {
|
|
// {
|
|
// key: "date",
|
|
// key: "date",
|
|
// dataKey: "date",
|
|
// dataKey: "date",
|
|
@@ -1345,7 +1406,9 @@ function serachToresult() {
|
|
if (res.state === 200) {
|
|
if (res.state === 200) {
|
|
res.data.forEach((item) => {
|
|
res.data.forEach((item) => {
|
|
item.name = item.tmidInfo.name ? item.tmidInfo.name : proxy.$t(`product.noneYet`)
|
|
item.name = item.tmidInfo.name ? item.tmidInfo.name : proxy.$t(`product.noneYet`)
|
|
- item.schoolId = item.tmid
|
|
|
|
|
|
+ // 把學校名稱
|
|
|
|
+ item.schoolName = item.school.name
|
|
|
|
+ //item.schoolId = item.tmid
|
|
});
|
|
});
|
|
res.geo.forEach((item) => {
|
|
res.geo.forEach((item) => {
|
|
if (item.school.name || (item.school.name === "")) {
|
|
if (item.school.name || (item.school.name === "")) {
|
|
@@ -1363,6 +1426,29 @@ function serachToresult() {
|
|
ElMessage.error(proxy.$t(`product.apiErrpr`) + ',' + proxy.$t(`product.getDataError`))
|
|
ElMessage.error(proxy.$t(`product.apiErrpr`) + ',' + proxy.$t(`product.getDataError`))
|
|
})
|
|
})
|
|
}
|
|
}
|
|
|
|
+//匯出各縣市的統購資料
|
|
|
|
+function exportExcel() {
|
|
|
|
+ let title = [proxy.$t(`product.schoolName`), proxy.$t(`product.simpleCode`), proxy.$t(`product.name`), proxy.$t(`product.tmid`), proxy.$t(`product.time`), proxy.$t(`product.classroomNumber`), proxy.$t(`product.teacherNumber`)
|
|
|
|
+ , proxy.$t(`product.studentNumber`), proxy.$t(`product.lessonNumber`), proxy.$t(`product.lessonHours`), proxy.$t(`product.tGreen`), proxy.$t(`product.tLesson`)
|
|
|
|
+ , proxy.$t(`product.stuLessonLengMin`), proxy.$t(`product.lessonRecord`), proxy.$t(`product.lessonLengMin`), proxy.$t(`product.item`), proxy.$t(`product.interact`)];
|
|
|
|
+ let key = ['schoolName', 'schoolId', 'name', 'tmid', 'date', 'deviceCnt', 'tmidCnt', 'stuShow', 'lessonRecord', 'lessonLengMin', 'tGreen', 'tLesson',
|
|
|
|
+ 'stuLessonLengMin','lessonRecord','lessonLengMin','item','interact'];
|
|
|
|
+
|
|
|
|
+ let arr = excel.export_json_to_array(key, filterdata.value);
|
|
|
|
+ arr.unshift(title);
|
|
|
|
+ let ws = XLSX.utils.aoa_to_sheet(arr);
|
|
|
|
+ ws = excel.export_auto_width(ws, arr);
|
|
|
|
+ let wb = XLSX.utils.book_new();
|
|
|
|
+ let sheetName ='Data';
|
|
|
|
+ XLSX.utils.book_append_sheet(wb, ws, sheetName);
|
|
|
|
+ //檔案做成
|
|
|
|
+ let filename = schoolData.value.name + '_' + proxy.$t(`product.teacherData`);
|
|
|
|
+ XLSX.writeFile(wb, filename + '.xlsx', {
|
|
|
|
+ bookType: 'xlsx',
|
|
|
|
+ bookSST: true,
|
|
|
|
+ type: 'array'
|
|
|
|
+ });
|
|
|
|
+ }
|
|
init()
|
|
init()
|
|
</script>
|
|
</script>
|
|
<style scoped>
|
|
<style scoped>
|
|
@@ -1922,16 +2008,17 @@ init()
|
|
.contentbox .el-divider {
|
|
.contentbox .el-divider {
|
|
margin: 10px 0;
|
|
margin: 10px 0;
|
|
}
|
|
}
|
|
-.data-tables .header-class,
|
|
|
|
- .data-tables
|
|
|
|
|
|
+.data-tables-teacher .header-class,
|
|
|
|
+ .data-tables-teacher
|
|
.el-table-v2__row-cell
|
|
.el-table-v2__row-cell
|
|
{
|
|
{
|
|
- /* width: v-bind(cellWidth + "%") !important; */
|
|
|
|
|
|
+ max-width: 15% !important;
|
|
justify-content: center;
|
|
justify-content: center;
|
|
text-align: center;
|
|
text-align: center;
|
|
|
|
+ white-space:nowrap;
|
|
}
|
|
}
|
|
- .data-tables .general {
|
|
|
|
- /* width: v-bind(cellWidth + "%") !important; */
|
|
|
|
|
|
+ .data-tables-teacher .general {
|
|
|
|
+ max-width: 15% !important;
|
|
justify-content: center;
|
|
justify-content: center;
|
|
text-align: center;
|
|
text-align: center;
|
|
}
|
|
}
|
|
@@ -1939,8 +2026,7 @@ init()
|
|
justify-content: left;
|
|
justify-content: left;
|
|
text-align: left;
|
|
text-align: left;
|
|
}
|
|
}
|
|
- .data-tables .btn-class {
|
|
|
|
- /* width: v-bind(cellWidth + "%") !important; */
|
|
|
|
|
|
+ .data-tables .btn-class {
|
|
justify-content: center;
|
|
justify-content: center;
|
|
text-align: center;
|
|
text-align: center;
|
|
}
|
|
}
|