|
|
@@ -4,11 +4,15 @@
|
|
|
<span class="text">中奖名单</span>
|
|
|
</div>
|
|
|
<div class="luckDraw_select">
|
|
|
- <el-input v-model="form.text1" placeholder="请输入中奖姓名" clearable></el-input>
|
|
|
+ <el-date-picker
|
|
|
+ v-model="form.rflDate"
|
|
|
+ type="date"
|
|
|
+ placeholder="请选择中奖时间">
|
|
|
+ </el-date-picker>
|
|
|
<el-button type="primary" @click="selectClick" :loading="selectLoading">
|
|
|
<i class="el-icon-search"></i> 查询
|
|
|
</el-button>
|
|
|
- <el-button type="primary" @click="exportData()" :loading="downloadLoading">
|
|
|
+ <el-button type="primary" @click="menuExport" :loading="downloadLoading">
|
|
|
<i class="el-icon-document"></i> 导出(Excel)
|
|
|
</el-button>
|
|
|
</div>
|
|
|
@@ -26,6 +30,7 @@
|
|
|
:loading="tableLoading"
|
|
|
element-tableLoading-text="玩命加载中"
|
|
|
element-tableLoading-spinner="el-icon-tableLoading"
|
|
|
+ size="mini"
|
|
|
>
|
|
|
<el-table-column
|
|
|
type="index"
|
|
|
@@ -61,6 +66,7 @@
|
|
|
|
|
|
<script>
|
|
|
import luckDrawTableHead from './luckDrawTableHead'
|
|
|
+import { renderTime,sjTime } from '@/utils/sharedJsFile'
|
|
|
export default {
|
|
|
data(){
|
|
|
return{
|
|
|
@@ -79,17 +85,15 @@ export default {
|
|
|
//每页显示条目个数
|
|
|
pageSize: 100,
|
|
|
//每一页面的显示的条目个数数组
|
|
|
- pageSizes: [50, 100, 200, 300],
|
|
|
+ pageSizes: [5, 100, 200, 300],
|
|
|
//当前页数
|
|
|
currentPage: 1,
|
|
|
//表格的加载状态
|
|
|
tableLoading: false,
|
|
|
//查询条件
|
|
|
form:{
|
|
|
- text1:null,
|
|
|
+ rflDate:new Date()
|
|
|
},
|
|
|
- //后端给的数据
|
|
|
- tableData1:[],
|
|
|
//表格渲染的数据
|
|
|
tableData:[],
|
|
|
//表格的表头数据
|
|
|
@@ -102,32 +106,209 @@ export default {
|
|
|
window.addEventListener("resize", this.getHeight);
|
|
|
this.getHeight();
|
|
|
this.initialization();
|
|
|
- this.changeList();
|
|
|
},
|
|
|
methods:{
|
|
|
+ menuExport() {
|
|
|
+ if (this.tableData.length < 1) {
|
|
|
+ this.$message.error("当前无数据可供导出!");
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ let data = [];
|
|
|
+ let i = 0;
|
|
|
+ this.tableData.forEach((e)=>{
|
|
|
+ i++;
|
|
|
+ data.push({
|
|
|
+ '序号':i,
|
|
|
+ '单位':e.empDept,
|
|
|
+ '工号':e.empNo,
|
|
|
+ '姓名':e.empName,
|
|
|
+ '电话号码':e.cellPhoneNo,
|
|
|
+ '中奖等级':e.prizeDesc,
|
|
|
+ '中奖时间':e.rflDate,
|
|
|
+ })
|
|
|
+ })
|
|
|
+ // 表格标题
|
|
|
+ var dataTitle = this.tableTitle;
|
|
|
+ // 配置文件类型
|
|
|
+ const wopts = {
|
|
|
+ bookType: "xlsx",
|
|
|
+ bookSST: true,
|
|
|
+ type: "binary",
|
|
|
+ cellStyles: true,
|
|
|
+ };
|
|
|
+ this.downloadExl(data, wopts, dataTitle);
|
|
|
+ },
|
|
|
+ downloadExl(json, type, dataTitle) {
|
|
|
+ // 设置表格中cell默认的字体，居中，颜色等
|
|
|
+ var defaultCellStyle = {
|
|
|
+ // font: {
|
|
|
+ // name: "宋体", sz: 11, color: { auto: 1 } ,
|
|
|
+ // },
|
|
|
+ // border: {
|
|
|
+ // color: { auto: 1 },
|
|
|
+ // top: { style: 'thin' },
|
|
|
+ // bottom: { style: 'thin'},
|
|
|
+ // left: { style: 'thin' },
|
|
|
+ // right: { style: 'thin' }
|
|
|
+ // },
|
|
|
+ alignment: {
|
|
|
+ /// 自动换行
|
|
|
+ wrapText: 1,
|
|
|
+ // 居中
|
|
|
+ horizontal: "center",
|
|
|
+ vertical: "center",
|
|
|
+ indent: 0
|
|
|
+ },
|
|
|
+ };
|
|
|
+ var tmpdata = json[0];
|
|
|
+ json.unshift({});
|
|
|
+ var keyMap = []; // 获取keys
|
|
|
+ for (var k in tmpdata) {
|
|
|
+ keyMap.push(k);
|
|
|
+ json[0][k] = k;
|
|
|
+ }
|
|
|
+ var tmpdata = []; // 用来保存转换好的json
|
|
|
+ json
|
|
|
+ .map((v, i) => {
|
|
|
+ let data = keyMap.map((k, j) => {
|
|
|
+ return Object.assign(
|
|
|
+ {},
|
|
|
+ {
|
|
|
+ v: v[k],
|
|
|
+ position:
|
|
|
+ (j > 25 ? this.getCharCol(j) : String.fromCharCode(65 + j)) +
|
|
|
+ (i + 2),
|
|
|
+ }
|
|
|
+ );
|
|
|
+ });
|
|
|
+ return data;
|
|
|
+ })
|
|
|
+ .reduce((prev, next) => prev.concat(next))
|
|
|
+ .forEach(
|
|
|
+ (v, i) =>
|
|
|
+ (tmpdata[v.position] = {
|
|
|
+ v: v.v,
|
|
|
+ s: defaultCellStyle,
|
|
|
+ })
|
|
|
+ );
|
|
|
+ var outputPos = Object.keys(tmpdata); // 设置区域,比如表格从A1到D10
|
|
|
+ tmpdata["A1"] = { v: dataTitle };
|
|
|
+ outputPos = ["A1"].concat(outputPos);
|
|
|
+ tmpdata["A1"].s = {
|
|
|
+ font: { sz: 14, bold: true, vertAlign: true },
|
|
|
+ alignment: { vertical: "center", horizontal: "center" },
|
|
|
+ }; // <====设置xlsx单元格样式 fill: { bgColor: { rgb: "E8E8E8"}, fgColor: { rgb: "E8E8E8" } }
|
|
|
+ tmpdata["!merges"] = [
|
|
|
+ {
|
|
|
+ s: { c: 0, r: 0 },
|
|
|
+ e: { c: 6, r: 0 },
|
|
|
+ },
|
|
|
+ ]; // <====合并单元格
|
|
|
+ tmpdata["!cols"] = [
|
|
|
+ { wpx: 50 },
|
|
|
+ { wpx: 150 },
|
|
|
+ { wpx: 80 },
|
|
|
+ { wpx: 80 },
|
|
|
+ { wpx: 100 },
|
|
|
+ { wpx: 80 },
|
|
|
+ { wpx: 100 },
|
|
|
+ ]; // <====设置一列宽度
|
|
|
+
|
|
|
+ var tmpWB = {
|
|
|
+ SheetNames: ["mySheet"], // 保存的表标题
|
|
|
+ Sheets: {
|
|
|
+ mySheet: Object.assign(
|
|
|
+ {},
|
|
|
+ tmpdata, // 内容
|
|
|
+ {
|
|
|
+ "!ref": outputPos[0] + ":" + outputPos[outputPos.length - 1], // 设置填充区域
|
|
|
+ }
|
|
|
+ ),
|
|
|
+ },
|
|
|
+ };
|
|
|
+ var tmpDown = new Blob(
|
|
|
+ [
|
|
|
+ this.s2ab(
|
|
|
+ XLSX.write(
|
|
|
+ tmpWB,
|
|
|
+ // 这里的数据是用来定义导出的格式类型
|
|
|
+ {
|
|
|
+ bookType: type == undefined ? "xlsx" : type.bookType,
|
|
|
+ bookSST: false,
|
|
|
+ type: "binary",
|
|
|
+ },
|
|
|
+ { defaultCellStyle: this.defaultCellStyle }
|
|
|
+ )
|
|
|
+ ),
|
|
|
+ ],
|
|
|
+ {
|
|
|
+ type: "",
|
|
|
+ }
|
|
|
+ );
|
|
|
+ this.saveAs(
|
|
|
+ tmpDown,
|
|
|
+ this.tableTitle +
|
|
|
+ "." +
|
|
|
+ (type.bookType == "biff2" ? "xls" : type.bookType)
|
|
|
+ );
|
|
|
+ },
|
|
|
+ // 获取26个英文字母用来表示excel的列
|
|
|
+ getCharCol(n) {
|
|
|
+ let temCol = "",
|
|
|
+ s = "",
|
|
|
+ m = 0;
|
|
|
+ while (n > 0) {
|
|
|
+ m = (n % 26) + 1;
|
|
|
+ s = String.fromCharCode(m + 64) + s;
|
|
|
+ n = (n - m) / 26;
|
|
|
+ }
|
|
|
+ return s;
|
|
|
+ },
|
|
|
+ s2ab(s) {
|
|
|
+ if (typeof ArrayBuffer !== "undefined") {
|
|
|
+ var buf = new ArrayBuffer(s.length);
|
|
|
+ var view = new Uint8Array(buf);
|
|
|
+ for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xff;
|
|
|
+ return buf;
|
|
|
+ } else {
|
|
|
+ var buf = new Array(s.length);
|
|
|
+ for (var i = 0; i != s.length; ++i) buf[i] = s.charCodeAt(i) & 0xff;
|
|
|
+ return buf;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 下载功能
|
|
|
+ saveAs(obj, fileName) {
|
|
|
+ var tmpa = document.createElement("a");
|
|
|
+ tmpa.download = fileName || "未命名";
|
|
|
+ // 兼容ie
|
|
|
+ if ("msSaveOrOpenBlob" in navigator) {
|
|
|
+ window.navigator.msSaveOrOpenBlob(obj, this.tableTitle + ".xlsx");
|
|
|
+ } else {
|
|
|
+ tmpa.href = URL.createObjectURL(obj);
|
|
|
+ }
|
|
|
+ tmpa.click();
|
|
|
+ setTimeout(function () {
|
|
|
+ URL.revokeObjectURL(obj);
|
|
|
+ }, 100);
|
|
|
+ },
|
|
|
+
|
|
|
getHeight(){
|
|
|
this.height = window.innerHeight - 200
|
|
|
},
|
|
|
initialization(){
|
|
|
- this.axios.get('/game/v1/rflemplotterys/').then((res)=>{
|
|
|
- this.tableData1 = res.data.list
|
|
|
+ this.axios.get('/icore.icp.web/game/v1/rflemplotterys/?rflDate=&pageNum='+this.currentPage+'&pageSize='+this.pageSize+'&lotteryResult=1').then((res)=>{
|
|
|
+ this.tableData = res.data.data.list
|
|
|
+ this.total = res.data.data.total;
|
|
|
})
|
|
|
- console.log(this.tableData1)
|
|
|
- // let arr;
|
|
|
- // for(var i = 0 ;i<1000;i++){
|
|
|
- // let num = i + 1;
|
|
|
- // arr = {
|
|
|
- // prop1:'测试' + num,
|
|
|
- // }
|
|
|
- // this.tableData1.push(arr)
|
|
|
- // }
|
|
|
- this.total = this.tableData1.length;
|
|
|
-
|
|
|
},
|
|
|
//查询事件
|
|
|
selectClick(){
|
|
|
this.selectLoading = true;
|
|
|
-
|
|
|
+ let Date = renderTime(sjTime(this.form.rflDate)).slice(0,10)
|
|
|
+ this.axios.get('/icore.icp.web/game/v1/rflemplotterys/?rflDate='+Date+'&pageNum='+this.currentPage+'&pageSize='+this.pageSize+'&lotteryResult=1').then((res)=>{
|
|
|
+ this.tableData = res.data.data.list
|
|
|
+ this.total = res.data.data.total;
|
|
|
+ })
|
|
|
this.selectLoading = false;
|
|
|
},
|
|
|
//行间样式
|
|
|
@@ -139,20 +320,7 @@ export default {
|
|
|
return 'background-color:#0C2278;color:#fff;text-align:center;height:20px'
|
|
|
},
|
|
|
changeList(){
|
|
|
- if(this.tableData1.length){
|
|
|
- this.tableData = [];
|
|
|
- var x = (this.currentPage - 1) * this.pageSize;
|
|
|
- var y = this.currentPage * this.pageSize;
|
|
|
- if(x >= this.total){
|
|
|
- x = this.total;
|
|
|
- }
|
|
|
- if(y >= this.total){
|
|
|
- y = this.total
|
|
|
- }
|
|
|
- for(x;x<y;x++){
|
|
|
- this.tableData.push(this.tableData1[x])
|
|
|
- }
|
|
|
- }
|
|
|
+ this.initialization();
|
|
|
this.tableLoading = false;
|
|
|
},
|
|
|
handleSizeChange(val) {
|
