Commit f7f43b43 by yanglang123

修改

parent 95c86962
.background {
background: #f8f9ff;
padding: 20px 15px;
}
.icon {
width: 11px;
height: 11px;
margin-bottom: 1px;
margin-left: 2px;
}
.titles {
display: flex;
justify-items: center;
align-items: center;
font-size: 16px;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
color: #1c1f37;
}
.titles img {
width: 24px;
height: 24px;
margin-right: 8px;
}
.box {
background: white;
border-radius: 5px;
padding: 20px 15px;
width: 1210px;
}
.box :global .ant-select-selection--single {
height: 25px !important;
}
.box :global .ant-select-selection__rendered {
line-height: 25px !important;
}
.box .row1 {
display: flex;
justify-content: space-between;
}
.box .row1 .card {
width: 285px;
height: 100px;
background: url("../imgs/1.png") no-repeat;
background-size: 100% 100%;
}
.box .row1 .card p:nth-child(1) {
color: white;
font-size: 14px;
margin: 0;
margin-top: 25px;
margin-left: 80px;
}
.box .row1 .card p:nth-child(2) {
margin: 0;
margin-bottom: 25px;
margin-left: 68px;
color: white;
font-size: 10px;
}
.box .row1 .card p:nth-child(2) span:nth-child(1) {
color: white;
font-size: 24px;
font-weight: 500;
margin-left: 10px;
}
.box .row1 .card2 {
width: 285px;
height: 100px;
background: url("../imgs/2.png") no-repeat;
background-size: 100% 100%;
}
.box .row1 .card2 p:nth-child(1) {
color: white;
font-size: 14px;
margin: 0;
margin-top: 25px;
margin-left: 80px;
}
.box .row1 .card2 p:nth-child(2) {
margin: 0;
margin-bottom: 25px;
margin-left: 68px;
color: white;
font-size: 10px;
}
.box .row1 .card2 p:nth-child(2) span:nth-child(1) {
color: white;
font-size: 24px;
font-weight: 500;
margin-left: 10px;
}
.box .row1 .card3 {
width: 285px;
height: 100px;
background: url("../imgs/3.png") no-repeat;
background-size: 100% 100%;
}
.box .row1 .card3 p:nth-child(1) {
color: white;
font-size: 14px;
margin: 0;
margin-top: 25px;
margin-left: 80px;
}
.box .row1 .card3 p:nth-child(2) {
margin: 0;
margin-bottom: 25px;
margin-left: 68px;
color: white;
font-size: 10px;
}
.box .row1 .card3 p:nth-child(2) span:nth-child(1) {
color: white;
font-size: 24px;
font-weight: 500;
margin-left: 10px;
}
.box .row1 .card4 {
width: 285px;
height: 100px;
background: url("../imgs/12.png") no-repeat;
background-size: 100% 100%;
}
.box .row1 .card4 p:nth-child(1) {
color: white;
font-size: 14px;
margin: 0;
margin-top: 25px;
margin-left: 80px;
}
.box .row1 .card4 p:nth-child(2) {
margin: 0;
margin-top: 15px;
margin-left: 80px;
color: white;
font-size: 10px;
}
.box .row1 .card4 p:nth-child(2) span:nth-child(1) {
color: white;
font-size: 24px;
font-weight: 500;
margin-left: 10px;
}
.box .row2 {
margin-top: 15px;
display: flex;
justify-content: space-between;
}
.box .row2 .chart1 {
width: 285px;
}
.box .row2 .chart1 .chartTop > div:nth-child(1) {
display: flex;
justify-content: space-between;
align-items: center;
}
.box .row2 .chart1 .chartTop > div:nth-child(1) > div:nth-child(1) {
display: flex;
justify-content: center;
align-items: center;
}
.box .row2 .chart1 .chartTop > div:nth-child(1) > div:nth-child(1) > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
.box .row2 .chart1 .chartTop > div:nth-child(1) > div:nth-child(1) > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
font-weight: 600;
color: #4a5154;
}
.box .row2 .chart1 .chartTop > div:nth-child(1) > div:nth-child(2) {
z-index: 1;
display: flex;
justify-content: center;
align-items: center;
}
.box .row2 .chart1 .chartTop > div:nth-child(1) > div:nth-child(2) .Select {
width: 80px;
}
.box .row2 .chart1 .chartBottom {
width: 285px;
height: 355px;
margin-top: -30px;
margin-bottom: -30px;
}
.box .row2 .chart2 {
width: 285px;
}
.box .row2 .chart2 .chartTop > div:nth-child(1) {
display: flex;
justify-content: space-between;
align-items: center;
}
.box .row2 .chart2 .chartTop > div:nth-child(1) > div:nth-child(1) {
display: flex;
justify-content: center;
align-items: center;
}
.box .row2 .chart2 .chartTop > div:nth-child(1) > div:nth-child(1) > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
.box .row2 .chart2 .chartTop > div:nth-child(1) > div:nth-child(1) > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
font-weight: 600;
color: #4a5154;
}
.box .row2 .chart2 .chartTop > div:nth-child(1) > div:nth-child(2) {
display: flex;
justify-content: center;
align-items: center;
}
.box .row2 .chart2 .chartTop > div:nth-child(1) > div:nth-child(2) .Select {
width: 80px;
}
.box .row2 .chart2 .chartBottom {
width: 285px;
min-height: 270px;
margin-top: 21px;
}
.box .row2 .chart2 .chartBottom .lllBox {
width: 100%;
height: 17px;
margin-bottom: 8px;
display: flex;
align-items: center;
justify-content: space-between;
}
.box .row2 .chart2 .chartBottom .lllBox p:nth-child(1) {
margin: 0;
font-size: 12px;
width: 50px;
height: 17px;
border-right: 1px dashed #c5c5d3;
font-family: PingFang SC, PingFang SC-400;
color: #8b8ba7;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.box .row2 .chart2 .chartBottom .lllBox > div:nth-child(2) {
height: 6px;
width: 210px;
border-radius: 0 3px 3px 0;
background: #f1f1f4;
overflow: hidden;
}
.box .row2 .chart2 .chartBottom .lllBox > div:nth-child(2) .process {
display: block;
height: 6px;
width: 0;
transition: width 1s ease-in-out;
border-radius: 0px 3px 3px 0px;
background: linear-gradient(180deg, #8675ff, #8386ff 51%, #75ccff 100%);
}
.box .row2 .chart2 .chartBottom .lllBox p:nth-child(3) {
margin: 0;
width: 20px;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
color: #8b8ba7;
text-align: right;
}
.box .row2 .chart3 {
width: 285px;
}
.box .row2 .chart3 .chartTop > div:nth-child(1) {
display: flex;
justify-content: space-between;
align-items: center;
}
.box .row2 .chart3 .chartTop > div:nth-child(1) > div:nth-child(1) {
display: flex;
justify-content: center;
align-items: center;
}
.box .row2 .chart3 .chartTop > div:nth-child(1) > div:nth-child(1) > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
.box .row2 .chart3 .chartTop > div:nth-child(1) > div:nth-child(1) > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
font-weight: 600;
color: #4a5154;
}
.box .row2 .chart3 .chartTop > div:nth-child(1) > div:nth-child(2) {
display: flex;
z-index: 1;
justify-content: center;
align-items: center;
}
.box .row2 .chart3 .chartTop > div:nth-child(1) > div:nth-child(2) .Select {
width: 65px;
}
.box .row2 .chart3 .chartTop > div:nth-child(1) > div:nth-child(2) .Select:nth-child(3) {
width: 80px;
}
.box .row2 .chart3 .chartBottom {
width: 285px;
height: 355px;
margin-top: -30px;
margin-bottom: -30px;
}
.box .row2 .chart4 {
width: 285px;
}
.box .row2 .chart4 .chartTop > div:nth-child(1) {
display: flex;
justify-content: space-between;
align-items: center;
}
.box .row2 .chart4 .chartTop > div:nth-child(1) > div:nth-child(1) {
display: flex;
justify-content: center;
align-items: center;
}
.box .row2 .chart4 .chartTop > div:nth-child(1) > div:nth-child(1) > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
.box .row2 .chart4 .chartTop > div:nth-child(1) > div:nth-child(1) > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
font-weight: 600;
color: #4a5154;
}
.box .row2 .chart4 .chartTop > div:nth-child(1) > div:nth-child(2) {
display: flex;
justify-content: center;
align-items: center;
}
.box .row2 .chart4 .chartTop > div:nth-child(1) > div:nth-child(2) .Select {
width: 80px;
}
.box .row2 .chart4 .chartTop > div:nth-child(1) > div:nth-child(2) .Select:nth-child(1) {
margin-right: 10px;
}
.box .row2 .chart4 .chartBottom {
height: 228px;
margin-top: 20px;
width: 285px;
}
.box .row2 .chart4 .chartBottom p {
margin: 0;
}
.box .row2 .chart4 .chartBottom > .title {
display: flex;
justify-content: space-between;
align-items: center;
background: #F5F6F7;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
font-weight: 400;
color: rgba(74, 81, 84, 0.7);
padding: 6px 12px;
margin-bottom: 15px;
}
.box .row2 .chart4 .chartBottom > .title p:nth-child(1) {
width: 20%;
text-align: left;
}
.box .row2 .chart4 .chartBottom > .title p:nth-child(2) {
width: 60%;
text-align: center;
}
.box .row2 .chart4 .chartBottom > .title p:nth-child(3) {
width: 20%;
text-align: right;
}
.box .row2 .chart4 .chartBottom > .list {
display: flex;
justify-content: space-between;
align-items: center;
padding: 8px 18px;
font-size: 14px;
color: #4a5154;
}
.box .row2 .chart4 .chartBottom > .list p:nth-child(1) {
width: 20%;
}
.box .row2 .chart4 .chartBottom > .list p:nth-child(1) > img {
width: 30px;
height: 30px;
display: block;
}
.box .row2 .chart4 .chartBottom > .list p:nth-child(1) .p {
font-size: 14px;
width: 30px;
display: block;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
text-align: center;
color: #8b8ba7;
}
.box .row2 .chart4 .chartBottom > .list p:nth-child(2) {
width: 60%;
text-align: center;
}
.box .row2 .chart4 .chartBottom > .list p:nth-child(3) {
width: 20%;
text-align: right;
}
.box1 {
width: 1210px;
}
.box1 :global .ant-select-selection--single {
height: 25px !important;
}
.box1 :global .ant-select-selection__rendered {
line-height: 25px !important;
}
.box1 .row1 {
display: flex;
justify-content: space-between;
height: 460px;
}
.box1 .row1 > div:nth-child(1) {
padding: 20px 15px;
width: 700px;
background: white;
border-radius: 5px;
}
.box1 .row1 > div:nth-child(1) > div:nth-child(1) {
display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom: 18px;
}
.box1 .row1 > div:nth-child(1) > div:nth-child(1) > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
.box1 .row1 > div:nth-child(1) > div:nth-child(1) > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
font-weight: 600;
color: #4a5154;
}
.box1 .row1 > div:nth-child(1) > .zllBox {
width: 100%;
height: 45px;
display: flex;
align-items: center;
justify-content: space-between;
}
.box1 .row1 > div:nth-child(1) > .zllBox p:nth-child(1) {
margin: 0;
font-size: 12px;
width: 150px;
height: 45px;
line-height: 45px;
border-right: 1px dashed #c5c5d3;
font-family: PingFang SC, PingFang SC-400;
color: #8b8ba7;
text-align: right;
padding: 0 15px;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) {
width: 520px;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(1) {
display: flex;
align-items: center;
justify-content: space-between;
height: 13px;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) {
height: 7px;
width: 540px;
border-radius: 0 3px 3px 0;
background: #f1f1f4;
overflow: hidden;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) .process {
display: block;
height: 7px;
width: 0;
transition: width 1s ease-in-out;
border-radius: 0px 3px 3px 0px;
background: linear-gradient(-90deg, #17c77b 0%, #6ce671 100%);
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(1) > p {
margin: 0;
width: 30px;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
color: #8b8ba7;
text-align: right;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(2) {
display: flex;
align-items: center;
justify-content: space-between;
height: 13px;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(2) > div:nth-child(1) {
height: 7px;
width: 540px;
border-radius: 0 3px 3px 0;
background: #f1f1f4;
overflow: hidden;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(2) > div:nth-child(1) .process {
display: block;
height: 7px;
width: 0;
transition: width 1s ease-in-out;
border-radius: 0px 3px 3px 0px;
background: linear-gradient(-90deg, #34b9f3 0%, #a3e3ff 100%);
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(2) > p {
margin: 0;
width: 30px;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
color: #8b8ba7;
text-align: right;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(3) {
display: flex;
align-items: center;
justify-content: space-between;
height: 13px;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(3) > div:nth-child(1) {
height: 7px;
width: 540px;
border-radius: 0 3px 3px 0;
background: #f1f1f4;
overflow: hidden;
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(3) > div:nth-child(1) .process {
display: block;
height: 7px;
width: 0;
transition: width 1s ease-in-out;
border-radius: 0px 3px 3px 0px;
background: linear-gradient(-90deg, #f59a23 0%, #fece8f 100%);
}
.box1 .row1 > div:nth-child(1) > .zllBox > div:nth-child(2) > div:nth-child(3) > p {
margin: 0;
width: 30px;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
color: #8b8ba7;
text-align: right;
}
.box1 .row1 > div:nth-child(1) > .zllbox2 {
margin-top: 21px;
display: flex;
align-items: center;
justify-content: space-between;
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum1 {
width: 100px;
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum1 .green {
background: linear-gradient(270deg, #17c77b 0%, #6ce671);
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum1 .blue {
background: linear-gradient(270deg, #34b9f3 0%, #a3e3ff);
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum1 .yellow {
background: linear-gradient(270deg, #f59a23 0%, #fece8f);
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum1 > div {
background: #f5f6f7;
height: 26px;
opacity: 0.7;
line-height: 26px;
color: #4a5154;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
text-align: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 12px;
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum1 > p {
margin: 0;
height: 30px;
line-height: 30px;
display: flex;
align-items: center;
justify-content: center;
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum1 > p > span:nth-child(1) {
height: 8px;
width: 8px;
border-radius: 50%;
display: block;
margin-right: 5px;
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum1 > p > p:nth-child(2) {
display: block;
font-size: 14px;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
color: #4a5154;
text-align: center;
margin: 0;
height: 30px;
line-height: 30px;
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum {
width: 120px;
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum > div {
background: #f5f6f7;
height: 26px;
opacity: 0.7;
line-height: 26px;
color: #4a5154;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
text-align: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 12px;
}
.box1 .row1 > div:nth-child(1) > .zllbox2 > .zllNum > p {
margin: 0;
height: 30px;
line-height: 30px;
font-size: 14px;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
color: #4a5154;
text-align: center;
}
.box1 .row1 > div:nth-child(2) {
padding: 20px 15px;
width: 495px;
background: white;
border-radius: 5px;
}
.box1 .row1 > div:nth-child(2) > div:nth-child(1) {
display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom: 18px;
}
.box1 .row1 > div:nth-child(2) > div:nth-child(1) > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
.box1 .row1 > div:nth-child(2) > div:nth-child(1) > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
font-weight: 600;
color: #4a5154;
}
.box1 .row1 > div:nth-child(2) > div:nth-child(2) {
display: flex;
align-items: center;
justify-content: space-between;
}
.box1 .row1 > div:nth-child(2) > div:nth-child(2) > .chartList {
width: 50%;
}
.box1 .row1 > div:nth-child(2) > div:nth-child(2) > .chartList > p {
margin: 0;
text-align: center;
font-size: 14px;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
color: #8b8ba7;
}
.box1 .row1 > div:nth-child(2) > div:nth-child(2) > .chartList > .chartBottom {
width: 250px;
height: 400px;
margin-top: -10px;
margin-bottom: -30px;
}
.box1 .row2 {
display: flex;
justify-content: space-between;
margin-top: 12px;
height: 460px;
}
.box1 .row2 > div:nth-child(1) {
padding: 20px 15px;
width: 240px;
background: white;
border-radius: 5px;
}
.box1 .row2 > div:nth-child(1) > div:nth-child(1) {
display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom: 38px;
}
.box1 .row2 > div:nth-child(1) > div:nth-child(1) > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
.box1 .row2 > div:nth-child(1) > div:nth-child(1) > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
font-weight: 600;
color: #4a5154;
}
.box1 .row2 > div:nth-child(1) > .questionBox {
width: 190px;
background: #f3f6f9;
border-radius: 4px;
box-shadow: 0px 2.5px 5px 0px #f1f2fa;
margin: 0 auto 38px;
padding: 26px 22px;
}
.box1 .row2 > div:nth-child(1) > .questionBox > div:nth-child(1) {
display: flex;
justify-content: space-between;
align-items: center;
margin: 0 auto 6px;
width: 100px;
}
.box1 .row2 > div:nth-child(1) > .questionBox > div:nth-child(1) > p:nth-child(1) {
margin: 0;
width: 40px;
height: 40px;
background: url("../imgs/14.png") no-repeat;
}
.box1 .row2 > div:nth-child(1) > .questionBox > div:nth-child(1) > p:nth-child(2) {
margin: 0;
font-size: 28px;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
color: #8b8ba7;
}
.box1 .row2 > div:nth-child(1) > .questionBox > p:nth-child(2) {
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
text-align: center;
color: #8b8ba7;
margin: 0;
}
.box1 .row2 > div:nth-child(2) {
width: 955px;
padding: 20px 15px;
background: white;
border-radius: 5px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(1) {
display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom: 18px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(1) > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(1) > p {
margin: 0;
font-size: 18px;
font-family: PingFang SC, PingFang SC-600;
font-weight: 600;
color: #4a5154;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) {
display: flex;
justify-content: space-between;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .tgchart {
width: 220px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .tgchart > .chartTop > div:nth-child(1) {
display: flex;
justify-content: space-between;
align-items: center;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .tgchart > .chartTop > div:nth-child(1) > div:nth-child(1) {
display: flex;
justify-content: center;
align-items: center;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .tgchart > .chartTop > div:nth-child(1) > div:nth-child(1) > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .tgchart > .chartTop > div:nth-child(1) > div:nth-child(1) > p {
margin: 0;
font-size: 14px;
font-family: PingFang SC, PingFang SC-600;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
color: #8b8ba7;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .tgchart > .chartTop > div:nth-child(1) > div:nth-child(2) {
z-index: 1;
display: flex;
justify-content: center;
align-items: center;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .tgchart > .chartTop > div:nth-child(1) > div:nth-child(2) .Select {
width: 80px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .tgchart .chartBottom {
width: 220px;
height: 420px;
margin-top: -30px;
margin-bottom: -30px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .line {
width: 1px;
background: #e7e7e7;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData {
width: 680px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .chartTop > div:nth-child(1) {
display: flex;
justify-content: space-between;
align-items: center;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .chartTop > div:nth-child(1) > div:nth-child(1) {
display: flex;
justify-content: center;
align-items: center;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .chartTop > div:nth-child(1) > div:nth-child(1) > img {
height: 18px;
width: 4px;
margin-right: 5px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .chartTop > div:nth-child(1) > div:nth-child(1) > p {
margin: 0;
font-size: 14px;
font-family: PingFang SC, PingFang SC-600;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
color: #8b8ba7;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .chartTop > div:nth-child(1) > div:nth-child(2) {
z-index: 1;
display: flex;
justify-content: center;
align-items: center;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .chartTop > div:nth-child(1) > div:nth-child(2) .Select {
width: 80px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData .chartBottom {
width: 680px;
height: 200px;
margin-top: 10px;
margin-bottom: -30px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .zllbox2 {
margin-top: 18px;
display: flex;
align-items: center;
justify-content: space-between;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .zllbox2 > .zllNum1 {
width: 180px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .zllbox2 > .zllNum1 .green {
background: linear-gradient(270deg, #17c77b 0%, #6ce671);
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .zllbox2 > .zllNum1 .blue {
background: linear-gradient(270deg, #34b9f3 0%, #a3e3ff);
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .zllbox2 > .zllNum1 .yellow {
background: linear-gradient(270deg, #f59a23 0%, #fece8f);
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .zllbox2 > .zllNum1 > p {
background: #f5f6f7;
height: 26px;
opacity: 0.7;
line-height: 26px;
color: #4a5154;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
text-align: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 4px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .zllbox2 > .zllNum1 > div {
margin: 0;
height: 26px;
line-height: 26px;
display: flex;
align-items: center;
justify-content: flex-start;
padding-left: 22px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .zllbox2 > .zllNum1 > div > span:nth-child(1) {
height: 8px;
width: 8px;
border-radius: 50%;
display: block;
margin-right: 5px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .zllbox2 > .zllNum1 > div > span:nth-child(2) {
display: block;
font-size: 14px;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
color: #4a5154;
text-align: center;
margin: 0;
height: 30px;
line-height: 30px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .zllbox2 > .zllNum {
width: 125px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .zllbox2 > .zllNum > div {
background: #f5f6f7;
height: 26px;
opacity: 0.7;
line-height: 26px;
color: #4a5154;
font-size: 12px;
font-family: PingFang SC, PingFang SC-400;
text-align: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 4px;
}
.box1 .row2 > div:nth-child(2) > div:nth-child(2) > .lineData > .zllbox2 > .zllNum > p {
margin: 0;
height: 26px;
line-height: 26px;
font-size: 14px;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
color: #4a5154;
text-align: center;
}
...@@ -39,8 +39,8 @@ ...@@ -39,8 +39,8 @@
.row1{ .row1{
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.card{ .card{
width: 285px; width: 285px;
height: 100px; height: 100px;
...@@ -180,9 +180,7 @@ ...@@ -180,9 +180,7 @@
justify-content: center; justify-content: center;
align-items: center; align-items: center;
& .Select{ & .Select{
width: 80px; width: 80px;
}
& .Select:nth-child(1){
} }
} }
} }
...@@ -226,9 +224,7 @@ ...@@ -226,9 +224,7 @@
align-items: center; align-items: center;
& .Select{ & .Select{
width: 80px; width: 80px;
}
& .Select:nth-child(1){
} }
} }
} }
...@@ -254,9 +250,9 @@ ...@@ -254,9 +250,9 @@
border-right:1px dashed #c5c5d3 ; border-right:1px dashed #c5c5d3 ;
font-family: PingFang SC, PingFang SC-400; font-family: PingFang SC, PingFang SC-400;
color: #8b8ba7; color: #8b8ba7;
white-space:nowrap; white-space:nowrap;
overflow:hidden; overflow:hidden;
text-overflow:ellipsis; text-overflow:ellipsis;
} }
& > div:nth-child(2){ & > div:nth-child(2){
height: 6px; height: 6px;
...@@ -315,13 +311,7 @@ ...@@ -315,13 +311,7 @@
align-items: center; align-items: center;
& .Select{ & .Select{
width: 65px; width: 65px;
}
& .Select:nth-child(1){
// margin-right: 10px;
}
& .Select:nth-child(2){
// margin-right: 10px;
} }
& .Select:nth-child(3){ & .Select:nth-child(3){
width: 80px; width: 80px;
...@@ -367,7 +357,7 @@ ...@@ -367,7 +357,7 @@
align-items: center; align-items: center;
& .Select{ & .Select{
width: 80px; width: 80px;
} }
& .Select:nth-child(1){ & .Select:nth-child(1){
margin-right: 10px; margin-right: 10px;
...@@ -437,7 +427,7 @@ ...@@ -437,7 +427,7 @@
} }
} }
} }
} }
} }
...@@ -464,7 +454,7 @@ ...@@ -464,7 +454,7 @@
border-radius: 5px; border-radius: 5px;
& > div:nth-child(1){ & > div:nth-child(1){
display: flex; display: flex;
justify-content: start; justify-content: flex-start;
align-items: center; align-items: center;
margin-bottom: 18px; margin-bottom: 18px;
&> img{ &> img{
...@@ -588,7 +578,7 @@ ...@@ -588,7 +578,7 @@
} }
} }
} }
} }
& > .zllbox2{ & > .zllbox2{
margin-top: 21px; margin-top: 21px;
...@@ -615,9 +605,9 @@ ...@@ -615,9 +605,9 @@
font-size: 12px; font-size: 12px;
font-family: PingFang SC, PingFang SC-400; font-family: PingFang SC, PingFang SC-400;
text-align: center; text-align: center;
white-space:nowrap; white-space:nowrap;
overflow:hidden; overflow:hidden;
text-overflow:ellipsis; text-overflow:ellipsis;
margin-bottom: 12px; margin-bottom: 12px;
} }
& > p{ & > p{
...@@ -645,7 +635,7 @@ ...@@ -645,7 +635,7 @@
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
} }
} }
} }
& > .zllNum{ & > .zllNum{
...@@ -659,9 +649,9 @@ ...@@ -659,9 +649,9 @@
font-size: 12px; font-size: 12px;
font-family: PingFang SC, PingFang SC-400; font-family: PingFang SC, PingFang SC-400;
text-align: center; text-align: center;
white-space:nowrap; white-space:nowrap;
overflow:hidden; overflow:hidden;
text-overflow:ellipsis; text-overflow:ellipsis;
margin-bottom: 12px; margin-bottom: 12px;
} }
& > p{ & > p{
...@@ -685,7 +675,7 @@ ...@@ -685,7 +675,7 @@
border-radius: 5px; border-radius: 5px;
& > div:nth-child(1){ & > div:nth-child(1){
display: flex; display: flex;
justify-content: start; justify-content: flex-start;
align-items: center; align-items: center;
margin-bottom: 18px; margin-bottom: 18px;
&> img{ &> img{
...@@ -737,7 +727,7 @@ ...@@ -737,7 +727,7 @@
border-radius: 5px; border-radius: 5px;
& > div:nth-child(1){ & > div:nth-child(1){
display: flex; display: flex;
justify-content: start; justify-content: flex-start;
align-items: center; align-items: center;
margin-bottom: 38px; margin-bottom: 38px;
&> img{ &> img{
...@@ -757,7 +747,7 @@ ...@@ -757,7 +747,7 @@
width: 190px; width: 190px;
background: #f3f6f9; background: #f3f6f9;
border-radius: 4px; border-radius: 4px;
box-shadow: 0px 2.5px 5px 0px #f1f2fa; box-shadow: 0px 2.5px 5px 0px #f1f2fa;
margin: 0 auto 38px; margin: 0 auto 38px;
padding: 26px 22px; padding: 26px 22px;
& > div:nth-child(1){ & > div:nth-child(1){
...@@ -797,7 +787,7 @@ ...@@ -797,7 +787,7 @@
border-radius: 5px; border-radius: 5px;
& > div:nth-child(1){ & > div:nth-child(1){
display: flex; display: flex;
justify-content: start; justify-content: flex-start;
align-items: center; align-items: center;
margin-bottom: 18px; margin-bottom: 18px;
&> img{ &> img{
...@@ -847,9 +837,7 @@ ...@@ -847,9 +837,7 @@
justify-content: center; justify-content: center;
align-items: center; align-items: center;
& .Select{ & .Select{
width: 80px; width: 80px;
}
& .Select:nth-child(1){
} }
} }
} }
...@@ -898,9 +886,7 @@ ...@@ -898,9 +886,7 @@
justify-content: center; justify-content: center;
align-items: center; align-items: center;
& .Select{ & .Select{
width: 80px; width: 80px;
}
& .Select:nth-child(1){
} }
} }
} }
...@@ -936,9 +922,9 @@ ...@@ -936,9 +922,9 @@
font-size: 12px; font-size: 12px;
font-family: PingFang SC, PingFang SC-400; font-family: PingFang SC, PingFang SC-400;
text-align: center; text-align: center;
white-space:nowrap; white-space:nowrap;
overflow:hidden; overflow:hidden;
text-overflow:ellipsis; text-overflow:ellipsis;
margin-bottom: 4px; margin-bottom: 4px;
} }
& > div{ & > div{
...@@ -947,7 +933,7 @@ ...@@ -947,7 +933,7 @@
line-height: 26px; line-height: 26px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: start; justify-content: flex-start;
padding-left: 22px; padding-left: 22px;
& > span:nth-child(1){ & > span:nth-child(1){
height: 8px; height: 8px;
...@@ -967,7 +953,7 @@ ...@@ -967,7 +953,7 @@
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
} }
} }
} }
& > .zllNum{ & > .zllNum{
...@@ -981,9 +967,9 @@ ...@@ -981,9 +967,9 @@
font-size: 12px; font-size: 12px;
font-family: PingFang SC, PingFang SC-400; font-family: PingFang SC, PingFang SC-400;
text-align: center; text-align: center;
white-space:nowrap; white-space:nowrap;
overflow:hidden; overflow:hidden;
text-overflow:ellipsis; text-overflow:ellipsis;
margin-bottom: 4px; margin-bottom: 4px;
} }
& > p{ & > p{
......
import React from "react";
import {
Rate,
Table,
Modal,
Form,
Input,
Icon,
Tooltip,
Pagination,
Popconfirm,
Divider,
Row,
Col,
Button,
} from "antd";
import {
getCommentList,
getReplyList,
checkComment,
tpCommentDel,
handleUp,
downloadComment,
} from "./redux/commentAction";
import moment from "moment";
import { connect } from "react-redux";
import styles from "./index.less";
import intl from "react-intl-universal";
const FormItem = Form.Item;
const CollectionCreateForm = Form.create()(
class extends React.Component {
render() {
const { visible, onCancel, onCreate, form } = this.props;
const { getFieldDecorator } = form;
const formItemLayout = {
labelCol: {
xs: { span: 24 },
sm: { span: 4 },
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 20 },
},
};
return (
<Modal
visible={visible}
title="评论回复审核"
okText= {intl.get("Yes").d("确定")}
cancelText={intl.get("Cancel").d("取消")}
onCancel={onCancel}
onOk={onCreate}
destroyOnClose
>
{this.props.record.id && (
<Form layout="horizontal">
<FormItem className={styles.dispno}>
{getFieldDecorator("id", {
initialValue: this.props.record.id,
})(<Input className={styles.dispno} />)}
</FormItem>
<FormItem className={styles.dispno}>
{getFieldDecorator("flag", {
initialValue: this.props.record.flag
? this.props.record.flag
: "1",
})(<Input className={styles.dispno} />)}
</FormItem>
<FormItem {...formItemLayout} label="评论人:">
{getFieldDecorator("commentator", {
initialValue: this.props.record.commentator,
rules: [{ required: true, message: "请输入评论人!" }],
})(<Input disabled />)}
</FormItem>
<FormItem {...formItemLayout} label="审批意见:">
{getFieldDecorator("rmark", {
// rules: [{ required: true, message: '请输入审批意见!' }],
})(<Input.TextArea />)}
</FormItem>
</Form>
)}
</Modal>
);
}
}
);
class InfoComment extends React.Component {
constructor(props) {
super(props);
this.state = {
pageNo: 1,
pageSize: 20,
record: {},
visible: false,
value: 3,
a: 1,
};
this.columns = [
{
title: "序号",
dataIndex: "key",
key: "key",
},
{
title: "评论人",
dataIndex: "commentator",
key: "commentator",
},
{
title: "姓名",
dataIndex: "commentatorName", //createByFullName
key: "commentatorName",
},
{
title: "评论对象",
dataIndex: "replyName", //parentAccountFullName
key: "replyName",
},
{
title: "评论内容",
dataIndex: "content",
key: "content",
// width: '0%',
render: text => {
return (
<Tooltip title={text}>
<p className={styles.otwhen}>{text}</p>
</Tooltip>
);
},
},
{
title: "评论时间",
dataIndex: "createTime",
key: "createTime",
render: text => (
<span>{moment(text).format("YYYY-MM-DD HH:mm:ss")}</span>
),
},
{
title: "点赞数",
dataIndex: "thumbsUps",
key: "thumbsUps",
render: (text, records) => {
return text !== undefined ? (
<span>
{text - 0}<Icon type="like-o" />
</span>
) : null;
},
},
{
title: "状态",
dataIndex: "state",
key: "state",
render: (text, records) => {
return <span>{text ? "下架" : "上架"}</span>;
},
},
{
title: intl.get("operate").d("操作"),
dataIndex: "operation",
key: "operation",
render: (text, record) => (
<span>
{!record.state ? (
<Popconfirm
title="确定下架该评论?"
onConfirm={() => this.handleDown(record.id, record)}
>
<a>下架</a>
</Popconfirm>
) : (
<Popconfirm
title="确定上架该评论?"
onConfirm={() => this.handleUp(record.id, record)}
>
<a>上架</a>
</Popconfirm>
)}
<Divider type="vertical" />
<Popconfirm
title="确定删除该评论?"
onConfirm={() => this.tpCommentDel(record.id, record)}
>
<a>{intl.get("Delete") || "删除"}</a>
</Popconfirm>
</span>
),
},
];
this.handlePageChange = this.handlePageChange.bind(this);
this.handlePageSizeChange = this.handlePageSizeChange.bind(this);
this.handleDown = this.handleDown.bind(this);
this.downloadCommentFun = this.downloadCommentFun.bind(this);
this.seta = this.seta.bind(this);
}
componentDidMount() {
this.props.getcommentlist({
trainingProjectId: this.props.id,
bizType:2,
pageNo: this.state.pageNo,
pageSize: this.state.pageSize,
});
}
handleChange = value => {
this.setState({ value });
};
handleExpand = (expanded, record) => {
this.setState({ Rkey: record.index });
this.props.getreplylist({ commmentId: record.id }, record.index, () => {
this.setState({ a: 2 });
});
};
onExpandedRowsChangehandle(expandedRows) {
console.log(expandedRows);
}
seta() {
this.setState({ a: 2 });
}
// 回复下架
handleDown(id, record) {
this.props.checkcomment(
{
id: id,
auditContent: "",
isreply: record.flag ? true : false,
commmentId: record.tpCommentId,
index: record.index ? record.index : this.state.Rkey,
},
{
trainingProjectId: this.props.id,
pageNo: this.state.pageNo,
pageSize: this.state.pageSize,
},
() => {
this.setState({ a: 2 });
}
);
}
// 回复上架
handleUp = (id, record) => {
this.props.handleUp(
{
id: id,
auditContent: "",
isreply: record.flag ? true : false,
commmentId: record.tpCommentId,
index: record.index ? record.index : this.state.Rkey,
},
{
trainingProjectId: this.props.id,
pageNo: this.state.pageNo,
pageSize: this.state.pageSize,
},
() => {
this.setState({ a: 2 });
}
);
};
// 评论删除
tpCommentDel = (id, record) => {
this.props.tpCommentDel(
{
id: id,
auditContent: "",
isreply: record.flag ? true : false,
commmentId: record.tpCommentId,
index: record.index ? record.index : this.state.Rkey,
},
{
trainingProjectId: this.props.id,
pageNo: this.state.pageNo,
pageSize: this.state.pageSize,
},
() => {
this.setState({ a: 2 });
}
);
};
//download
downloadCommentFun = () => {
let { id, name } = this.props;
console.log("点击下载评论", this.props);
this.props.downloadComment({
trainingProjectId: id,
trainingProjectName: name,
});
};
showTotal(total) {
return `共计 ${total} 条`;
}
handlePageChange(page, pageSize) {
this.setState({ pageNo: page });
this.props.getcommentlist({
trainingProjectId: this.props.id,
pageNo: page,
pageSize: pageSize,
});
}
handlePageSizeChange(current, size) {
this.setState({ pageSize: size });
this.props.getcommentlist({
trainingProjectId: this.props.id,
pageNo: this.state.pageNo,
pageSize: size,
});
}
render() {
const { value } = this.state;
const { commentlist } = this.props;
console.log(commentlist, "**&*&*&*&*&*&*&commentlist*&*&*&*&*&*&");
return (
<div className={styles.comment}>
<div className={styles.mar40}>
<span>
<h2>{this.props.name}</h2>
<Row style={{ top: "-10px" }}>
<Col span={4} key={4} style={{ float: "right" }}>
<Popconfirm
title="确定下载评论信息?"
onConfirm={this.downloadCommentFun}
>
<Button type="primary">下载评论信息</Button>
</Popconfirm>
</Col>
</Row>
</span>
<Table
columns={this.columns}
dataSource={commentlist.list}
onExpandedRowsChangehandle={() => {
this.onExpandedRowsChangehandle(expandedRows);
}}
onExpand={this.handleExpand}
pagination={false}
rowKey="id"
/>
<Pagination
className={styles.comment_pagination}
size="small"
total={commentlist.listTotal}
showTotal={this.showTotal}
showSizeChanger
showQuickJumper
defaultPageSize={20}
pageSizeOptions={["20", "30", "40", "50"]}
onChange={this.handlePageChange}
onShowSizeChange={this.handlePageSizeChange}
/>
</div>
</div>
);
}
}
function mapStateToProps(state, ownProps) {
return {
commentlist: state.trainComment.commentlist,
commentreply: state.trainComment.commentreply,
};
}
function mapDispatchToProps(dispatch) {
return {
getcommentlist: data => dispatch(getCommentList(data)),
getreplylist: (data, key, callback) =>
dispatch(getReplyList(data, key, callback)),
checkReply: (obj, page) => dispatch(checkReply(obj, page)),
checkcomment: (obj, page, callback) =>
dispatch(checkComment(obj, page, callback)),
tpCommentDel: (obj, page, callback) =>
dispatch(tpCommentDel(obj, page, callback)),
handleUp: (obj, page, callback) => dispatch(handleUp(obj, page, callback)),
downloadComment: (data, callback) =>
dispatch(downloadComment(data, callback)),
};
}
export default connect(
mapStateToProps,
mapDispatchToProps
)(Form.create()(InfoComment));
...@@ -50,7 +50,7 @@ import { ...@@ -50,7 +50,7 @@ import {
} from "./redux/action"; } from "./redux/action";
import moment from "moment"; import moment from "moment";
import Styles from "./index.less"; import Styles from "./index.less";
import InfoComment from "./InfoComment.jsx";
const TreeNode = Tree.TreeNode; const TreeNode = Tree.TreeNode;
const FormItem = Form.Item; const FormItem = Form.Item;
const Option = Select.Option; const Option = Select.Option;
...@@ -421,6 +421,10 @@ class Information extends React.Component { ...@@ -421,6 +421,10 @@ class Information extends React.Component {
start: "", start: "",
end: "", end: "",
}, },
commentKey: "", //评论管理modal key
commentName: "", //评论管理 项目名称
commentId: "", //评论管理 项目ID
commentVisible: false, //评论弹框
}; };
} }
...@@ -622,6 +626,23 @@ class Information extends React.Component { ...@@ -622,6 +626,23 @@ class Information extends React.Component {
console.log(this.props.tableList, "-------------tableList----------"); console.log(this.props.tableList, "-------------tableList----------");
}); });
}; };
//弹出评论管理
showComment = (id, name) => {
this.setState(
{
commentVisible: true,
commentKey: new Date().getTime(),
commentId: id,
commentName: name,
}
);
};
//关闭评论管理
hideComment = () => {
this.setState({
commentVisible: false,
});
};
//上架 //上架
shelves = record => { shelves = record => {
let _this = this; let _this = this;
...@@ -1115,6 +1136,12 @@ class Information extends React.Component { ...@@ -1115,6 +1136,12 @@ class Information extends React.Component {
> >
{record.isTop == "1" ? "移除首页" : "同步首页"} {record.isTop == "1" ? "移除首页" : "同步首页"}
</a> </a>
<a
className={Styles.marr10}
onClick={() => this.showComment(record.id, record.name)}
>
评论管理
</a>
{record.state == "2" ? ( {record.state == "2" ? (
<div style={{ display: "inline" }}> <div style={{ display: "inline" }}>
<a <a
...@@ -1189,7 +1216,6 @@ class Information extends React.Component { ...@@ -1189,7 +1216,6 @@ class Information extends React.Component {
return ( return (
<div className={Styles.pmEditIcon}> <div className={Styles.pmEditIcon}>
<Head headForm={this.headForm} showModal={this.showModal} /> <Head headForm={this.headForm} showModal={this.showModal} />
<Row> <Row>
<Col <Col
span={4} span={4}
...@@ -1304,6 +1330,20 @@ class Information extends React.Component { ...@@ -1304,6 +1330,20 @@ class Information extends React.Component {
</FormItem> </FormItem>
</Form> </Form>
</Modal> </Modal>
{/*评论管理*/}
<Modal
width={1250}
visible={this.state.commentVisible}
onCancel={this.hideComment}
footer={false}
key={this.state.commentKey}
destroyOnClose={1}
>
<InfoComment
id={this.state.commentId}
name={this.state.commentName}
/>
</Modal>
</div> </div>
); );
} }
......
...@@ -13,4 +13,15 @@ export default { ...@@ -13,4 +13,15 @@ export default {
getSeeEditApi: `GET ${services.webManage}/site/classify/info/view`, getSeeEditApi: `GET ${services.webManage}/site/classify/info/view`,
postUpdataApi: `POST ${services.webManage}/site/classify/info/update`, postUpdataApi: `POST ${services.webManage}/site/classify/info/update`,
getMenuApi: `GET ${services.base}/system/dictionary/child/listByCode`, getMenuApi: `GET ${services.base}/system/dictionary/child/listByCode`,
comment: {
getCommentsList: `GET ${services.webManage}/tpComment/list`,
getRepCommentList: `GET ${services.webManage}/tpCommentReply/list`,
downloadComments: `GET ${services.webManage}/tpComment/list/export`,
upRepComment: `GET ${services.webManage}/tpCommentReply/up`,
upComment: `GET ${services.webManage}/tpComment/up`,
downRepComment: `GET ${services.webManage}/tpCommentReply/down`,
downComment: `GET ${services.webManage}/tpComment/down`,
deleteRepComment: `GET ${services.webManage}/tpCommentReply/deleteReply`,
deleteComment: `POST ${services.webManage}/tpComment/deleteTpComment`,
},
}; };
import { message } from "antd";
import request from "@/util/request.js";
import api from "./api";
import { createAction } from "redux-actions";
const { comment } = api;
const {
getCommentsList,
getRepCommentList,
downloadComments,
upComment,
upRepComment,
downRepComment,
downComment,
deleteRepComment,
deleteComment,
} = comment;
export const GET_COMMENT_LIST_TRAIN = "GET_COMMENT_LIST_TRAIN";
export const GET_REPLY_LIST_TRAIN = "GET_REPLY_LIST_TRAIN";
let getcommentlist = createAction(GET_COMMENT_LIST_TRAIN);
let getreplylist = createAction(GET_REPLY_LIST_TRAIN);
export { getcommentlist, getreplylist };
//获取评论列表
export function getCommentList(param, paramreply) {
return dispatch => {
return request({
url: getCommentsList,
data: param,
}).then(res => {
if (res.code === "1000") {
let arr = [];
for (let i = 0; i < res.data.records.length; i++) {
const temp = {
...res.data.records[i],
// key:(res.data.total-(param.pageNo-1)*param.pageSize-i)
key: i + 1,
};
if (res.data.records[i].replys > 0) {
temp.children = [];
temp.index = i;
}
arr.push(temp);
}
dispatch({
type: GET_COMMENT_LIST_TRAIN,
data: {
list: arr,
listTotal: res.data.total,
avgLevel: res.data.avgLevel,
},
});
} else {
message.error("加载失败...");
}
});
};
}
//获取回复列表
export function getReplyList(param, key, callback) {
return dispatch => {
return request({
url: getRepCommentList,
data: param,
}).then(res => {
if (res.code === "1000") {
// console.log(res.data.records)
const arr = [];
for (let i = 0; i < res.data.records.length; i++) {
arr.push({
...res.data.records[i],
commentatorName: res.data.records[i].createByFullName,
replyName: res.data.records[i].parentAccountFullName,
commentator: res.data.records[i].createByName,
flag: "reply",
});
}
dispatch({
type: GET_REPLY_LIST_TRAIN,
data: { children: arr, key: key },
});
console.log(arr);
if (callback) {
callback();
}
} else {
message.error("加载失败...");
}
});
};
}
//下载评论
export function downloadComment(param) {
return dispatch => {
return request({
url: downloadComments,
data: param,
}).then(res => {
if (res.code === "1000") {
message.success(res.data.result);
} else {
message.error(res.subMsg);
}
});
};
}
//评论上架
export function handleUp(param, page, callback) {
let params = {};
params.id = param.id;
if (param.isreply) {
return dispatch => {
return request({
url: upRepComment,
data: param,
}).then(res => {
if (res.code === "1000") {
message.success("已上架");
dispatch(getReplyList(param, param.index, callback));
} else {
message.error("提交失败...");
}
});
};
}
return dispatch => {
return request({
url: upComment,
data: param,
}).then(res => {
if (res.code === "1000") {
message.success("已上架");
dispatch(getCommentList(page));
} else {
message.error("提交失败...");
}
});
};
}
//评论下架
export function checkComment(param, page, callback) {
let params = {};
params.id = param.id;
if (param.isreply) {
return dispatch => {
return request({
url: downRepComment,
data: param,
}).then(res => {
if (res.code === "1000") {
message.success("已下架");
dispatch(getReplyList(param, param.index, callback));
} else {
message.error("提交失败...");
}
});
};
}
return dispatch => {
return request({
url: downComment,
data: param,
}).then(res => {
if (res.code === "1000") {
message.success("已下架");
dispatch(getCommentList(page));
} else {
message.error("提交失败...");
}
});
};
}
//删除
export function tpCommentDel(param, page, callback) {
let params = {};
params.replyId = param.id;
if (param.isreply) {
return dispatch => {
return request({
url: deleteRepComment,
data: param,
}).then(res => {
if (res.code === "1000") {
message.success("已删除");
dispatch(getReplyList(param, param.index, callback));
} else {
message.error("删除失败...");
}
});
};
}
return dispatch => {
return request({
url: deleteComment,
data: param,
}).then(res => {
if (res.code === "1000") {
message.success("已删除");
dispatch(getCommentList(page));
} else {
message.error("删除失败...");
}
});
};
}
...@@ -216,8 +216,6 @@ class Comment extends React.Component { ...@@ -216,8 +216,6 @@ class Comment extends React.Component {
this.setState({ value }); this.setState({ value });
}; };
handleExpand = (expanded, record) => { handleExpand = (expanded, record) => {
// console.log('****&&&&&',expanded, record)
// console.log(123);
this.setState({ Rkey: record.index }); this.setState({ Rkey: record.index });
this.props.getreplylist({ commmentId: record.id }, record.index, () => { this.props.getreplylist({ commmentId: record.id }, record.index, () => {
this.setState({ a: 2 }); this.setState({ a: 2 });
......
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