页面修改

src/components/FreeTravel/FreeHome.vue

 <style>
-.FreeHome{
+  .FreeHome {
     background-color: antiquewhite;
     background: url(../../assets/img/freeHome/bg-banner2.jpg);
     background-size: 100% 100%;
     background-repeat: no-repeat;
     min-height: 1200px;
-}
-.FreeHome>div{
+  }
+
+  .FreeHome>div {
     width: 1200px;
     margin: 0 auto;
-}
-.fh-tit {
+  }
+
+  .fh-tit {
     padding: 100px 30px 50px 30px;
     text-align: center;
-}
-.fh-search-box{
+  }
+
+  .fh-search-box {
     position: relative;
-}
-.fh-search-box .fh-search-box-input{
-  width:725px;
+  }
+
+  .fh-search-box .fh-search-box-input {
+    width: 725px;
     height: 100px;
-  background:rgba(7,109,155,.2);
+    background: rgba(7, 109, 155, .2);
     /* box-shadow:0px 2px 0px 0px rgba(0,76,119,1), 0px 2px 0px 0px rgba(95,181,221,1); */
-  border-radius:4px;
+    border-radius: 4px;
     box-sizing: border-box;
     padding: 26px 25px;
     display: flex;
     margin: 0 auto;
-}
-.fh-search-box .fh-search-box-input div{
+  }
+
+  .fh-search-box .fh-search-box-input div {
     height: 46px;
     display: flex;
     align-items: center;
-  background:rgba(2,111,159,.3);
+    background: rgba(2, 111, 159, .3);
     box-sizing: border-box;
     padding: 0 20px;
-}
-.fh-search-box .fh-search-box-input div:nth-child(1){
+  }
+
+  .fh-search-box .fh-search-box-input div:nth-child(1) {
     flex: 2;
-}
-.fh-search-box .fh-search-box-input div:nth-child(1) input{
+  }
+
+  .fh-search-box .fh-search-box-input div:nth-child(1) input {
     width: 100%;
     border: none;
-  outline:none;
+    outline: none;
     color: white;
     background-color: transparent;
-}
-.fh-search-box .fh-search-box-input div:nth-child(1) input::-webkit-input-placeholder {
+  }
+
+  .fh-search-box .fh-search-box-input div:nth-child(1) input::-webkit-input-placeholder {
     color: white;
-}
-.inputActive{
+  }
+
+  .inputActive {
     width: 675px;
     position: absolute;
     left: 21.9%;
     top: 72px;
     z-index: 3;
     background-color: white;
-}
-.inputActive .el-row .el-col.el-col-6{
+  }
+
+  .inputActive .el-row .el-col.el-col-6 {
     height: 400px;
     overflow: auto;
-}
-.fh-search-box .fh-search-box-input div:nth-child(2){
+  }
+
+  .fh-search-box .fh-search-box-input div:nth-child(2) {
     width: 77px;
     justify-content: center;
-  background:rgba(238,68,84,1);
+    background: rgba(238, 68, 84, 1);
     color: white;
     cursor: pointer;
-}
-.FreeHome .fh-city{
+  }
+
+  .FreeHome .fh-city {
     padding-top: 100px;
     display: flex;
     height: 280px;
-}
-.FreeHome .fh-city .city-s{
+  }
+
+  .FreeHome .fh-city .city-s {
     width: 200px;
     background: url(../../assets/img/freeHome/bg.png);
     background-size: 100% 100%;
@@ -83,27 +96,32 @@
     transition: all linear .5s;
     overflow: hidden;
     height: 280px;
-}
-.city-tag{
+  }
+
+  .city-tag {
     padding: 13px 20px;
     color: #333;
     width: 99%;
     box-sizing: border-box;
     position: relative;
-}
-.city-tag.active{
+  }
+
+  .city-tag.active {
     background-color: #EE4454;
     color: white;
-}
-.city-tag p{
-  font-size:14px;
+  }
+
+  .city-tag p {
+    font-size: 14px;
     margin-bottom: 5px;
-}
-.city-tag div span{
+  }
+
+  .city-tag div span {
     display: inline-block;
     padding: 2px 4px 0 0;
-}
-.triangle-up {
+  }
+
+  .triangle-up {
     position: absolute;
     right: -3px;
     top: 50%;
@@ -116,67 +134,79 @@
     border-right: 5px solid transparent;
     border-bottom: 5px solid white;
     transform: rotate(-90deg);
-}
-.city-list{
+  }
+
+  .city-list {
     display: flex;
     padding: 10px;
-}
-.city-list>span{
+  }
+
+  .city-list>span {
     width: 100px;
-  font-size:14px;
+    font-size: 14px;
     color: #333;
-  font-weight:bold;
+    font-weight: bold;
     flex: 1;
-}
-.city-list>p{
+  }
+
+  .city-list>p {
     color: #888888;
     cursor: pointer;
     font-size: 12px;
     flex: 6;
-}
-.city-list>p span{
+  }
+
+  .city-list>p span {
     display: inline-block;
     padding-right: 20px;
     padding-bottom: 5px;
-}
-.FreeHome .fh-city .city-s>div{
+  }
+
+  .FreeHome .fh-city .city-s>div {
     /* background-image: url(https://image.kkday.com/v2/image/get/w_628%2Ch_472%2Cc_fill%2Cq_55%2Ct_webp/s1.kkday.com/campaign_357/20170808084920_CZBUf/jpg); */
     background-position: 50%;
     background-size: cover;
     height: 280px;
-}
-.FreeHome .fh-city .city-s>div>span,.FreeHome .fh-city .city-m>div>span{
-  font-size:24px;
-  font-family:Microsoft YaHei;
-  font-weight:bold;
-  color:rgba(255,255,255,1);
-  text-shadow:1px 2px 3px rgba(0, 0, 0, 0.45);
+  }
+
+  .FreeHome .fh-city .city-s>div>span,
+  .FreeHome .fh-city .city-m>div>span {
+    font-size: 24px;
+    font-family: Microsoft YaHei;
+    font-weight: bold;
+    color: rgba(255, 255, 255, 1);
+    text-shadow: 1px 2px 3px rgba(0, 0, 0, 0.45);
     position: absolute;
     right: 34px;
     top: 15px;
-}
-.FreeHome .fh-city .city-m{
+  }
+
+  .FreeHome .fh-city .city-m {
     position: relative;
     width: 372px;
     height: 280px;
-  background:linear-gradient(180deg,rgba(0,0,0,0.57),rgba(0,0,0,-0.38));
-  border-radius:6px;
+    background: linear-gradient(180deg, rgba(0, 0, 0, 0.57), rgba(0, 0, 0, -0.38));
+    border-radius: 6px;
     overflow: hidden;
-}
-.FreeHome .fh-city .city-m>img{
+  }
+
+  .FreeHome .fh-city .city-m>img {
     width: 100%;
     height: 100%;
-}
-.FreeHome .fh-city .city-s .city-m-b{
+  }
+
+  .FreeHome .fh-city .city-s .city-m-b {
     position: absolute;
     bottom: -60px;
     color: white;
-}
-.FreeHome .fh-city .city-s .city-m-b span{
+  }
+
+  .FreeHome .fh-city .city-s .city-m-b span {
     border-radius: 2px;
     font-size: 12px;
-}
-.FreeHome .fh-city .city-m .city-m-b{
+  }
+
+  .FreeHome .fh-city .city-m .city-m-b {
     display: flex;
     align-items: center;
     position: absolute;
@@ -186,97 +216,116 @@
     box-sizing: border-box;
     justify-content: space-around;
     cursor: pointer;
-}
-.FreeHome .fh-city .city-m .city-m-b span{
+  }
+
+  .FreeHome .fh-city .city-m .city-m-b span {
     padding: 5px 10px;
     color: white;
-  background:rgba(255,255,255, .3);
+    background: rgba(255, 255, 255, .3);
     margin-right: 16px;
     cursor: pointer;
     transition: all linear .5s;
-}
-.FreeHome .fh-city .city-m .city-m-b span:hover{
-  background:rgba(255,255,255, .6);
-}
-.FreeHome .fh-city .city-m .city-m-b span.active{
-  background:rgba(255,255,255, .6);
-}
-.FreeHome .more-city{
+  }
+
+  .FreeHome .fh-city .city-m .city-m-b span:hover {
+    background: rgba(255, 255, 255, .6);
+  }
+
+  .FreeHome .fh-city .city-m .city-m-b span.active {
+    background: rgba(255, 255, 255, .6);
+  }
+
+  .FreeHome .more-city {
     text-align: center;
     padding-top: 40px;
-}
-.FreeHome .more-city div{
-  width:170px;
-  height:41px;
-  background:rgba(255,255,255,0.1);
-  box-shadow:0px 2px 27px 0px rgba(0,66,96,0.45);
+  }
+
+  .FreeHome .more-city div {
+    width: 170px;
+    height: 41px;
+    background: rgba(255, 255, 255, 0.1);
+    box-shadow: 0px 2px 27px 0px rgba(0, 66, 96, 0.45);
     color: white;
-  line-height:41px;
+    line-height: 41px;
     cursor: pointer;
     transition: all linear .5s;
     margin: 0 auto;
-}
-.FreeHome .more-city div:hover{
-  background:rgba(247,101,109,1);
-}
-.fh-tejia p{
+  }
+
+  .FreeHome .more-city div:hover {
+    background: rgba(247, 101, 109, 1);
+  }
+
+  .fh-tejia p {
     padding: 100px 0 66px 0;
     text-align: center;
-  font-weight:400;
-  color:rgba(51,51,51,1);
-  font-size:30px;
-}
-.fh-tejia{
+    font-weight: 400;
+    color: rgba(51, 51, 51, 1);
+    font-size: 30px;
+  }
+
+  .fh-tejia {
     margin-top: 50px;
-}
-.fh-tejia .icon-item{
+  }
+
+  .fh-tejia .icon-item {
     width: 400px;
     margin: 0 auto;
     display: flex;
     justify-content: space-around;
     align-items: center;
-}
-.fh-tejia .icon-item>div{
+  }
+
+  .fh-tejia .icon-item>div {
     width: 70px;
     height: 70px;
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
-}
-.fh-tejia .icon-item>div>div{
-  width:48px;
-  height:48px;
-  background:rgba(255,255,255, .3);
-  border-radius:50%;
+  }
+
+  .fh-tejia .icon-item>div>div {
+    width: 48px;
+    height: 48px;
+    background: rgba(255, 255, 255, .3);
+    border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
     /* transition: all linear .5s; */
-}
-.fh-tejia .icon-item>div>div.active,.fh-tejia .icon-item>div>div:hover{
-  width:68px;
-  height:68px;
-  background:radial-gradient(circle,rgba(255,133,133,1),rgba(238,68,84,1));
-}
-.fh-tejia .icon-item>div>div.active .iconfont,.fh-tejia .icon-item>div>div:hover .iconfont{
+  }
+
+  .fh-tejia .icon-item>div>div.active,
+  .fh-tejia .icon-item>div>div:hover {
+    width: 68px;
+    height: 68px;
+    background: radial-gradient(circle, rgba(255, 133, 133, 1), rgba(238, 68, 84, 1));
+  }
+
+  .fh-tejia .icon-item>div>div.active .iconfont,
+  .fh-tejia .icon-item>div>div:hover .iconfont {
     color: white;
-}
-.fh-tejia .icon-item .iconfont{
+  }
+
+  .fh-tejia .icon-item .iconfont {
     color: #F86970;
     font-size: 24px;
-}
-.content-item{
+  }
+
+  .content-item {
     height: 380px;
     position: relative;
-}
-.content-item-tit{
+  }
+
+  .content-item-tit {
     padding: 40px 0 20px 0;
-  font-size:20px;
-  font-weight:400;
-}
-.content-item-box .content-item-box-hover{
+    font-size: 20px;
+    font-weight: 400;
+  }
+
+  .content-item-box .content-item-box-hover {
     position: relative;
     width: 100%;
     display: -webkit-box;
@@ -285,158 +334,188 @@
     /* justify-content: space-between; */
     height: 280px;
     padding-bottom: 10px;
-}
-.content-item-box-hover{
+  }
+
+  .content-item-box-hover {
     width: 100%;
-}
-.content-item-box-item{
+  }
+
+  .content-item-box-item {
     width: 280px;
     box-sizing: border-box;
     padding: 8px;
-  background:rgba(255,255,255,1);
-  box-shadow:0px 2px 5px 0px rgba(0, 96, 66, 0.35);
-  border-radius:6px;
+    background: rgba(255, 255, 255, 1);
+    box-shadow: 0px 2px 5px 0px rgba(0, 96, 66, 0.35);
+    border-radius: 6px;
     position: relative;
     cursor: pointer;
     transition: top .5s;
     top: 0px;
     margin-right: 25px;
-}
-.content-item-box-item:hover{
+  }
+
+  .content-item-box-item:hover {
     top: -16px;
-}
-.content-item-box-item .img-box{
+  }
+
+  .content-item-box-item .img-box {
     position: relative;
     height: 183px;
     background-color: #e0e0e0
-}
-.content-item-box-item .img-box img{
+  }
+
+  .content-item-box-item .img-box img {
     width: 100%;
     height: 183px;
-}
-.content-item-box-item .img-box .price{
+  }
+
+  .content-item-box-item .img-box .price {
     position: absolute;
     right: 10px;
     top: 10px;
     padding: 8px;
-  background:rgba(254,241,44,1);
-  border-radius:4px;
-}
-.content-item-box-item .img-box .price .now-p{
-  font-size:12px;
-}
-.content-item-box-item .img-box .price .now-p strong{
-  font-size:14px;
-}
-.content-item-box-item .img-box .price .now-o{
-  font-size:12px;
-  text-decoration:line-through;
-  color:rgba(102,102,102,1);
-}
-.content-item-box-item .img-box .tag{
+    background: rgba(254, 241, 44, 1);
+    border-radius: 4px;
+  }
+
+  .content-item-box-item .img-box .price .now-p {
+    font-size: 12px;
+  }
+
+  .content-item-box-item .img-box .price .now-p strong {
+    font-size: 14px;
+  }
+
+  .content-item-box-item .img-box .price .now-o {
+    font-size: 12px;
+    text-decoration: line-through;
+    color: rgba(102, 102, 102, 1);
+  }
+
+  .content-item-box-item .img-box .tag {
     position: absolute;
     left: 10px;
     bottom: 20px;
-}
-.content-item-box-item .img-box .tag>span{
+  }
+
+  .content-item-box-item .img-box .tag>span {
     padding: 8px;
-  background:rgba(0,0,0, .4); 
-  border-radius:4px;
+    background: rgba(0, 0, 0, .4);
+    border-radius: 4px;
     color: #FFFFFF;
     margin-right: 10px;
-}
-.content-item-box-item .name {
+  }
+
+  .content-item-box-item .name {
     padding-top: 5px;
-  font-size:14px;
-  color:rgba(51,51,51,1);
+    font-size: 14px;
+    color: rgba(51, 51, 51, 1);
     overflow: hidden;
     text-overflow: ellipsis;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
-}
-.content-item-box2{
+  }
+
+  .content-item-box2 {
     position: relative;
-  background:rgba(255,255,255,1);
-  box-shadow:0px 2px 5px 0px rgba(0, 96, 66, 0.35);
-  border-radius:6px;
+    background: rgba(255, 255, 255, 1);
+    box-shadow: 0px 2px 5px 0px rgba(0, 96, 66, 0.35);
+    border-radius: 6px;
     padding: 10px;
     cursor: pointer;
     min-height: 261px;
     box-sizing: border-box;
-}
-.content-item-box2 .img-box{
+  }
+
+  .content-item-box2 .img-box {
     position: relative;
-}
-.content-item-box2 .img-box img:nth-child(1){
+  }
+
+  .content-item-box2 .img-box img:nth-child(1) {
     height: 190px;
     width: 270px;
     margin-right: 10px;
-}
-.content-item-box2 .img-box img:nth-child(2){
+  }
+
+  .content-item-box2 .img-box img:nth-child(2) {
     height: 190px;
     width: 188px;
-}
-.content-item-box2 .img-box span{
+  }
+
+  .content-item-box2 .img-box span {
     position: absolute;
     left: 10px;
     top: 10px;
-  background: rgba(248,104,112,1);
+    background: rgba(248, 104, 112, 1);
     border-radius: 4px;
     color: white;
     padding: 3px 7px;
     font-size: 12px;
-}
-.content-item-box2 .img-box span strong{
+  }
+
+  .content-item-box2 .img-box span strong {
     font-size: 14px;
-}
-.content-item-box2 .content-tit{
+  }
+
+  .content-item-box2 .content-tit {
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding-top: 5px;
-}
-.content-item-box2 .content-tit div:nth-child(1){
+  }
+
+  .content-item-box2 .content-tit div:nth-child(1) {
     overflow: hidden;
     text-overflow: ellipsis;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
-}
-.content-item-box2 .content-tit div:nth-child(2){
-  background:rgba(217,217,217,.5);
-  border-radius:4px;
+  }
+
+  .content-item-box2 .content-tit div:nth-child(2) {
+    background: rgba(217, 217, 217, .5);
+    border-radius: 4px;
     padding: 4px 6px;
     min-width: 90px;
-  font-size:14px;
-}
-.content-item-box2 .img-box2 img:nth-child(1){
+    font-size: 14px;
+  }
+
+  .content-item-box2 .img-box2 img:nth-child(1) {
     height: 190px;
     width: 270px;
     margin-right: 10px;
-}
-.content-item-box2 .img-box2 img:nth-child(2){
+  }
+
+  .content-item-box2 .img-box2 img:nth-child(2) {
     height: 190px;
     width: 188px;
     margin-right: 10px;
-}
-.content-item-box2 .img-box2 img:nth-child(3){
+  }
+
+  .content-item-box2 .img-box2 img:nth-child(3) {
     height: 190px;
     width: 188px;
-}
-.price2{
-  background:#F86870 !important;
-}
-.price3{
-  background:rgba(0,215,133,1) !important;
-}
-.price4{
+  }
+
+  .price2 {
+    background: #F86870 !important;
+  }
+
+  .price3 {
+    background: rgba(0, 215, 133, 1) !important;
+  }
+
+  .price4 {
     background-color: #0DB9F2 !important;
-}
-.content-item:hover ._btn{
+  }
+
+  .content-item:hover ._btn {
     opacity: 1;
-}
-.content-item .left-btn,.content-item .right-btn{
+  }
+
+  .content-item .left-btn,
+  .content-item .right-btn {
     position: absolute;
     left: -56px;
     top: 190px;
@@ -448,114 +527,132 @@
     cursor: pointer;
     opacity: 0;
     transition: all linear .5s;
-}
-.content-item .left-btn:hover{
+  }
+
+  .content-item .left-btn:hover {
     background: url(../../assets/img/freeHome/left_a.png);
     background-size: 100% 100%;
     background-repeat: no-repeat;
-}
-.content-item .right-btn{
+  }
+
+  .content-item .right-btn {
     right: -56px;
     left: initial;
     background: url(../../assets/img/freeHome/right_n.png);
     background-size: 100% 100%;
     background-repeat: no-repeat;
-}
-.content-item .right-btn:hover{
+  }
+
+  .content-item .right-btn:hover {
     background: url(../../assets/img/freeHome/right_a.png);
     background-size: 100% 100%;
     background-repeat: no-repeat;
-}
-.jingxuan{
+  }
+
+  .jingxuan {
     padding-top: 170px;
     padding-bottom: 155px;
-}
-.jingxuan>div{
+  }
+
+  .jingxuan>div {
     position: relative;
     width: 100%;
     height: 700px;
     background-color: white;
     padding-top: 140px;
     box-sizing: border-box;
-  box-shadow:0px 1px 5px 0px rgba(0,66,96,0.22);
-  border-radius:20px;
-}
-.jingxuan>div .tit{
-  width:307px;
-  height:128px;
-  background:rgba(255,255,255,0.1);
-  border:2px solid rgba(221, 204, 182, 1);
-  box-shadow:0px 2px 5px 0px rgba(28,121,133,0.66);
-  border-radius:6px;
+    box-shadow: 0px 1px 5px 0px rgba(0, 66, 96, 0.22);
+    border-radius: 20px;
+  }
+
+  .jingxuan>div .tit {
+    width: 307px;
+    height: 128px;
+    background: rgba(255, 255, 255, 0.1);
+    border: 2px solid rgba(221, 204, 182, 1);
+    box-shadow: 0px 2px 5px 0px rgba(28, 121, 133, 0.66);
+    border-radius: 6px;
     position: absolute;
     left: 445px;
     top: -40px;
     text-align: center;
-}
-.jingxuan>div .tit i{
+  }
+
+  .jingxuan>div .tit i {
     position: absolute;
     top: -30px;
     left: 124px;
-  width:60px;
-  height:60px;
-  background:rgba(255,255,255,1);
-  border-radius:50%;
-  font-size:28px;
-  color:#CAB394;
+    width: 60px;
+    height: 60px;
+    background: rgba(255, 255, 255, 1);
+    border-radius: 50%;
+    font-size: 28px;
+    color: #CAB394;
     line-height: 60px;
-}
-.jingxuan>div .tit p{
+  }
+
+  .jingxuan>div .tit p {
     margin-top: 50px;
-  font-size:28px;
-  color:rgba(68,68,68,1);
-}
-.el-carousel__indicator{
+    font-size: 28px;
+    color: rgba(68, 68, 68, 1);
+  }
+
+  .el-carousel__indicator {
     padding: 0;
     margin: 12px 4px 0 0;
-}
-.el-carousel__indicator.is-active{
+  }
+
+  .el-carousel__indicator.is-active {
     width: 25px;
-  background:rgba(255,147,157,1);
-  border-radius:6px;
-}
-.el-carousel__indicator.is-active .el-carousel__button{
-  background:#EE4454;
+    background: rgba(255, 147, 157, 1);
+    border-radius: 6px;
+  }
+
+  .el-carousel__indicator.is-active .el-carousel__button {
+    background: #EE4454;
     float: right;
-}
-.el-carousel__indicators--outside button{
+  }
+
+  .el-carousel__indicators--outside button {
     opacity: 1;
-}
-.el-carousel__button{
-  width:12px;
-  height:12px;
-  background:#B8B8B8;
-  border-radius:50%;
-}
-
-.jingxuan-item{
+  }
+
+  .el-carousel__button {
+    width: 12px;
+    height: 12px;
+    background: #B8B8B8;
+    border-radius: 50%;
+  }
+
+  .jingxuan-item {
     position: relative;
     background-color: white;
-}
-.jingxuan-item>div{
+  }
+
+  .jingxuan-item>div {
     display: flex;
     justify-content: center;
     flex-wrap: wrap;
-}
-.jingxuan-item .img-item{
+  }
+
+  .jingxuan-item .img-item {
     margin-bottom: 5px;
     position: relative;
     width: 562px;
     height: 406px;
-}
-.jingxuan-item .img-item:nth-child(2n){
+  }
+
+  .jingxuan-item .img-item:nth-child(2n) {
     margin-left: 5px;
-}
-.jingxuan-item .img-item img{
+  }
+
+  .jingxuan-item .img-item img {
     width: 100%;
     height: 100%;
     display: block;
-}
-.jingxuan-item .img-item .info{
+  }
+
+  .jingxuan-item .img-item .info {
     position: absolute;
     left: 0;
     top: 0;
@@ -563,92 +660,111 @@
     height: 100%;
     box-sizing: border-box;
     padding: 50px 30px 0 30px;
-  font-size:14px;
-  color:rgba(51,51,51,1);
-  background:rgba(254,241,44,.8);
+    font-size: 14px;
+    color: rgba(51, 51, 51, 1);
+    background: rgba(254, 241, 44, .8);
     opacity: 0;
     transition: all linear .5s;
-}
-.jingxuan-item .img-item:hover .info{
+  }
+
+  .jingxuan-item .img-item:hover .info {
     opacity: 1;
-}
-.jingxuan-item .jingxuanbg{
+  }
+
+  .jingxuan-item .jingxuanbg {
     position: absolute;
     left: 0;
     top: 0;
     z-index: 1;
-}
-.top-zhezhao{
+  }
+
+  .top-zhezhao {
     position: absolute;
     left: 0;
     top: 0;
     z-index: 2;
     width: 100%;
     height: 100%;
-}
-.top-zhezhao .img-item{
+  }
+
+  .top-zhezhao .img-item {
     width: 253px;
     height: 198px;
-}
-.top-zhezhao .img-item:nth-child(1) .info{
+  }
+
+  .top-zhezhao .img-item:nth-child(1) .info {
     border-top-left-radius: 182px;
     padding-top: 85px;
     width: 255px;
-}
-.top-zhezhao .img-item:nth-child(2) .info{
+  }
+
+  .top-zhezhao .img-item:nth-child(2) .info {
     border-top-right-radius: 233px;
     padding-top: 85px;
     width: 249px;
-}
-.top-zhezhao .img-item:nth-child(3) .info{
+  }
+
+  .top-zhezhao .img-item:nth-child(3) .info {
     border-bottom-left-radius: 170px;
     width: 253px;
     border-bottom-right-radius: 31px;
-}
-.top-zhezhao .img-item:nth-child(4) .info{
+  }
+
+  .top-zhezhao .img-item:nth-child(4) .info {
     border-bottom-right-radius: 181px;
     width: 249px;
     border-bottom-left-radius: 31px;
-}
-.el-carousel__item--card.is-in-stage{
+  }
+
+  .el-carousel__item--card.is-in-stage {
     opacity: .5;
-}
-.el-carousel__item--card.is-active{
+  }
+
+  .el-carousel__item--card.is-active {
     opacity: 1;
-}
-.jingxuan-tit{
+  }
+
+  .jingxuan-tit {
     padding: 20px;
     text-align: center;
-}
-.jinxuan-time{
+  }
+
+  .jinxuan-time {
     position: absolute;
     right: 20px;
     top: 8px;
     color: #BABABA;
     z-index: 3
-}
-.jinxuan-time .text{
+  }
+
+  .jinxuan-time .text {
     font-size: 16px;
-}
-.jinxuan-time .number{
+  }
+
+  .jinxuan-time .number {
     font-size: 28px;
-}
-.jinxuan-time .number2{
+  }
+
+  .jinxuan-time .number2 {
     font-size: 36px;
-}
-.FreeHome .el-carousel__indicator.is-active button{
-  width: 12px;;
-}
-.loading-box{
-  min-height:400px
-}
-.FreeHome .el-select-dropdown__item{
+  }
+
+  .FreeHome .el-carousel__indicator.is-active button {
+    width: 12px;
+    ;
+  }
+
+  .loading-box {
+    min-height: 400px
+  }
+
+  .FreeHome .el-select-dropdown__item {
     white-space: initial;
-}
+  }
 </style>
 <template>
   <div v-loading="loading" class="commonF">
-    <div class="FreeHome " @click="inputActive = false" >
+    <div class="FreeHome " @click="inputActive = false">
       <div>
         <div class="fh-tit">
           <img :onerror="defaultImg" src="../../assets/img/freeHome/top-tex.png" alt="">
@@ -656,28 +772,19 @@
         <div class="fh-search-box">
           <div class="fh-search-box-input">
             <div>
-            <el-select
-                v-model="changeId"
-                filterable
-                remote
-                reserve-keyword
-                placeholder="输入目的地/景点/关键字，搜索您需要的信息.."
-                :remote-method="searchKey"
-                @focus="inputActive = true, changeId = '', queryStr = '', searchList = []"
-                @change='getSelect'
-                :loading="loading2">
-                <el-option
-                    v-for="item in searchList"
-                    :key="item.prod_no"
-                    :label="item.prod_name"
-                    :value="item">
+              <el-select v-model="changeId" filterable remote reserve-keyword placeholder="输入目的地/景点/关键字，搜索您需要的信息.."
+                :remote-method="searchKey" @focus="inputActive = true, changeId = '', queryStr = '', searchList = []"
+                @change='getSelect' :loading="loading2">
+                <el-option v-for="item in searchList" :key="item.prod_no" :label="item.prod_name" :value="item">
                   <div v-if="item.type == 2 || item.type == 1">
                     <i style="padding-right: 15px" class="iconfont icon-lvseqizi"></i>
                     <span class="PingFangR">{{ item.prod_name}}</span>
                   </div>
                   <div v-else>
-                      <span style="float: left; width: 370px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">{{ item.prod_name}}</span>&nbsp;&nbsp;
-                      <span v-if="item.countries && item.countries.length > 0" style="float: right">{{ item.countries[0].name }}&nbsp;&nbsp;{{item.countries[0].cities[0].name}}</span>
+                    <span
+                      style="float: left; width: 370px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">{{ item.prod_name}}</span>&nbsp;&nbsp;
+                    <span v-if="item.countries && item.countries.length > 0"
+                      style="float: right">{{ item.countries[0].name }}&nbsp;&nbsp;{{item.countries[0].cities[0].name}}</span>
                     <i style="float: right;color: rgb(204, 204, 204)" class="iconfont icon-ico_dingwei"></i>
                   </div>
                 </el-option>
@@ -691,8 +798,9 @@
           <div v-show="inputActive && queryStr == '' && searchList.length < 1" class="inputActive" @click.stop>
             <el-row v-if="CCList.length>0 ">
               <el-col :span="6">
-              <div class="city-tag __cp" v-for="(item, index) in CCList" @click="CCListActive = index" :class="{'active': CCListActive == index}" :key="index" >
-                <p >{{item.Country_Name}}</p>
+                <div class="city-tag __cp" v-for="(item, index) in CCList" @click="CCListActive = index"
+                  :class="{'active': CCListActive == index}" :key="index">
+                  <p>{{item.Country_Name}}</p>
                   <div class="f12 text2">
                     <span v-for="(s, sIndex) in item.Cities" :key="sIndex">{{s.City_Name}}</span>
                   </div>
@@ -701,17 +809,20 @@
               </el-col>
               <el-col :span="18">
                 <div class="city-list">
-                <span class="PingFangR __cp" @click="goListPage(1, CCList[CCListActive].Country_Code, CCList[CCListActive].Country_Name)">{{CCList[CCListActive].Country_Name}}</span>
+                  <span class="PingFangR __cp"
+                    @click="goListPage(1, CCList[CCListActive].Country_Code, CCList[CCListActive].Country_Name)">{{CCList[CCListActive].Country_Name}}</span>
                   <p>
-                  <span @click="goListPage(2, item.City_Code, item.City_Name, index)" class="f14 __cp" v-for="(item, index) in CCList[CCListActive].Cities" :key="index">{{item.City_Name}}</span>
+                    <span @click="goListPage(2, item.City_Code, item.City_Name, index)" class="f14 __cp"
+                      v-for="(item, index) in CCList[CCListActive].Cities" :key="index">{{item.City_Name}}</span>
                   </p>
                 </div>
               </el-col>
             </el-row>
           </div>
         </div>
-      <div class="fh-city" >
-        <div class="city-s" v-for="(item, index) in topCityList" :class="{'city-m': topCityActive == index}" @mouseenter="topCityActive = index" :key="index">
+        <div class="fh-city">
+          <div class="city-s" v-for="(item, index) in topCityList" :class="{'city-m': topCityActive == index}"
+            @mouseenter="topCityActive = index" :key="index">
             <div :style="`background-image: url(${item.src})`">
               <span>{{item.name}}</span>
               <div class="city-m-b">
@@ -761,14 +872,17 @@
             <p class="content-item-tit">餐食就在这里解决吧~</p>
             <div class="content-item-box">
               <div class="content-item-box-hover" ref="meals">
-              <div class="content-item-box-item" v-for="(item, index) in list1" @click="goDetails(item)" >
+                <div class="content-item-box-item" v-for="(item, index) in list1" @click="goDetails(item)">
                   <div class="img-box">
                     <div class="price price3">
-                    <p class="now-p">￥<strong class="PingFangR">{{isLogin == 1 ? item.reborn_price : item.b2c_price}}</strong>/人</p>
+                      <p class="now-p">￥<strong
+                          class="PingFangR">{{isLogin == 1 ? item.reborn_price : item.b2c_price}}</strong>/人</p>
                     </div>
                     <img :onerror="defaultImg" :src="item.prod_img_url" alt="">
                     <div class="tag">
-                    <span><i class="iconfont icon-mudedi"></i>  <span  class="PingFangR">{{item.countries[0].name + '-' + item.countries[0].cities[0].name}}</span> </span>
+                      <span><i class="iconfont icon-mudedi"></i> <span
+                          class="PingFangR">{{item.countries[0].name + '-' + item.countries[0].cities[0].name}}</span>
+                      </span>
                     </div>
                   </div>
                   <div class="name" :title="item.introduction.replace(/KKday/g, '印象之旅')">
@@ -788,14 +902,16 @@
             <p class="content-item-tit">放轻松，甩手一日游~</p>
             <div class="content-item-box">
               <div class="content-item-box-hover" ref="yiriyou">
-              <div class="content-item-box-item" v-for="(item, index) in list2" @click="goDetails(item)" >
+                <div class="content-item-box-item" v-for="(item, index) in list2" @click="goDetails(item)">
                   <div class="img-box">
                     <div class="price price2">
                       <p class="now-p">￥<strong>{{isLogin == 1 ? item.reborn_price : item.b2c_price}}</strong>/人</p>
                     </div>
                     <img :onerror="defaultImg" :src="item.prod_img_url" alt="">
                     <div class="tag">
-                    <span><i class="iconfont icon-mudedi"></i> <span  class="PingFangR">{{item.countries[0].name + '-' + item.countries[0].cities[0].name}}</span> </span>
+                      <span><i class="iconfont icon-mudedi"></i> <span
+                          class="PingFangR">{{item.countries[0].name + '-' + item.countries[0].cities[0].name}}</span>
+                      </span>
                     </div>
                   </div>
                   <div class="name" :title="item.introduction.replace(/KKday/g, '印象之旅')">
@@ -815,14 +931,16 @@
             <p class="content-item-tit">车程快慢，你来定~</p>
             <div class="content-item-box">
               <div class="content-item-box-hover" ref="cheliang">
-              <div class="content-item-box-item" v-for="(item, index) in list3" @click="goDetails(item)" >
+                <div class="content-item-box-item" v-for="(item, index) in list3" @click="goDetails(item)">
                   <div class="img-box">
                     <div class="price">
                       <p class="now-p">￥<strong>{{isLogin == 1 ? item.reborn_price : item.b2c_price}}</strong>/人</p>
                     </div>
                     <img :onerror="defaultImg" :src="item.prod_img_url" alt="">
                     <div class="tag">
-                    <span class="PingFangR"><i class="iconfont icon-mudedi"></i>  <span  class="PingFangR">{{item.countries[0].name + '-' + item.countries[0].cities[0].name}}</span> </span>
+                      <span class="PingFangR"><i class="iconfont icon-mudedi"></i> <span
+                          class="PingFangR">{{item.countries[0].name + '-' + item.countries[0].cities[0].name}}</span>
+                      </span>
                     </div>
                   </div>
                   <div class="name" :title="item.introduction.replace(/KKday/g, '印象之旅')">
@@ -842,14 +960,16 @@
             <p class="content-item-tit">游玩门票，看过来~</p>
             <div class="content-item-box">
               <div class="content-item-box-hover" ref="menpiao">
-              <div class="content-item-box-item" v-for="(item, index) in menPiaoList" @click="goDetails(item)" >
+                <div class="content-item-box-item" v-for="(item, index) in menPiaoList" @click="goDetails(item)">
                   <div class="img-box">
                     <div class="price price4">
                       <p class="now-p">￥<strong>{{isLogin == 1 ? item.reborn_price : item.b2c_price}}</strong>/人</p>
                     </div>
                     <img :onerror="defaultImg" :src="item.prod_img_url" alt="">
                     <div class="tag">
-                    <span class="PingFangR"><i class="iconfont icon-mudedi"></i>  <span  class="PingFangR">{{item.countries[0].name + '-' + item.countries[0].cities[0].name}}</span> </span>
+                      <span class="PingFangR"><i class="iconfont icon-mudedi"></i> <span
+                          class="PingFangR">{{item.countries[0].name + '-' + item.countries[0].cities[0].name}}</span>
+                      </span>
                     </div>
                   </div>
                   <div class="name" :title="item.introduction.replace(/KKday/g, '印象之旅')">
@@ -877,7 +997,9 @@
                       <img :onerror="defaultImg" src="../../assets/img/freeHome/jingxuanbg.png" alt="">
                     </div>
                     <div class="jinxuan-time" v-if="item.sale_dates.saleDt">
-                    <span class="number">{{getMonth(item.sale_dates.saleDt[0].sale_day)}}</span><span class="text"> 月</span><span class="number number2"> {{getDay(item.sale_dates.saleDt[0].sale_day)}}</span><span class="text"> 日</span>
+                      <span class="number">{{getMonth(item.sale_dates.saleDt[0].sale_day)}}</span><span class="text">
+                        月</span><span class="number number2"> {{getDay(item.sale_dates.saleDt[0].sale_day)}}</span><span
+                        class="text"> 日</span>
                     </div>
                   </div>
                   <p class="jingxuan-tit">{{item.pkgs[0].pkg_name.replace(/KKday/g, '印象之旅')}}</p>
@@ -892,8 +1014,8 @@
   </div>
 </template>
 <script>
-export default {
-  data () {
+  export default {
+    data() {
       return {
         changeId: "",
         queryStr: "",
@@ -902,13 +1024,13 @@ export default {
         loading2: false,
         loading: false,
         scrollobj: null,
-      navs:[
+        navs: [
           'meals',
           'yiriyou',
           'cheliang',
           'menpiao',
         ],
-      blankUrl:'',
+        blankUrl: '',
         inputActive: false,
         activeId: 'meals',
         dataList: [],
@@ -924,23 +1046,23 @@ export default {
           src: "http://staticfile.oytour.com/New/Upload/Cloud/2019-08/20190821052335633.jpg",
           id: 1,
           number: "A01-003-00001"
-       },{
+        }, {
           name: '京都',
           src: "http://staticfile.oytour.com/New/Upload/Cloud/2019-08/20190821052335636.jpg",
           id: 2,
           number: "A01-003-00003",
-       },{
+        }, {
           name: '大阪',
           src: "http://staticfile.oytour.com/New/Upload/Cloud/2019-08/20190821052335628.jpg",
           id: 3,
           number: "A01-003-00002"
 
-       },{
+        }, {
           name: '首尔',
           src: "http://staticfile.oytour.com/New/Upload/Cloud/2019-08/20190821052335683.jpg",
           id: 0,
           number: 'A01-004-00001'
-       },{
+        }, {
           name: '曼谷',
           src: "http://staticfile.oytour.com/New/Upload/Cloud/2019-08/20190821052335631.jpg",
           id: 4,
@@ -949,7 +1071,7 @@ export default {
         KkdayDomain: "",
         CCList: [],
         defaultImg: 'this.src="' + require('assets/img/juan/error.png') + '"',
-      isLogin:1,
+        isLogin: 1,
       }
     },
     mounted() {
@@ -960,8 +1082,8 @@ export default {
         let uid = str.split("uid=")[1];
         sessionStorage.setItem("OpenB2BCode", decodeURIComponent(uid));
       }
-    this.isLogin=this.$store.state.isLogin;
-    this.scrollobj=document.getElementsByClassName('el-scrollbar__wrap')[0];
+      this.isLogin = this.$store.state.isLogin;
+      this.scrollobj = document.getElementsByClassName('el-scrollbar__wrap')[0];
       this.scrollobj.addEventListener('scroll', this.handleScroll);
       this.getDataList()
       this.getDataCanList()
@@ -969,23 +1091,24 @@ export default {
       this.getCheList()
     },
     methods: {
-    getSelect(e){
+      getSelect(e) {
         if (e.prod_no && (e.type == 2 || e.type == 1)) {
           let dom = document.querySelector("#blankLink");
           let num = e.type == 2 ? '2' : '';
-        let fullPath = `/FreeList${num}?id=${e.prod_no}&name=${e.prod_name}&CCListActive=${this.CCListActive}&type=${e.type}`;
-        dom.href=`http://${window.location.host}/#${fullPath}`
+          let fullPath =
+            `/FreeList${num}?id=${e.prod_no}&name=${e.prod_name}&CCListActive=${this.CCListActive}&type=${e.type}`;
+          dom.href = `http://${window.location.host}/#${fullPath}`
           dom.click()
-      } else if (e.prod_no && !e.type){
+        } else if (e.prod_no && !e.type) {
           this.goDetails(e)
         }
         this.changeId = ''
         this.queryStr = ''
         this.searchList = []
       },
-    getIndex(query){
+      getIndex(query) {
         let ok = false
-      for(let i = 0; i < this.CCList.length; i++){
+        for (let i = 0; i < this.CCList.length; i++) {
           if (ok) break;
           let ff = this.CCList[i]
           if (ff.Country_Name == query) {
@@ -993,7 +1116,7 @@ export default {
             ok = true
             break;
           }
-          for(let y = 0; y < ff.Cities.length; y++){
+          for (let y = 0; y < ff.Cities.length; y++) {
             let cc = ff.Cities[y]
             if (cc.City_Name == query) {
               this.CCListActive = i
@@ -1003,11 +1126,11 @@ export default {
           }
         }
       },
-    searchKey(query){
+      searchKey(query) {
         this.queryStr2 = query
         if (query !== '') {
           let ct = null
-        for(let i = 0; i < this.CCList.length; i++){
+          for (let i = 0; i < this.CCList.length; i++) {
             let ff = this.CCList[i]
             if (ff.Country_Name == query) {
               this.CCListActive = i
@@ -1018,7 +1141,7 @@ export default {
               }
               break
             }
-          for(let y = 0; y < ff.Cities.length; y++){
+            for (let y = 0; y < ff.Cities.length; y++) {
               let cc = ff.Cities[y]
               if (cc.City_Name == query) {
                 this.CCListActive = i
@@ -1035,10 +1158,9 @@ export default {
           this.queryStr = query
           this.loading2 = true;
           this.apiJavaPost(
-          "/api/kkday/commodityList",
-          {
+            "/api/kkday/commodityList", {
               "locale": "zh-cn",
-            "state": "CN" ,
+              "state": "CN",
               "sort": "PASC",
               "keywords": query,
               "page_size": 5,
@@ -1046,18 +1168,17 @@ export default {
             res => {
               if (res.data.resultCode === 1) {
                 let data = res.data.data.prods;
-              // let no1 = data.length > 0 ? data[0].countries : ''
                 this.loading2 = false;
-              if (!ct){
-                let cc = null, tt = null;
-                for(let i = 0; i < data.length; i++){
+                if (!ct) {
+                  let cc = null,
+                    tt = null;
+                  for (let i = 0; i < data.length; i++) {
                     if (cc && tt) break;
                     cc = data[i].countries[0];
-                  if (data[i].countries[0].cities[0].name !== '所有城市'){
+                    if (data[i].countries[0].cities[0].name !== '所有城市') {
                       tt = data[i].countries[0].cities[0];
                     }
                   }
-  
                   let obj = {
                     type: cc && tt ? 2 : 1,
                     prod_name: cc && tt ? tt.name : cc.name,
@@ -1066,7 +1187,7 @@ export default {
                   let name = cc && tt ? tt.name : cc.name
                   this.getIndex(name)
                   data.unshift(obj)
-              } else if (ct){
+                } else if (ct) {
                   let obj = {
                     type: ct.type,
                     prod_name: ct.name,
@@ -1094,7 +1215,7 @@ export default {
           this.$refs[dom].scrollLeft = this.$refs[dom].scrollLeft + 300
         }
       },
-    goList2(obj, type){
+      goList2(obj, type) {
         this.$router.push({
           name: "FreeList2",
           query: {
@@ -1106,7 +1227,7 @@ export default {
           }
         });
       },
-    goListPage(type, id, name, index){
+      goListPage(type, id, name, index) {
         this.inputActive = false;
         let url = type == 1 ? "FreeList" : "FreeList2"
         this.$router.push({
@@ -1119,28 +1240,31 @@ export default {
           }
         });
       },
-    getMonth(str){
+      getMonth(str) {
         return str.substring(4, 6)
       },
-    getDay(str){
+      getDay(str) {
         return str.substring(6, 10)
       },
       //获取国家  城市
-    getCCList(){
+      getCCList() {
         //http://efficient.oytour.com/api/kkday/searchCity
         this.apiJavaPost(
-        "/api/kkday/searchCity",
-        {},
+          "/api/kkday/searchCity", {},
           res => {
             if (res.data.resultCode === 1) {
               let data = res.data.data.Countries
               let deleteIdiot = []
-            data = data.length > 0 ? data : []
-            data.map(x=>{
-              if(x.Country_Name !== "台湾" && x.Country_Name !== "香港" && x.Country_Name !== "澳门" && x.Country_Name !== "港澳") {
+
+              if (data && data.length > 0) {
+                data.map(x => {
+                  if (x.Country_Name !== "台湾" && x.Country_Name !== "香港" && x.Country_Name !== "澳门" && x
+                    .Country_Name !== "港澳") {
                     deleteIdiot.push(x)
                   }
                 })
+              }
+
               this.CCList = deleteIdiot
             } else {
               this.Error(res.data.message);
@@ -1149,10 +1273,10 @@ export default {
           null
         );
       },
-    goDetails(obj, type){
+      goDetails(obj, type) {
         let dom = document.querySelector("#blankLink")
         let fullPath = `/FreeDetail?id=${type ? obj.pkg_no : obj.prod_no}`;
-      dom.href=`http://${window.location.host}/#${fullPath}`
+        dom.href = `http://${window.location.host}/#${fullPath}`
 
         dom.click()
         return
@@ -1164,22 +1288,21 @@ export default {
           }
         });
       },
-    goList(){
-      if(this.queryStr2 == '') return
+      goList() {
+        if (this.queryStr2 == '') return
 
         let dom = document.querySelector("#blankLink")
         let fullPath = `/FreeList2?keywords=${this.queryStr2}`;
-      dom.href=`http://${window.location.host}/#${fullPath}`
+        dom.href = `http://${window.location.host}/#${fullPath}`
 
         dom.click()
         this.queryStr2 = ""
       },
-    getDataCanList(){
+      getDataCanList() {
         this.apiJavaPost(
-        "/api/kkday/commodityList",
-       {
+          "/api/kkday/commodityList", {
             "locale": "zh-cn",
-        "state":"CN" ,
+            "state": "CN",
             "cat_main_keys": [
               "TAG_3"
             ],
@@ -1190,9 +1313,12 @@ export default {
           },
           res => {
             if (res.data.resultCode === 1) {
-            let data = res.data.data.prods,list1 = [];
-            data.map((x, index)=>{
-              if (x.countries[0].name.indexOf('台湾') !== -1 || x.countries[0].name.indexOf('台灣') !== -1 || x.countries[0].name.indexOf('香港') !== -1 || x.countries[0].name.indexOf('澳門') !== -1 || x.countries[0].name.indexOf('澳门') !== -1){
+              let data = res.data.data.prods,
+                list1 = [];
+              data.map((x, index) => {
+                if (x.countries[0].name.indexOf('台湾') !== -1 || x.countries[0].name.indexOf('台灣') !== -1 || x
+                  .countries[0].name.indexOf('香港') !== -1 || x.countries[0].name.indexOf('澳門') !== -1 || x
+                  .countries[0].name.indexOf('澳门') !== -1) {
                   x.countries[0].name = `中国-${x.countries[0].name}`
                 }
               })
@@ -1204,14 +1330,13 @@ export default {
           null
         );
       },
-    getCheList(){
+      getCheList() {
         // http://efficient.oytour.com/api/kkday/commodityList
         this.loading = true
         this.apiJavaPost(
-        "/api/kkday/commodityList",
-        {
+          "/api/kkday/commodityList", {
             "locale": "zh-cn",
-          "state": "CN" ,
+            "state": "CN",
             "cat_main_keys": [
               "TAG_5"
             ],
@@ -1220,9 +1345,12 @@ export default {
           },
           res => {
             if (res.data.resultCode === 1) {
-            let data = res.data.data.prods, list = [];
-            data.map(x=>{
-              if (x.countries[0].name.indexOf('台湾') !== -1 || x.countries[0].name.indexOf('台灣') !== -1 || x.countries[0].name.indexOf('香港') !== -1 || x.countries[0].name.indexOf('澳門') !== -1 || x.countries[0].name.indexOf('澳门') !== -1){
+              let data = res.data.data.prods,
+                list = [];
+              data.map(x => {
+                if (x.countries[0].name.indexOf('台湾') !== -1 || x.countries[0].name.indexOf('台灣') !== -1 || x
+                  .countries[0].name.indexOf('香港') !== -1 || x.countries[0].name.indexOf('澳門') !== -1 || x
+                  .countries[0].name.indexOf('澳门') !== -1) {
                   x.countries[0].name = `中国-${x.countries[0].name}`
                 }
                 list.push(x)
@@ -1236,14 +1364,13 @@ export default {
           null
         );
       },
-    getDataList(){
+      getDataList() {
         // http://efficient.oytour.com/api/kkday/commodityList
         this.loading = true
         this.apiJavaPost(
-        "/api/kkday/commodityList",
-        {
+          "/api/kkday/commodityList", {
             "locale": "zh-cn",
-          "state": "CN" ,
+            "state": "CN",
             "cat_keys": [
               "TAG_1_3"
             ],
@@ -1252,7 +1379,11 @@ export default {
           },
           res => {
             if (res.data.resultCode === 1) {
-            let data = res.data.data.prods,menPiaoList = [], list1 = [], list2 = [], TaoCanIds = [];
+              let data = res.data.data.prods,
+                menPiaoList = [],
+                list1 = [],
+                list2 = [],
+                TaoCanIds = [];
               this.KkdayDomain = res.data.data.KkdayDomain;
               // M01 一日遊
               // M02 多日遊
@@ -1262,8 +1393,10 @@ export default {
               // M06 半日遊
               // M07 私人導遊
               // M08 點對點接送
-            data.map((x, index)=>{
-              if (x.countries[0].name.indexOf('台湾') !== -1 || x.countries[0].name.indexOf('台灣') !== -1 || x.countries[0].name.indexOf('香港') !== -1 || x.countries[0].name.indexOf('澳門') !== -1 || x.countries[0].name.indexOf('澳门') !== -1){
+              data.map((x, index) => {
+                if (x.countries[0].name.indexOf('台湾') !== -1 || x.countries[0].name.indexOf('台灣') !== -1 || x
+                  .countries[0].name.indexOf('香港') !== -1 || x.countries[0].name.indexOf('澳門') !== -1 || x
+                  .countries[0].name.indexOf('澳门') !== -1) {
                   x.countries[0].name = `中国-${x.countries[0].name}`
                 }
                 if (x.prod_type == 'M05') { // M05 票券
@@ -1278,7 +1411,8 @@ export default {
                     })
                   }
                   list2.push(x)
-              } else if (x.prod_type == 'M04' || x.prod_type == 'M08' || x.prod_type == 'M03') { // M04 司機/交通 M03 機場接送 M08 點對點接送
+                } else if (x.prod_type == 'M04' || x.prod_type == 'M08' || x.prod_type ==
+                  'M03') { // M04 司機/交通 M03 機場接送 M08 點對點接送
 
                 }
               })
@@ -1295,22 +1429,21 @@ export default {
           null
         );
       },
-    getTaocanList(TaoCanIds){
+      getTaocanList(TaoCanIds) {
         let list = '';
-      for(let i = 0; i < TaoCanIds.length; i ++) {
-        list = list + TaoCanIds[i].num + (i == TaoCanIds.length -1 ? '' : ',') 
+        for (let i = 0; i < TaoCanIds.length; i++) {
+          list = list + TaoCanIds[i].num + (i == TaoCanIds.length - 1 ? '' : ',')
         }
         //http://efficient.oytour.com/api/kkday/QueryPackageList
         this.apiJavaPost(
-        "/api/kkday/QueryPackageList",
-        {
+          "/api/kkday/QueryPackageList", {
             "prodNums": list,
           },
           res => {
             if (res.data.resultCode === 1) {
               let data = res.data.data
 
-            for(let i = 0; i < data.length ; i ++){
+              for (let i = 0; i < data.length; i++) {
                 data[i].url = TaoCanIds[i].url
               }
               this.TaoCanList = data
@@ -1321,22 +1454,22 @@ export default {
           null
         );
       },
-    handleScroll(){
+      handleScroll() {
         try {
-        let current=''
-        this.navs.forEach(x=>{
-          let t=document.getElementById(x).offsetTop
-          if(t<=this.scrollobj.scrollTop-200){
-              current=x
+          let current = ''
+          this.navs.forEach(x => {
+            let t = document.getElementById(x).offsetTop
+            if (t <= this.scrollobj.scrollTop - 200) {
+              current = x
             }
           })
-        this.crtnav=current
+          this.crtnav = current
         } catch (error) {}
       },
-    goScroll(id){
+      goScroll(id) {
         this.activeId = id;
-      this.scrollobj.scrollTop=document.getElementById(id).offsetTop;
+        this.scrollobj.scrollTop = document.getElementById(id).offsetTop;
       },
     }
-}
+  }
 </script>
\ No newline at end of file