Skip to content

T
template_vue
Commit dea0531f authored by WBY1026's avatar WBY1026
Browse files
Options

修正

parent 222aded9
Show whitespace changes
Inline Side-by-side
Showing with 292 additions and 99 deletions
src/api/demoData1.js
View file @ dea0531f
...@@ -92,5 +92,17 @@ export function getListTotal(data) { ...@@ -92,5 +92,17 @@ export function getListTotal(data) {
data: data data: data
}) })
} }
// export function testPost(data) {
// return request({
// method: 'post',
// url: '/mixSelect/postTest',
// headers: {
// 'Content-Type': 'application/json'
// },
// data: {
// name: '123'
// }
// })
// }
src/views/demoData/demoData1.vue
View file @ dea0531f
...@@ -19,8 +19,8 @@ ...@@ -19,8 +19,8 @@
:trigger-on-focus="false" @select="handleSelect"></el-autocomplete> --> :trigger-on-focus="false" @select="handleSelect"></el-autocomplete> -->
<!-- ddd是3k,这里换成搜索 --> <!-- ddd是3k,这里换成搜索 -->
<el-autocomplete class="inline-input" v-model="inputddd" :fetch-suggestions="querySearch" placeholder="搜索ccc" <!-- <el-autocomplete class="inline-input" v-model="inputddd" :fetch-suggestions="querySearch" placeholder="搜索ccc"
@select="handleSelect"></el-autocomplete> :trigger-on-focus="false" @select="handleSelect"></el-autocomplete> -->
<el-select v-model="mycccc" multiple collapse-tags style="margin-left: 20px;" placeholder="请选择cccc"> <el-select v-model="mycccc" multiple collapse-tags style="margin-left: 20px;" placeholder="请选择cccc">
<el-option v-for="item in cccc" :key="item.cccc" :label="item.cccc" :value="item.cccc"> <el-option v-for="item in cccc" :key="item.cccc" :label="item.cccc" :value="item.cccc">
...@@ -225,113 +225,294 @@ export default { ...@@ -225,113 +225,294 @@ export default {
// 搜索 // 搜索
searchToGetInfo() { searchToGetInfo() {
this.loading = true this.loading = true
listDemoData1(this.queryParams).then( // console.log(this.myCheckBox);
response => { let temp = this.myCheckBox
console.log('数据源', response)
this.demoData1List = response.rows if (temp.indexOf('fff') == -1) {
this.formatData(response.rows) this.fff = false
this.total = response.total } else {
this.loading = false this.fff = true
} }
) if (temp.indexOf('ggg') == -1) {
this.ggg = false
} else {
this.ggg = true
}
if (temp.indexOf('hhh') == -1) {
this.hhh = false
} else {
this.hhh = true
}
if (temp.indexOf('iii') == -1) {
this.iii = false
} else {
this.iii = true
}
if (temp.indexOf('jjj') == -1) {
this.jjj = false
} else {
this.jjj = true
}
if (temp.indexOf('kkk') == -1) {
this.kkk = false
} else {
this.kkk = true
}
const data = {
aaa: this.myaaa,
bbb: this.mybbb,
cccc: this.mycccc,
ddd: this.myddd,
dddd: this.mydddd,
eee: this.myeee,
fff: this.fff,
ggg: this.ggg,
hhh: this.hhh,
iii: this.iii,
jjj: this.jjj,
kkk: this.kkk,
pageSize: this.pageSize,
pageNo: this.currentPage
console.log('数据源', this.demoData1List) }
getListTotal(data).then(res => {
this.totalPage = res.data
})
searchTableList(data).then(res => {
console.log(res);
this.mytableList = res.data
// 判断返回的数据,然后调用渲染方法
if (this.myCheckBox.length <= 1) {
this.getDateType1()
} else if (this.myCheckBox.length == 2) {
this.getDateType2()
} else {
this.getDateType3()
}
this.loading = false
});
}, },
formatData(data) {
// 遍历数据，提取不重复的月份作为列标签 111 handleSizeChange(val) {
const months = new Set() console.log(`每页 ${val} 条`);
data.forEach(item => { this.pageSize = val
Object.keys(item).forEach(key => { this.searchToGetInfo()
if (key !== 'ccc' && key !== '__row_number__') { },
months.add(key) handleCurrentChange(val) {
console.log(`当前页: ${val}`);
this.currentPage = val
this.searchToGetInfo()
},
resetForm() {
this.myCheckBox = ['fff'],
this.myaaa = []
this.mybbb = []
this.mycccc = []
this.myddd = []
this.mydddd = []
this.myeee = []
this.fff = true
this.ggg = false
this.hhh = false
this.iii = false
this.jjj = false
this.kkk = false
this.pageSize = 30
this.currentPage = 1
this.searchToGetInfo()
},
test() {
console.log(this.ddd);
},
// 匹配方法 ======
querySearch(queryString, cb) {
var restaurants = this.ddd;
var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
console.log(results);
// 调用 callback 返回建议列表的数据
cb(results);
},
createFilter(queryString) {
return (restaurant) => {
return (restaurant.ddd.indexOf(queryString) == 0);
};
},
// ===============
handleSelect(e){
console.log(e);
},
// ==================================================
// 勾选一个参数的方法
getDateType1() {
let dateTypeName = [];
this.dateColData = [];
this.mytableList.forEach(item => {
item.data.forEach(citem => {
// 找到这一项的month，判断目前有没有保存过
const index = dateTypeName.findIndex(
i => i.aaa == citem.aaa
)
// 没保存过就存进去
if (index == -1) {
dateTypeName.push(citem)
} }
}) })
});
console.log(dateTypeName, "一级表头");
// 添加表头数据
// 遍历dateTypeName
dateTypeName.forEach((item, index) => {
// 根据dateType每一个在最后需要的表头数据里面push二级表头
this.dateColData.push({
label: item.aaa,
children: [
{
prop: Object.keys(item)[1] + index,
label: null
}
]
}) })
console.log('months是:', months) })
// 将 Set 对象转换为数组
const sortedMonths = Array.from(months) // 遍历传来的数据
// 对数组进行排序 this.mytableList.forEach(data => {
sortedMonths.sort() data.data.forEach(item => {
console.log('排序后的值:', sortedMonths) dateTypeName.forEach((citem, cindex) => {
this.dynamicColumns = sortedMonths if (item.aaa == citem.aaa) {
console.log('绑定的值', this.dynamicColumns) let a = Object.keys(item)[1]
}, data[Object.keys(item)[1] + cindex] = item[a]
// 取消按钮 }
cancel() { })
this.open = false })
this.reset() })
console.log(this.mytableList, "this.mytableList");
}, },
// 表单重置 getDateType2() {
reset() { let dateTypeName = [];
this.form = { this.dateColData = [];
businessId: undefined, this.mytableList.forEach(item => {
ggg: undefined, item.data.forEach(citem => {
dddd: undefined, // 找到这一项的month，判断目前有没有保存过
mmm: undefined, const index = dateTypeName.findIndex(
jjj: undefined, i => i.aaa == citem.aaa
iii: undefined, )
lll: undefined, // 没保存过就存进去
ccc: undefined, if (index == -1) {
bbb: undefined, dateTypeName.push(citem)
cccc: undefined,
fff: undefined,
aaa: undefined,
ddd: undefined,
kkk: undefined,
eee: undefined,
hhh: undefined,
flag: '1'
} }
this.resetForm('form') })
});
console.log(dateTypeName, "一级表头");
// 添加表头数据
// 遍历dateTypeName
dateTypeName.forEach((item, index) => {
// 根据dateType每一个在最后需要的表头数据里面push二级表头
this.dateColData.push({
label: item.aaa,
children: [
{
prop: Object.keys(item)[1] + index,
label: Object.keys(item)[1] + "的值"
}, },
/** 查询按钮操作 */ {
handleQuery() { prop: Object.keys(item)[2] + index,
// this.queryParams.page = 1 label: Object.keys(item)[2] + "的值"
this.getList() }
]
})
})
// 遍历传来的数据
this.mytableList.forEach(data => {
data.data.forEach(item => {
dateTypeName.forEach((citem, cindex) => {
if (item.aaa == citem.aaa) {
let a = Object.keys(item)[1]
let b = Object.keys(item)[2]
data[Object.keys(item)[1] + cindex] = item[a]
data[Object.keys(item)[2] + cindex] = item[b]
}
})
})
})
console.log(this.mytableList, "this.mytableList");
}, },
/** 重置按钮操作 */ getDateType3() {
resetQuery() { let dateTypeName = [];
this.queryParams = { this.dateColData = [];
page: 1, this.mytableList.forEach(item => {
rows: 100, item.data.forEach(citem => {
ggg: undefined, // 找到这一项的month，判断目前有没有保存过
dddd: undefined, const index = dateTypeName.findIndex(
mmm: undefined, i => i.aaa == citem.aaa
jjj: undefined, )
iii: undefined, // 没保存过就存进去
lll: undefined, if (index == -1) {
ccc: undefined, dateTypeName.push(citem)
bbb: undefined,
cccc: undefined,
fff: undefined,
aaa: undefined,
ddd: undefined,
kkk: undefined,
eee: undefined,
hhh: undefined
} }
this.handleQuery() })
});
console.log(dateTypeName, "一级表头");
// 添加表头数据
// 遍历dateTypeName
dateTypeName.forEach((item, index) => {
// 根据dateType每一个在最后需要的表头数据里面push二级表头
this.dateColData.push({
label: item.aaa,
children: [
{
prop: Object.keys(item)[1] + index,
label: Object.keys(item)[1] + "的值"
}, },
/** 导出按钮操作 */ {
handleExport() { prop: Object.keys(item)[2] + index,
const queryParams = this.queryParams label: Object.keys(item)[2] + "的值"
this.$confirm('是否确认操作?', '警告', { },
confirmButtonText: '确定', {
cancelButtonText: '取消', prop: Object.keys(item)[3] + index,
type: 'warning' label: Object.keys(item)[3] + "的值"
}).then(function() { }
return exportIncomeWmsBox(queryParams).then(response => { ]
const blob = new Blob([response]) })
const downloadElement = document.createElement('a') })
const href = window.URL.createObjectURL(blob)// 创建下载的链接
downloadElement.href = href // 遍历传来的数据
downloadElement.download = '库存管理信息' + '.xls' // 下载后文件名 this.mytableList.forEach(data => {
document.body.appendChild(downloadElement) data.data.forEach(item => {
downloadElement.click()// 点击下载 dateTypeName.forEach((citem, cindex) => {
document.body.removeChild(downloadElement)// 下载完成移除元素 if (item.aaa == citem.aaa) {
window.URL.revokeObjectURL(href)// 释放掉blob对象 let a = Object.keys(item)[1]
let b = Object.keys(item)[2]
let c = Object.keys(item)[3]
data[Object.keys(item)[1] + cindex] = item[a]
data[Object.keys(item)[2] + cindex] = item[b]
data[Object.keys(item)[3] + cindex] = item[c]
}
}) })
}) })
})
console.log(this.mytableList, "this.mytableList");
} }
} }
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment