fix: 报表三期样式修改

This commit is contained in:
mx00085@163.com
2023-03-29 17:10:21 +08:00
parent e63092e3fe
commit f68575d08e
7 changed files with 405 additions and 362 deletions

View File

@@ -38,29 +38,29 @@
</a-input>
</div>
<div style="display: flex; margin-bottom: 20px">
<div class="btnn btn1" @click="getTableData">
<div class="btnzx btnzx1" @click="getTableData">
<div class="search"></div>
<div class="btnText">搜索</div>
<div class="btnzText">搜索</div>
</div>
<div class="btn btn2" @click="reset">
<div class="btnz btnzx2" @click="reset">
<div class="search"></div>
<div class="btnText">重置</div>
<div class="btnzText">重置</div>
</div>
</div>
</div>
<!-- 以下为导出按钮 -->
<div class="btns">
<div class="btn btn3" @click="exportAllbtnz">
<div class="btnzs">
<div class="btnz btnz3" @click="exportAllbtnz">
<div>
<img src="../../assets/images/coursewareManage/export1.png" alt="" />
</div>
<div class="btnText">导出列表信息</div>
<div class="btnzText">导出列表信息</div>
</div>
<div class="btn btn3" @click="exportbtnz" style="margin-left: 20px">
<div class="btnz btnz3" @click="exportbtnz" style="margin-left: 20px">
<div>
<img src="../../assets/images/coursewareManage/export1.png" alt="" />
</div>
<div class="btnText">导出详细信息</div>
<div class="btnzText">导出详细信息</div>
</div>
</div>
<!-- 以下为table表格 -->
@@ -148,7 +148,7 @@ export default {
getTableData();
}
};
// cloumns 表头
const columns = ref([
{
@@ -227,7 +227,7 @@ export default {
title: "操作",
dataIndex: "operation",
key: "operation",
width: 150,
width: 200,
align: "center",
fixed: "right",
customRender: (record) => {
@@ -335,9 +335,10 @@ export default {
},
}).then((res) => {
downLoad(res.data, "详细信息.xlsx");
}),(err) => {
message.error(err)
}
}),
(err) => {
message.error(err);
};
} else {
const params = {
createName: state.createName,
@@ -352,11 +353,12 @@ export default {
headers: {
token: Cookies.get("token"),
},
}).then((res) => {
downLoad(res.data, "详细信息.xlsx");
}),(err) => {
message.error(err)
}
}).then((res) => {
downLoad(res.data, "详细信息.xlsx");
}),
(err) => {
message.error(err);
};
}
};
// 导出列表信息
@@ -372,21 +374,22 @@ export default {
},
}).then((res) => {
downLoad(res.data, "学习路径图信息.xlsx");
}),(err) => {
message.error(err)
}
}),
(err) => {
message.error(err);
};
} else {
const params = {
page: state.pageNo,
size: state.pageSize,
orgId: state.orgId ? state.orgId[state.orgId.length - 1] : null,
router: state.routerId,
routerName: state.routerName,
createName: state.createName,
startTime: state.startTime,
endTime: state.endTime,
name: state.name,
};
page: state.pageNo,
size: state.pageSize,
orgId: state.orgId ? state.orgId[state.orgId.length - 1] : null,
router: state.routerId,
routerName: state.routerName,
createName: state.createName,
startTime: state.startTime,
endTime: state.endTime,
name: state.name,
};
axios({
method: "post",
url: "/report/boeu/router/exportList",
@@ -397,11 +400,11 @@ export default {
},
}).then((res) => {
downLoad(res.data, "学习路径图信息.xlsx");
}),(err) => {
message.error(err)
}
}),
(err) => {
message.error(err);
};
}
};
onMounted(() => {
getOrgList();
@@ -436,32 +439,10 @@ export default {
.select {
margin-right: 20px;
margin-bottom: 20px;
width: calc((100% - 56px) / 4);
width: calc((100% - 76px - 220px) / 3);
}
.addTimeBox {
width: calc((100% - 76px - 360px) / 4 + 120px) !important;
position: relative;
display: flex;
align-items: center;
.addTime {
position: absolute;
z-index: 10;
margin-left: 10px;
color: rgba(0, 0, 0, 0.4);
}
.ant-picker {
padding-left: 85px;
}
.ant-picker-range .ant-picker-active-bar {
margin-left: 85px;
}
}
.btn {
.btnz {
padding: 0px 26px 0px 26px;
height: 38px;
background: rgba(64, 158, 255, 0);
@@ -478,7 +459,7 @@ export default {
background-size: 100%;
}
.btnText {
.btnzText {
font-size: 14px;
font-weight: 400;
color: rgba(64, 158, 255, 1);
@@ -487,7 +468,7 @@ export default {
}
}
.btnn {
.btnzx {
padding: 0px 26px 0px 26px;
height: 38px;
background: #4ea6ff;
@@ -504,7 +485,7 @@ export default {
background-size: 100%;
}
.btnText {
.btnzText {
font-size: 14px;
font-weight: 400;
color: #ffffff;
@@ -513,7 +494,7 @@ export default {
}
}
.btn1 {
.btnzx1 {
.search {
width: 15px;
height: 17px;
@@ -521,44 +502,79 @@ export default {
}
}
.btn2 {
.btnzx2 {
margin-right: 0px !important;
background: #4ea6ff;
.search {
width: 16px;
height: 18px;
background-image: url("../../assets/images/courseManage/reset1.png");
background-image: url("../../assets/images/courseManage/reset0.png");
}
.btnzText {
color: white;
}
}
.btn1:hover {
.btnzx1:hover {
background: rgba(64, 158, 255, 0.76);
.search {
background-image: url("../../assets/images/courseManage/search0.png");
}
.btnText {
.btnzText {
color: #ffffff;
}
}
.btnzx2:hover {
background: rgba(64, 158, 255, 0.76);
.btn1:active {
.search {
background-image: url("../../assets/images/courseManage/reset0.png");
}
.btnzText {
color: #ffffff;
}
}
.btnzx1:active,
.btnzx2:active {
background: #0982ff;
}
.btn2:hover {
background: rgba(64, 158, 255, 0.1);
}
.btn2:active {
background: rgba(64, 158, 255, 0.2);
}
.tabbtnz {
width: 100%;
height: 40px;
display: flex;
justify-content: space-between;
.tab {
margin-left: 38px;
display: flex;
background: #ecf5ff;
height: 40px;
line-height: 40px;
border-radius: 8px;
.tabItem {
box-sizing: border-box;
padding: 0 18px;
cursor: pointer;
}
.tabActive {
box-sizing: border-box;
padding: 0 18px;
background: #387df7;
color: white;
border-radius: 8px;
cursor: pointer;
}
}
}
.btns {
.btnzs {
display: flex;
margin-left: 38px;
// flex-wrap: wrap;
.btn {
.btnz {
padding: 0px 26px 0px 26px;
height: 38px;
background: white;
@@ -575,7 +591,7 @@ export default {
background-size: 100%;
}
.btnText {
.btnzText {
font-size: 14px;
font-weight: 400;
color: #4ea6ff;
@@ -584,7 +600,7 @@ export default {
}
}
.btn3 {
.btnz3 {
margin-right: 0px;
background: #4ea6ff;
.search {
@@ -592,19 +608,19 @@ export default {
height: 18px;
background-image: url("../../assets/images/courseManage/add0.png");
}
.btnText {
.btnzText {
color: #ffffff;
}
}
.btn3:hover {
.btnz3:hover {
// background: rgba(64, 158, 255, 0.76);
background: rgba(64, 158, 255, 0.2);
background: rgba(64, 158, 255, 0.76);
}
// .btn3:active {
// background: #0982ff;
// }
.btnz3:active {
background: #0982ff;
}
}
.tableBox {
margin: 20px 38px 30px;
@@ -624,3 +640,4 @@ export default {
}
}
</style>