提交app 订阅修改

src/jfw/modules/app/src/app/front/vipsubscribe.go

@@ -27,9 +27,7 @@ type Subscribepay struct {
 
 	//修改
 	toEditSubPage       xweb.Mapper `xweb:"/jyapp/vipsubscribe/toEditSubPage"`       //订阅收费修改页面
-	toEditSubProvPage   xweb.Mapper `xweb:"/jyapp/vipsubscribe/toEditSubProvPage"`   //订阅收费修改省份
-	toEditSubAllArea    xweb.Mapper `xweb:"/jyapp/vipsubscribe/toEditSubAllArea"`    //订阅收费全国修改
-	toEditSubCityPage   xweb.Mapper `xweb:"/jyapp/vipsubscribe/toEditSubCityPage"`   //订阅收费修改城市
+	toEditSubAreaPage   xweb.Mapper `xweb:"/jyapp/vipsubscribe/toEditSubAreaPage"`   //订阅收费修改地区
 	toEditSubInduPage   xweb.Mapper `xweb:"/jyapp/vipsubscribe/toEditSubInduPage"`   //订阅收费修改行业
 	submitEditSubFinish xweb.Mapper `xweb:"/jyapp/vipsubscribe/submitEditSubFinish"` //订阅收费修改成功
 
@@ -153,19 +151,9 @@ func (s *Subscribepay) ToEditSubPage() {
 	s.Render("/vipsubscribe/edit_subscribe.html")
 }
 
-//修改订阅省份
-func (s *Subscribepay) ToEditSubProvPage() {
-	s.Render("/vipsubscribe/edit_subscribe_province.html")
-}
-
-//修改订阅城市
-func (s *Subscribepay) ToEditSubCityPage() {
-	s.Render("/vipsubscribe/edit_subscribe_city.html")
-}
-
-//购买全国修改
-func (s *Subscribepay) ToEditSubAllArea() {
-	s.Render("/vipsubscribe/edit_subscribe_allArea.html")
+//合并后修改地区
+func (s *Subscribepay) ToEditSubAreaPage() {
+	s.Render("/vipsubscribe/edit_city_new.html")
 }
 
 //修改订阅行业

src/jfw/modules/app/src/web/staticres/jyapp/vipsubscribe/css/choose_area_new.css

@@ -0,0 +1,609 @@
+@charset "UTF-8";
+.main {
+  width: 100%;
+  overflow: scroll;
+}
+
+.main::-webkit-scrollbar {
+  display: none;
+}
+
+.layout_top-bottom {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  height: 100%;
+}
+
+.layout_top-bottom .layou_top {
+  flex: 1;
+  overflow: scroll;
+}
+
+.bottom_button {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  width: 100%;
+  height: .94rem;
+}
+
+.bottom_button .left_btn,
+.bottom_button .right_btn {
+  flex: 1;
+  height: 100%;
+  font-size: .34rem;
+}
+
+.bottom_button .left_btn {
+  color: #2cb7ca;
+  background-color: #fff;
+  border-top: 1px solid #e0e0e0;
+}
+
+.bottom_button .right_btn {
+  color: #fff;
+  background-color: #2cb7ca;
+  border-top: 1px solid #2cb7ca;
+}
+
+.bottom_button button[disabled] {
+  opacity: .5;
+}
+
+.public_btn {
+  width: 100%;
+  height: .94rem;
+  line-height: .94rem;
+  text-align: center;
+  background: #2CB7CA;
+  color: #fff;
+  border-radius: 0.06rem;
+  font-size: .34rem;
+}
+
+.tips_btn {
+  display: flex;
+  position: relative;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.tips_btn .tips_discount {
+  width: 100%;
+}
+
+.tips_btn .tips_discount .tips_d_money {
+  display: none;
+  position: absolute;
+  left: 50%;
+  top: -.2rem;
+  padding: 0 .4rem;
+  height: .64rem;
+  line-height: .64rem;
+  color: #2CB7CA;
+  font-size: .32rem;
+  background-color: #fff;
+  border-radius: .32rem;
+  transform: translate(-50%, -100%);
+  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
+}
+
+.tips_btn .tips_discount .tips_d_text {
+  display: none;
+  height: .72rem;
+  line-height: .72rem;
+  color: #fff;
+  font-size: .28rem;
+  text-align: center;
+  background-color: #FFB901;
+}
+
+.tips_btn .btns {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  height: .94rem;
+  line-height: .94rem;
+  color: #fff;
+  font-size: .34rem;
+}
+
+.tips_btn .btns .save-btn,
+.tips_btn .btns .reset-btn {
+  flex: 1;
+  width: 50%;
+  text-align: center;
+  height: 100%;
+  font-size: .34rem;
+}
+
+.tips_btn .btns .reset-btn {
+  background: #fff;
+  color: #2cb7ca;
+  border-top: 1px solid #e0e0e0;
+}
+
+.tips_btn .btns .save-btn {
+  background: #2cb7ca;
+  color: #fff;
+  border-top: 1px solid #2cb7ca;
+}
+
+.tips_btn .btns button[disabled] {
+  opacity: .5;
+}
+
+.jy_icon {
+  position: relative;
+  width: 100%;
+  height: 100%;
+}
+
+.jy_icon.decrease:before,
+.jy_icon.increase:before,
+.jy_icon.increase:after {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  content: '';
+  width: 0.4rem;
+  height: 0.04rem;
+  background-color: #686868;
+  transform: translate(-50%, -50%);
+}
+
+.jy_icon.increase:after {
+  transform: translate(-50%, -50%) rotate(90deg);
+}
+
+/*禁止长按复制 加给body*/
+.no-touch {
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+/* 弹性盒子布局 */
+.flex_alginC {
+  display: flex;
+  align-items: center;
+}
+
+.flex_alginC_justB {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.flex_alginC_justC {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.flex_column {
+  display: flex;
+  flex-direction: column;
+}
+
+.flex_column_alignC {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+/* 自定义弹窗*/
+@-webkit-keyframes c {
+  0% {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes c {
+  0% {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+.custom-dialog .weui-animate-fade-in {
+  -webkit-animation: c ease 0s forwards;
+  animation: c ease 0s forwards;
+}
+
+@-webkit-keyframes d {
+  0% {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}
+
+@keyframes d {
+  0% {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}
+
+.custom-dialog .weui-animate-fade-out {
+  -webkit-animation: d ease 0s forwards;
+  animation: d ease 0s forwards;
+}
+
+.custom-dialog .weui-dialog__hd {
+  background: #F5F4F9;
+  padding: .17rem 0;
+  color: #000;
+  font-size: .34rem;
+  text-align: center;
+}
+
+.custom-dialog .weui-dialog__bd {
+  padding: .37rem 0;
+  color: #1D1D1D;
+  font-size: .32rem;
+  text-align: center;
+}
+
+.custom-dialog .weui-dialog__ft:after {
+  border: 0;
+}
+
+.custom-dialog .weui-dialog__btn:after {
+  border: 0;
+}
+
+.custom-dialog .weui-dialog__ft {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding-bottom: .38rem;
+  box-sizing: border-box;
+  text-align: center;
+}
+
+.custom-dialog .weui-dialog__btn {
+  display: block;
+  width: 1.72rem;
+  height: .72rem;
+  line-height: .72rem;
+  color: #fff;
+  padding: 0;
+  flex: none;
+  text-align: center;
+  border-radius: 3px;
+}
+
+.custom-dialog .weui-dialog__btn_primary {
+  background-color: #2CB7CA;
+  margin-right: 1rem;
+}
+
+.custom-dialog .weui-dialog__btn_default {
+  background-color: #BFBFC3;
+}
+
+/* 自定义switch按钮 */
+.custom-switch {
+  position: relative;
+  width: 52px;
+  height: 32px;
+  border: 1px solid #dfdfdf;
+  outline: 0;
+  border-radius: 16px;
+  box-sizing: border-box;
+  background-color: #dfdfdf;
+  -webkit-transition: background-color .1s,border .1s;
+  transition: background-color .1s,border .1s;
+  -webkit-appearance: none;
+}
+
+.custom-switch:before {
+  content: " ";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 50px;
+  height: 30px;
+  border-radius: 15px;
+  background-color: #fdfdfd;
+  -webkit-transition: -webkit-transform 0.35s cubic-bezier(0.45, 1, 0.4, 1);
+  transition: -webkit-transform 0.35s cubic-bezier(0.45, 1, 0.4, 1);
+  transition: transform 0.35s cubic-bezier(0.45, 1, 0.4, 1);
+  transition: transform 0.35s cubic-bezier(0.45, 1, 0.4, 1), -webkit-transform 0.35s cubic-bezier(0.45, 1, 0.4, 1);
+}
+
+.custom-switch:after {
+  content: " ";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 30px;
+  height: 30px;
+  border-radius: 15px;
+  background-color: #fff;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
+  -webkit-transition: -webkit-transform 0.35s cubic-bezier(0.4, 0.4, 0.25, 1.35);
+  transition: -webkit-transform 0.35s cubic-bezier(0.4, 0.4, 0.25, 1.35);
+  transition: transform 0.35s cubic-bezier(0.4, 0.4, 0.25, 1.35);
+  transition: transform 0.35s cubic-bezier(0.4, 0.4, 0.25, 1.35), -webkit-transform 0.35s cubic-bezier(0.4, 0.4, 0.25, 1.35);
+}
+
+.custom-switch.checked {
+  border-color: #04be02;
+  background-color: #04be02;
+}
+
+.custom-switch.checked:before {
+  transform: scale(0);
+}
+
+.custom-switch.checked:after {
+  transform: translateX(20px);
+}
+
+.custom-toast .weui-toast {
+  font-size: .3rem;
+  padding: 0.2rem;
+  width: auto;
+  max-width: 6rem;
+  min-height: 0;
+  height: auto;
+  top: 50%;
+  left: 50%;
+  margin-left: 0;
+  margin-top: -0.47rem;
+  transform: translateX(-50%) translateY(-50%);
+}
+
+.custom-toast .weui-icon_toast {
+  display: none;
+}
+
+.custom-toast .weui-toast__content {
+  margin: 0;
+}
+
+.jymobile-tab-triangle {
+  position: relative;
+}
+
+.jymobile-tab-triangle:after {
+  content: '';
+  position: absolute;
+  top: 50%;
+  right: 0;
+  width: 0;
+  height: 0;
+  font-size: 0;
+  line-height: 0;
+  border-style: solid;
+  border-width: .1rem;
+  border-color: #aaa transparent transparent transparent;
+  transform: translate(140%, -30%);
+}
+
+.jymobile-tab-triangle.active:after {
+  border-color: transparent transparent #2cb7ca transparent;
+  transform: translate(140%, -70%);
+}
+
+.jymobile-tab-triangle.current {
+  color: #2cb7ca;
+}
+
+.jymobile-tab-triangle.current:after {
+  border-color: #2cb7ca transparent transparent transparent;
+}
+
+#choose_area {
+  display: flex;
+  justify-content: space-between;
+  flex-direction: column;
+  overflow: hidden;
+  height: 100%;
+}
+
+#choose_area .form {
+  flex: 1;
+  overflow-y: scroll;
+}
+
+#choose_area .optional_count, #choose_area .all_area {
+  background: #fff;
+  height: .88rem;
+  line-height: .88rem;
+  padding: 0 .3rem;
+  font-size: .3rem;
+  color: #1d1d1d;
+}
+
+#choose_area .optional_count em, #choose_area .all_area em {
+  color: #2cb7ca;
+}
+
+#choose_area .result {
+  position: relative;
+  padding: .2rem .3rem;
+  font-size: .26rem;
+  text-align: justify;
+}
+
+#choose_area .result .result_text {
+  position: relative;
+  min-height: 19px;
+}
+
+#choose_area .result .line_two {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  line-clamp: 2;
+  -webkit-box-orient: vertical;
+}
+
+#choose_area .result .detail, #choose_area .result .packup {
+  display: inline-block;
+  width: 1.5rem;
+  padding-right: 0.1rem;
+  text-align: right;
+  color: #2cb7ca;
+  font-size: .26rem;
+  z-index: 999;
+}
+
+#choose_area .result .detail {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  background: linear-gradient(90deg, rgba(245, 244, 249, 0) 0%, rgba(245, 244, 249, 0.96) 36%, #f5f4f9 100%);
+}
+
+#choose_area .result .packup {
+  position: absolute;
+  right: 0.3rem;
+  bottom: 0;
+  margin-top: .1rem;
+}
+
+#choose_area .select-area-box {
+  padding-bottom: .94rem;
+}
+
+#choose_area .select-area-box .tab {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  color: #1d1d1d;
+  background: #fff;
+  font-size: .3rem;
+  padding: .2rem .5rem;
+  border-bottom: 1px solid #e0e0e0;
+  box-sizing: border-box;
+}
+
+#choose_area .select-area-box .tab .province {
+  display: flex;
+  align-items: center;
+}
+
+#choose_area .select-area-box .tab .province .checkbox {
+  width: .4rem;
+  height: .4rem;
+  border: 1px solid #ddd;
+  border-radius: 50%;
+  margin-right: .2rem;
+  -webkit-appearance: none;
+  background: #fff;
+}
+
+#choose_area .select-area-box .tab .province .checkbox:checked {
+  border: 0;
+  background: url(/jyapp/vipsubscribe/image/xuanzhong.png) no-repeat center center;
+  background-size: 100% 100%;
+}
+
+#choose_area .select-area-box .tab .province .checkbox[disabled] {
+  border: 0;
+  background: url(/jyapp/vipsubscribe/image/active_disabled.png) no-repeat center center;
+  background-size: 100% 100%;
+}
+
+#choose_area .select-area-box .tab .province .checkbox.half {
+  border: 0 !important;
+  background: url(/jyapp/vipsubscribe/image/banxuan.png) no-repeat center center !important;
+  background-size: cover !important;
+}
+
+#choose_area .select-area-box .tab .province .checkbox.half[disabled] {
+  border: 0 !important;
+  background: url(/jyapp/vipsubscribe/image/banxuan.png) no-repeat center center !important;
+  background-size: cover !important;
+}
+
+#choose_area .select-area-box .tab .optional {
+  color: #2CB7CA;
+  font-size: 0.28rem;
+  margin-left: -2.8rem;
+}
+
+#choose_area .select-area-box label::after {
+  font-size: 14px;
+  float: right;
+  margin-right: 15px;
+}
+
+#choose_area .select-area-box .tab_content {
+  display: none;
+  font-size: .28rem;
+  padding: .1rem .3rem;
+  text-align: center;
+}
+
+#choose_area .select-area-box .tab_content .city {
+  float: left;
+  padding: .1rem .2rem;
+  background: #fff;
+  margin: .1rem 0 .1rem .1rem;
+  border-radius: 0.04rem;
+  font-size: .28rem;
+}
+
+#choose_area .select-area-box .tab_content .active {
+  background: #2cb7ca;
+  color: #fff;
+}
+
+#choose_area .select-area-box .tab_content .active[disabled] {
+  background: #BFBFC3;
+  color: #fff;
+}
+
+#choose_area .select-area-box .tab_content .city[disabled] {
+  background: #BFBFC3;
+  color: #fff;
+}
+
+#choose_area .select-area-box .index {
+  padding: .3rem .3rem .1rem .3rem;
+  font-size: .32rem;
+}
+
+#choose_area .slide {
+  background: transparent;
+  position: fixed;
+  right: 0;
+  top: 50%;
+  height: 8.5rem;
+  width: .4rem;
+  font-size: .26rem;
+  text-align: center;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  padding: .1rem 0;
+  align-items: center;
+  margin-top: -4.25rem;
+  z-index: 9999;
+}
+
+#choose_area .slide a {
+  margin-bottom: .1rem;
+}

src/jfw/modules/app/src/web/staticres/jyapp/vipsubscribe/css/choose_industry.css

@@ -407,8 +407,8 @@
   padding: .2rem .3rem;
   background:rgba(245,244,249,1);
   z-index:999;
-  position: fixed;
-  width:100%;	 
+  /* position: fixed; */
+  width:100%;
 }
 
 .choose_industry .form {

src/jfw/modules/app/src/web/staticres/jyapp/vipsubscribe/css/trial_info.css

@@ -1,189 +1,190 @@
 
 .trial_info {
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-  padding-bottom: .94rem;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: space-between;
+    width: 100%;
+    height: 100%;
+    overflow-x: hidden;
+    background: #34355A;
 }
 
 .trial_info .form {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  justify-content: space-between;
-  flex-direction: column;
+    flex: 1;
+    width: 100%;
+    overflow-y: scroll;
 }
 
 .trial_info .trial_body {
-  overflow-y: scroll;
-  flex: 1;
-  background: #34355A;
+    background: #34355A;
 }
 
 .trial_info .trial_body .banner {
-  display: flex;
-  flex-direction: column;
-  justify-content: flex-end;
-  width: 100%;
-  height: 4.24rem;
-  background: url(../image/trial_banner.png) no-repeat center center;
-  background-size: 100% 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-end;
+    width: 100%;
+    height: 4.24rem;
+    background: url(../image/trial_banner.png) no-repeat center center;
+    background-size: 100% 100%;
 }
 
 .trial_info .trial_body .banner .shadow {
-  width: 100%;
-  height: 1.4rem;
-  background: linear-gradient(180deg, rgba(52, 53, 90, 0) 0%, #34355a 100%);
+    width: 100%;
+    height: 1.4rem;
+    background: linear-gradient(180deg, rgba(52, 53, 90, 0) 0%, #34355a 100%);
 }
 
 .trial_info .trial_body .form_title {
-  width: 100%;
-  background: transparent;
-  margin-top: -0.72rem;
-  margin-bottom: .26rem;
-  color: #CFAD89;
-  text-align: center;
-  font-size: .3rem;
+    width: 100%;
+    background: transparent;
+    margin-top: -0.72rem;
+    margin-bottom: .26rem;
+    color: #CFAD89;
+    text-align: center;
+    font-size: .3rem;
 }
 
 .trial_info .trial_body .perfect {
-  width: 100%;
-  text-align: center;
-  font-size: .3rem;
-  color: #fff;
-  margin-top: -0.72rem;
-  margin-bottom: 0.32rem;
+    width: 100%;
+    text-align: center;
+    font-size: .3rem;
+    color: #fff;
+    margin-top: -0.72rem;
+    margin-bottom: 0.32rem;
 }
 
 .trial_info .trial_body .form_info {
-  padding: 0 .3rem;
+    padding: 0 .3rem;
 }
 
 .trial_info .trial_body .form_info .form_top, .trial_info .trial_body .form_info .form_bottom {
-  padding: 0.08rem 0;
-  background: #fff;
-  border-radius: 0.06rem;
+    padding: 0.08rem 0;
+    background: #fff;
+    border-radius: 0.06rem;
 }
 
 .trial_info .trial_body .form_info .form_item {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 0.26rem .3rem;
-  position: relative;    
-  height: 1rem;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 0.26rem .3rem;
+    position: relative;
+    height: 1rem;
 }
 
 .trial_info .trial_body .form_info .form_item input {
-  flex: 1;
-  font-size: .32rem;
+    flex: 1;
+    font-size: .32rem;
 }
 
 .trial_info .trial_body .form_info .form_item input::placeholder {
-  color: #888;
-  font-size: .32rem;
+    color: #888;
+    font-size: .32rem;
 }
 
 .trial_info .trial_body .form_info .form_item .code_btn {
-  color: #888;
-  font-size: .32rem;
-  background: transparent;
+    color: #888;
+    font-size: .32rem;
+    background: transparent;
 }
 
 .trial_info .trial_body .form_info .form-item-textarea {
-  display: flex;
-  align-items: center;
-  padding: 0.06rem .3rem;
-  position: relative;
-  line-height: normal;
-  height: auto;
-  min-height: .94rem;
-  height: 1rem;
+    display: flex;
+    align-items: center;
+    padding: 0.06rem .3rem;
+    position: relative;
+    line-height: normal;
+    height: auto;
+    min-height: .94rem;
+    height: 1rem;
 }
 
 .trial_info .trial_body .form_info .form-item-textarea textarea {
-  width: 100%;
-  resize: none;
-  font-size: .32rem;
+    width: 100%;
+    resize: none;
+    font-size: .32rem;
 }
 
 .trial_info .trial_body .form_info .form-item-textarea textarea::placeholder {
-  color: #888;
-  font-size: .32rem;
-  line-height: 1.3;
+    color: #888;
+    font-size: .32rem;
+    line-height: 1.3;
 }
 
-.trial_info .trial_body .form_info .form_item_line:after, .trial_info .trial_body .form_info .form-item-textarea:after {
-  position: absolute;
-  content: '';
-  left: 0;
-  bottom: 0;
-  width: calc(100% - 0.3rem);
-  height: 1px;
-  margin-left: .3rem;
-  background-color: #E0E0E0;
-  transform-origin: 0 0;
-  transform: scaleY(0.8);
+.trial_info .trial_body .form_info .form_item_line:after,
+.trial_info .trial_body .form_info .form-item-textarea:after {
+    position: absolute;
+    content: '';
+    left: 0;
+    bottom: 0;
+    width: calc(100% - 0.3rem);
+    height: 1px;
+    margin-left: .3rem;
+    background-color: #E0E0E0;
+    transform-origin: 0 0;
+    transform: scaleY(0.8);
 }
 
 .trial_info .trial_body .form_info .form_bottom {
-  margin-top: .26rem;
+    margin-top: .26rem;
 }
 
 .trial_info .trial_body .explain {
-  color: #CFAD89;
+    color: #CFAD89;
 }
 
 .trial_info .trial_body .explain .explain_title {
-  padding: .56rem .3rem .24rem;
-  font-size: .3rem;
-  text-align: center;
+    padding: .56rem .3rem .24rem;
+    font-size: .3rem;
+    text-align: center;
 }
 
 .trial_info .trial_body .explain .explain_item {
-  padding: 0 .3rem;
-  font-size: .24rem;
+    padding: 0 .3rem;
+    font-size: .24rem;
 }
 
 .trial_info .trial_btn > button {
-  width: 100%;
-  height: .94rem;
-  line-height: .94rem;
-  text-align: center;
-  font-size: .36rem;
-  background: #2CB7CA;
-  color: #fff;
+    width: 100%;
+    height: .94rem;
+    line-height: .94rem;
+    text-align: center;
+    font-size: .36rem;
+    background: #2CB7CA;
+    color: #fff;
 }
 
 .trial_info .trial_btn > button:disabled {
-  opacity: 0.4;
+    opacity: 0.4;
 }
 
 .custom-toast .weui-toast {
-  font-size: .3rem;
-  padding: 0.2rem;
-  width: auto;
-  max-width: 6rem;
-  min-height: 0;
-  height: auto;
-  top: 50%;
-  left: 50%;
-  margin-left: 0;
-  margin-top: -0.47rem;
-  transform: translateX(-50%) translateY(-50%);
+    font-size: .3rem;
+    padding: 0.2rem;
+    width: auto;
+    max-width: 6rem;
+    min-height: 0;
+    height: auto;
+    top: 50%;
+    left: 50%;
+    margin-left: 0;
+    margin-top: -0.47rem;
+    transform: translateX(-50%) translateY(-50%);
 }
 
 .custom-toast .weui-icon_toast {
-  display: none;
+    display: none;
 }
 
 .custom-toast .weui-toast__content {
-  margin: 0;
+    margin: 0;
 }
 
-.trial_info .trial_btn{
-	position: fixed;
-	bottom: 0;
-	width: 100%;
-	background: #fff;
+.trial_info .trial_btn {
+    /*position: fixed;*/
+    /*bottom: 0;*/
+    width: 100%;
+    background: #fff;
 }

src/jfw/modules/app/src/web/staticres/jyapp/vipsubscribe/css/vip_subscribe_edit.css

@@ -393,19 +393,10 @@
   position: relative;
   background: #fff;
   padding: .32rem .3rem;
+  border-top: .01rem solid #CECECE;
+  border-bottom: .01rem solid #CECECE;
 }
 
-.vip_subscribe_edit .edit_content .edit_item:after {
-  position: absolute;
-  content: '';
-  left: 0;
-  bottom: 0;
-  width: 100%;
-  height: 1px;
-  background-color: #CECECE;
-  transform-origin: 0 0;
-  transform: scaleY(0.5);
-}
 
 .vip_subscribe_edit .edit_content .edit_item .item_top {
   display: flex;
@@ -426,6 +417,9 @@
 .vip_subscribe_edit .edit_content .edit_item .item_bottom {
   color: #686868;
   font-size: .26rem;
+  flex: 1;
+  text-align: right;
+  padding-right: .2rem;
 }
 
 .vip_subscribe_edit .edit_tips {

src/jfw/modules/app/src/web/staticres/jyapp/vipsubscribe/js/editArea.js

@@ -0,0 +1,345 @@
+// 后端数据结构
+var areaData = {
+    "data": {
+        "area": {
+            "北京": [],
+            "河南": [
+                "商丘市",
+                "安阳市",
+                "新乡市",
+                "郑州市"
+            ],
+            "澳门": [],
+            "甘肃": []
+        },
+        "buyset": {
+            "areacount": 4,
+            "buyerclasscount": 11,
+            "citys": {
+                "河南": 4
+            }
+        },
+        "industry": [
+            "党委办",
+            "公共资源交易",
+            "公安",
+            "出版广电",
+            "国资委",
+            "地震",
+            "安监",
+            "工商",
+            "法院",
+            "电信行业",
+            "财政"
+        ]
+    },
+    "errMsg": "",
+    "success": true
+}
+
+
+//加载数据
+function getData() {
+    $DoPost("/subscribepay/editSub/getSubBuyMsg", {}, function (r) {
+        if (r.success) {
+            areaData = r;
+        }
+    }, false);
+}
+
+// 渲染城市方法
+function createMoreCity(arr) {
+    var tempHtml = arr.map(function (v) {
+        return '<button class="city">' + v.name + '</button>'
+    }).join('')
+    return tempHtml
+}
+
+// 省下拉市事件
+function slideFun(obj) {
+    if (obj.next('.tab_content:not(:animated)').css("display") == "block") {
+        obj.children().children('i').css({
+            "display": "inline-block",
+            "transform": "rotate(0)"
+        })
+    } else {
+        obj.children().children('i').css({
+            "display": "inline-block",
+            "transform": "rotate(-180deg)"
+        })
+    }
+    obj.toggleClass('selected').next('.tab_content:not(:animated)').slideToggle(500)
+    obj.parent().siblings().children('.tab').removeClass('selected');
+}
+
+var obj
+
+// 改变选择结果方法
+function getResult() {
+    var data = '';
+    obj = {};
+    $('.result_name').empty();
+    $('.province').each(function () {
+        let provinceText = $(this).text().trim();//省份名称
+        let isChecked = $(this).children('.checkbox').is(':checked');
+        let isHalf = $(this).children('.checkbox').hasClass('half');
+        let arr = [];
+        if (isChecked) {
+            data += provinceText + '、';
+            obj[provinceText] = [];
+        } else if (isHalf && !isChecked) {
+            let $that = $(this);
+            obj[$that.text().trim()] = [];
+            $that.parent().siblings().find('.city').each(function () {
+                let parent = $(this).parent().siblings().find('.province').text().trim();
+                if ($(this).is('.active') && parent == $that.text().trim()) {
+                    arr.push($(this).text().trim())
+                }
+            })
+            obj[$that.text().trim()] = arr
+            data += `${$that.text().trim()}(${arr.join('、')})、`
+        }
+    })
+    $('count').html($('.checkbox:not(.other):checked').length);
+    $('.result_name').append(data.substring(0, data.length - 1));
+    //校验是否修改
+    if (theSameAs(obj)) {
+        $('#enter').attr("disabled", "disabled");
+    } else {
+        $('#enter').removeAttr("disabled");
+    }
+}
+
+// 初始化页面方法
+function init() {
+    let p = areaData.data.area;
+    let count = areaData.data.buyset.citys;
+    var ht = '';
+    // 1.渲染城市列表
+    $(".select-area-box ul li:not('.index')").each(function () {
+        var text = $(this).find(".province").text().trim()
+        var data = null
+        chinaMapJSON.some(function (v) {
+            data = v
+            return v.name.indexOf(text) !== -1
+        })
+        var box = $(this).find('div.tab_content')
+        var html = createMoreCity(data.city)
+        box.html(html)
+    })
+    // 2.当areacount == -1时，全国为选中状态，为正数时为选中的省份数目，全国选项不显示
+    if (areaData.data.buyset.areacount == -1) {
+        // 选中全国
+        // $('.optional_count').html("可选择全部区域")
+        $('.all_area').show()
+        $('.optional_count').hide()
+        $('.total').html('34')
+        $('.count').html('34')
+        $('.tab.whole').parent('li').show();
+        $('.checkbox.other').prop('checked', true);
+        $('.checkbox:not(.other)').attr('disabled', true)
+        ht += `<span>全国</span>`
+    } else {
+        $('.all_area').hide()
+        $('.optional_count').show()
+        $('.total').html(areaData.data.buyset.areacount)
+        $('.tab.whole').parent('li').hide();
+        $('.checkbox.other').attr('disabled', true);
+        // 渲染已选择结果
+        for (const k in p) {
+            console.log(p[k], k)
+            if (p[k].length == 0) {
+                ht += k + '、';
+                $('.province').each(function () {
+                    let t = $(this).text().trim();
+                    if (k == t && p[k].length == 0) {
+                        // 如果购买的是全省，则不可点击下拉事件（不可修改城市）
+                        // $(this).parent('.tab').unbind("click").parent('li').siblings().find('.tab').unbind("click");
+                        $(this).parent().siblings().children('.city').addClass('active').attr('disabled', true);
+                        $(this).children('.checkbox').prop('checked', true)
+                    }
+                })
+            } else {
+                console.log(k, p[k])
+                ht += `${k}( ${p[k].join('、')} )、`;
+                $('.city').each(function () {
+                    let t = $(this).text().trim();
+                    p[k].forEach(v => {
+                        // console.log(v,t)
+                        if (v == t) {
+                            let that = $(this).parents('li').find('.tab:not(.municipality)');
+                            console.log("v==t")
+                            // 如果是可修改城市的省份，则可以进行下拉展示
+                            that.bind('click', function () {
+                                slideFun($(this));
+                            });
+                            $(this).addClass('active').parent().siblings('.tab').find('input').addClass('half');
+                            return;
+                        }
+                    })
+                })
+                for (const c in count) {
+                    if (p[k].length >= count[c]) {
+                        $('.city:not(.active)').attr('disabled', true)
+                    }
+                }
+            }
+        }
+        // 添加可选择城市文字 和自定义属性值
+        for (const c in count) {
+            $('.province').each(function () {
+                let t = $(this).text().trim();
+                if (c == t) {
+                    $(this).attr("data-count", count[c]);
+                    $(this).after(`<em class="optional">可选择 ${count[c]} 个市</em>`)
+                    $(this).parent().bind('click', function () {
+                        slideFun($(this));
+                    })
+                }
+            })
+        }
+        $('.result_name').append(ht.substring(0, ht.length - 1));
+        $('.count').html($('.checkbox:not(.other):checked').length)
+        //$('.city:not(.active)').attr('disabled', true)
+        // 如果选中的省份数量等于购买的省份数量，则将其他未选中的省份禁用
+        if ($('.checkbox:not(.other):checked').length == $('.total').html()) {
+            $('.checkbox:not(:checked)').attr('disabled', true)
+        }
+    }
+    $('#enter').attr("disabled", "disabled");
+}
+
+$(function () {
+    getData();
+    // 初始化
+    init();
+    /**** 点击checkbox实现onchange事件 *****/
+    // 1.点击全国按钮onchange事件；
+    $('.checkbox.other').on('change', function () {
+        let isChecked = $(this).is(':checked');
+        if (isChecked) {
+            $('.count').html('34')
+            $('.checkbox:not(.other)').prop('checked', false).attr('disabled', true).removeClass('half')
+            $('.city').removeClass('active').attr('disabled', true)
+            $('.tab').unbind("click").siblings().slideUp()
+            getResult()
+        } else {
+            // $('.count').html($('.checkbox:not(.other):checked').length)
+            $('.checkbox:not(.other)').removeAttr('disabled')
+            $('.city').removeAttr('disabled')
+            $('.tab:not(.municipality)').on('click', function () {
+                slideFun($(this));
+            });
+            getResult()
+        }
+    })
+    // 2.点击非全国按钮onchange事件；
+    $('.checkbox:not(.other)').on('change', function () {
+        let checkedLength = $('.checkbox:checked').length;
+        let totalLength = $('.total').text();
+        // console.log(checkedLength,totalLength)
+        $('.count').html(checkedLength)
+        if (checkedLength < totalLength) {
+            $('.checkbox:not(.other)').removeAttr('disabled')
+            getResult()
+        } else {
+            $('.checkbox:not(:checked)').attr('disabled', true)
+            getResult()
+        }
+        if ($(this).is(':checked')) {
+            $(this).prop('checked', true).removeClass('half').parent().parent().siblings().find('.city').addClass('active').attr('disabled', true)
+            getResult()
+        } else {
+            $(this).prop('checked', false).removeClass('half').parent().parent().siblings().find('.city').removeClass('active').removeAttr('disabled')
+            getResult()
+        }
+
+    })
+    // 3.点击半选按钮触发的事件
+    $('.checkbox.half').on('change', function () {
+        console.log($(this).is(':checked'))
+        if ($(this).is(':checked')) {
+            $(this).prop('checked', true).removeClass('half');
+            $(this).removeClass('half').parent().parent().siblings().find('.city').addClass('active').attr('disabled', true);
+            $(this).parent().parent().siblings().children('.city').addClass('active');
+            //$(this).parent().siblings('.optional').hide();
+            getResult()
+        } else {
+            $(this).prop('checked', false);
+            $(this).parent().parent().siblings().find('.city').removeClass('active').removeAttr('disabled');
+            $(this).parent().siblings('.optional').show();
+            getResult()
+        }
+    })
+    // 4.点击城市按钮触发的事件
+    $('.tab_content').on('click', '.city', function () {
+        let count = $(this).parent().siblings().find('.province').attr('data-count');
+        $(this).toggleClass('active')
+        var isActive = $(this).parent().find('.city.active').length
+        let cityLength = $(this).parent().find('.city').length
+
+        if (isActive === cityLength) {//当选中的城市数量等于该省下所有城市总数时，即为全选
+            var oInput = $(this).parents('li').find('input.checkbox')
+            oInput.removeClass('half').prop('checked', true)
+            getResult()
+        } else {//半选
+            $(this).parents('li').find('input.checkbox').addClass('half').prop("checked", false)
+            if (isActive > 0 && isActive != count) {
+                $(this).parents('li').find('input.checkbox').addClass('half');
+                $(this).parent('div').find('.city:not(.active)').removeAttr('disabled')
+                getResult()
+            } else if (isActive > 0 && isActive == count) {
+                $(this).parents('li').find('input.checkbox').addClass('half');
+                $(this).parent('div').find('.city:not(.active)').attr('disabled', true)
+                getResult()
+            } else {
+                $(this).parent('div').find('.city:not(.active)').removeAttr('disabled')
+                $(this).parents('li').find('input.checkbox').removeClass('half').prop('checked', false)
+                getResult()
+            }
+        }
+    })
+    // 阻止input checkbox选中取消 触发父元素下拉事件
+    $('.checkbox').click(function (e) {
+        e.stopPropagation();
+    })
+    // 锚点跳转
+    $("body").on('click', '.slide a', function () {
+        var s = $(this).html()
+        if (s == '#') {
+            return;
+        }
+        document.querySelector('#' + s).scrollIntoView({
+            block: 'center'
+        });
+    })
+    // 取消按钮事件 返回上一页
+    $('#cancel').click(function () {
+        // window.history.go(-1)
+        $('.result_name').empty()
+        $('.checkbox').prop('checked', false).removeAttr('disabled');
+        $('.city').removeClass('active');
+        $('.tab_content').slideUp();
+        $('.optional').remove()
+        init();
+    })
+    // 确定修改事件
+    $('#enter').click(function () {
+        $('#enter').attr("disabled", "disabled");
+        $DoPost("/subscribepay/editSub/submit", {
+            "type": "area",
+            "value": JSON.stringify(obj)
+        }, function (r) {
+            if (r.success) {
+                window.location.replace('/jyapp/vipsubscribe/submitEditSubFinish');
+            }
+            $('#enter').removeAttr("disabled");
+        }, false);
+    })
+});
+
+function theSameAs(select) {
+    let tmp1 = getAreaClassArr(select);
+    let tmp2 = getAreaClassArr(areaData.data.area);
+    return (JSON.stringify(tmp1[0].sort()) === JSON.stringify(tmp2[0].sort())) && (JSON.stringify(tmp1[1].sort()) === JSON.stringify(tmp2[1].sort()));
+}

src/jfw/modules/app/src/web/templates/vipsubscribe/choose_area.html

@@ -362,7 +362,7 @@
         <div class="tips_btn">
             <div class="tips_discount">
                 <div class="tips_d_money" style="display: none">&yen;38</div>
-                <div class="tips_d_text">已选择4个市，建议购买“全省”更划算哦~</div>
+                <div class="tips_d_text">已选择4个市，建议购买“全省”</div>
             </div>
             <div class="btns">
                 <button class="reset-btn" disabled>重置</button>
@@ -471,7 +471,7 @@
                 })
             })
         },
-        getResult: function (changeCity) {   /* 选中结果 */
+        getResult: function (changeCity, isFirst) {   /* 选中结果 */
             //如果选中所有，则转为全国
             if ($(".city").length == $(".city.active").length) {
                 $(".checkbox.other").trigger("click");
@@ -573,10 +573,10 @@
             //提示
             if (!this.vipSubisTrial) {
                 if (selectCityMax > 2) {
-                    $('.tips_btn .tips_d_text').text("已选择" + selectCityMax + "个市，建议购买“全省”更划算哦~").slideDown();
+                    $('.tips_btn .tips_d_text').text("已选择" + selectCityMax + "个市，建议购买“全省”").slideDown();
                 } else {
-                    if (selectProvince > 9) {
-                        $('.tips_btn .tips_d_text').text("已选择" + selectProvince + "个省，建议购买“全国”更划算哦~").slideDown()
+                    if (selectProvince > 9 && !isFirst) {
+                        $('.tips_btn .tips_d_text').text("已选择" + selectProvince + "个省，建议购买“全国”").slideDown()
                     } else {
                         $(".tips_d_text").slideUp();
                     }
@@ -614,7 +614,7 @@
         isOpen: function () {
             let pHeight = $('.result_text').height();
             let minHeight = $('.result_text').css('min-height');
-            let    rows = Math.round(Math.round(pHeight) / parseFloat(minHeight));
+            let rows = Math.round(Math.round(pHeight) / parseFloat(minHeight));
             console.log("高度：" + pHeight, "最小高度" + minHeight, "行数：" + rows);
             $(".select-area-box .area-list").css("margin-top", $('.result_text').height() + 25);
             if (rows == 1) {
@@ -703,14 +703,12 @@
                     var input = $(this).parents('li').find('input.checkbox')
                     window.input = input
                     input.prop('checked', true)
-                    AreaChoose.isAllSelected()
-                    AreaChoose.getResult()
                 } else {
                     $(this).parent('div').siblings('.tab').children().children('.checkbox').prop(
                         'checked', false)
-                    AreaChoose.isAllSelected()
-                    AreaChoose.getResult()
                 }
+                AreaChoose.isAllSelected()
+                AreaChoose.getResult($(this).parent('div').siblings('.tab').find('.province').text()) //出入选择的省份
             })
 
             $('.other').on('change', function () { //选择全国
@@ -764,7 +762,7 @@
         //AreaChoose.getNationwide();//默认选中全国
         AreaChoose.showSelected(true);//回显已选择
         /* 判断已购买的城市 在不在 全部城市里面，在，将按钮置灰，不可点击 */
-        AreaChoose.getResult();
+        AreaChoose.getResult("", true);
         AreaChoose.inintClick();
     })
 </script>

src/jfw/modules/app/src/web/templates/vipsubscribe/choose_industry.html

@@ -216,6 +216,8 @@
         <div class="slide">
             <a href="javascript:;">#</a>
             <a href="javascript:;">A</a>
+            <a href="javascript:;">A</a>
+            <a href="javascript:;">A</a>
             <a href="javascript:;">B</a>
             <a href="javascript:;">C</a>
             <a href="javascript:;">D</a>
@@ -240,7 +242,7 @@
         <div class="tips_btn">
             <div class="tips_discount">
                 <div class="tips_d_money" style="display: none">&yen;38</div>
-                <div class="tips_d_text">已选择4个行业，建议购买“全部行业”更划算哦~</div>
+                <div class="tips_d_text">已选择4个行业，建议购买“全部行业”</div>
             </div>
             <div class="btns">
                 <button class="reset-btn" disabled>重置</button>
@@ -276,7 +278,7 @@
         industryItemContainer.html(buttonArr.join(''))
     }
 
-    function findSelectedIndustry() {
+    function findSelectedIndustry(notShowTip) {
         var buttons = $('.select-area-box .list button');
         // 找到已选择的数组(有active类的数组)
         var selectedArr = [];
@@ -289,8 +291,8 @@
         });
 
         // 显示隐藏优惠tips
-        if (selectedArr.length >= 4 && !vipSubisTrial) {
-            $('.tips_btn .tips_d_text').text("已选择" + selectedArr.length + "个行业，建议购买“全部行业”更划算哦~").slideDown()
+        if (selectedArr.length >= 4 && !vipSubisTrial && !notShowTip) {
+            $('.tips_btn .tips_d_text').text("已选择" + selectedArr.length + "个行业，建议购买“全部行业”").slideDown()
         } else {
             $('.tips_btn .tips_d_text').slideUp()
         }
@@ -373,7 +375,7 @@
     });
 
     var selectedIndustryArr = ["一个行业"]; //已选择行业
-    var selectedAreaObj = {"一个省": ["一个市"]} ;//计算价格临时变量
+    var selectedAreaObj = {"一个省": ["一个市"]};//计算价格临时变量
     var timeSelect = [1, 2];//计算价格临时变量 timeSelect[0]时长  timeSelect[1] 1:年 2:月
     var vipSubisTrial = false;
     $(function () {
@@ -394,7 +396,7 @@
         }
         //已选择
         showSelect(selectedIndustryArr, true);
-        findSelectedIndustry();
+        findSelectedIndustry(true);
     })
 </script>
 </body>

src/jfw/modules/app/src/web/templates/vipsubscribe/edit_city_new.html

@@ -0,0 +1,407 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <title>区域修改</title>
+    <meta name="viewport"
+          content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-status-bar-style" content="black">
+    <script src="/jyapp/vipsubscribe/js/rem.js?v={{Msg "seo" "version"}}"></script>
+    <link rel="stylesheet" href="/jyapp/vipsubscribe/css/weui.min.css?v={{Msg "seo" "version"}}">
+    <link rel="stylesheet" type="text/css" href="/jyapp/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}"/>
+    <link rel="stylesheet" type="text/css" href="/jyapp/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}"/>
+    <!-- <link rel="stylesheet" href="/jyapp/vipsubscribe/css/public.css"> -->
+    <link rel="stylesheet" href="/jyapp/vipsubscribe/css/choose_area_new.css?v={{Msg "seo" "version"}}">
+    <link rel="stylesheet" type="text/css" href="/jyapp/css/layout.css?v={{Msg "seo" "version"}}"/>
+    <link rel="stylesheet" type="text/css" href="/jyapp/css/font.css?v={{Msg "seo" "version"}}"/>
+    <style>
+        html, body {
+            height: 100%;
+        }
+
+        .checkbox[disabled] {
+            background: none no-repeat center center #E0E0E0 !important;
+        }
+    </style>
+</head>
+
+<body>
+<div class="app-layout-header">
+    <span class="app-back jyapp-icon jyapp-icon-zuojiantou"></span>
+    区域修改
+</div>
+<div class="app-layout-content-b">
+    <div id="choose_area">
+        <p class="all_area" style="display: none;"> 可选择全部区域</p>
+        <p class="optional_count"> 可选择省数量：<em class="count"></em> / <span class="total"></span></p>
+        <div class="result">
+            <!-- 首次购买 显示"已选择" -----  升级订阅显示"已新增" -->
+
+            <p>已选择：<span class="result_name"></span></p>
+        </div>
+        <div class="form">
+            <div class="select-area-box" style="padding-bottom: 0;">
+                <ul class="area-list">
+                    <li>
+                        <div class="tab whole">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox other">全国
+                            </div>
+                        </div>
+                    </li>
+                    <li class="index" id="A">A</li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">安徽
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab municipality">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">澳门
+                            </div>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li class="index" id="B">B</li>
+                    <li>
+                        <div class="tab municipality">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">北京
+                            </div>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li class="index" id="C">C</li>
+                    <li>
+                        <div class="tab municipality">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">重庆
+                            </div>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li class="index" id="F">F</li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">福建
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li class="index" id="G">G</li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">广东
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">广西
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">贵州
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">甘肃
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li class="index" id="H">H</li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">河北
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">湖北
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">黑龙江
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">海南
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">河南
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">湖南
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <p class="index" id="J">J</p>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">吉林
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">江苏
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">江西
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li class="index" id="L">L</li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">辽宁
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li class="index" id="N">N</li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">内蒙古
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">宁夏
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li class="index" id="Q">Q</li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">青海
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li class="index" id="S">S</li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">山西
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">陕西
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab municipality">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">上海
+                            </div>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">山东
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">四川
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li class="index" id="T">T</li>
+                    <li>
+                        <div class="tab municipality">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">天津
+                            </div>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab municipality">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">台湾
+                            </div>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li class="index" id="X">X</li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">西藏
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">新疆
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li>
+                        <div class="tab municipality">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">香港
+                            </div>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li class="index" id="Y">Y</li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">云南
+                            </div>
+                            <span><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                    <li class="index" id="Z">Z</li>
+                    <li>
+                        <div class="tab">
+                            <div class="province">
+                                <input type="checkbox" class="checkbox">浙江
+                            </div>
+                            <span class="down-icon"><i class="icon iconfont">&#xe600;</i></span>
+                        </div>
+                        <div class="tab_content clearfix"></div>
+                    </li>
+                </ul>
+            </div>
+        </div>
+        <div class="tips_btn">
+            <div class="btns">
+                <button class="reset-btn" id="cancel">重置</button>
+                <button class="save-btn" id="enter">确认修改</button>
+            </div>
+        </div>
+        <div class="slide">
+            <a href="javascript:;">#</a>
+            <a href="javascript:;">A</a>
+            <a href="javascript:;">B</a>
+            <a href="javascript:;">C</a>
+            <a href="javascript:;">F</a>
+            <a href="javascript:;">G</a>
+            <a href="javascript:;">H</a>
+            <a href="javascript:;">J</a>
+            <a href="javascript:;">L</a>
+            <a href="javascript:;">N</a>
+            <a href="javascript:;">Q</a>
+            <a href="javascript:;">S</a>
+            <a href="javascript:;">T</a>
+            <a href="javascript:;">X</a>
+            <a href="javascript:;">Y</a>
+            <a href="javascript:;">Z</a>
+        </div>
+    </div>
+</div>
+<script src="/jyapp/vipsubscribe/js/jquery-2.1.4.js?v={{Msg "seo" "version"}}"></script>
+<script src="/jyapp/vipsubscribe/js/fastclick.js?v={{Msg "seo" "version"}}"></script>
+<script src="/jyapp/vipsubscribe/js/weui.min.js?v={{Msg "seo" "version"}}"></script>
+<script src="/jyapp/vipsubscribe/js/mapJSON.js?v={{Msg "seo" "version"}}"></script>
+<script src="/jyapp/vipsubscribe/js/common.js?v={{Msg "seo" "version"}}"></script>
+<script src="/jyapp/vipsubscribe/js/editArea.js?v={{Msg "seo" "version"}}"></script>
+<script src="/jyapp/js/common.js?v={{Msg "seo" "version"}}"></script>
+</body>
+
+</html>

src/jfw/modules/app/src/web/templates/vipsubscribe/edit_subscribe.html

@@ -0,0 +1,130 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport"
+          content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>VIP订阅修改</title>
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-status-bar-style" content="black">
+    <script src="/jyapp/vipsubscribe/js/rem.js?v={{Msg "seo" "version"}}"></script>
+    <link rel="stylesheet" type="text/css" href="/jyapp/vipsubscribe/css/weui.min.css?v={{Msg "seo" "version"}}"/>
+    <link rel="stylesheet" type="text/css" href="/jyapp/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}"/>
+    <link rel="stylesheet" type="text/css" href="/jyapp/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}"/>
+    <link rel="stylesheet" href="/jyapp/vipsubscribe/css/vip_subscribe_edit.css?v={{Msg "seo" "version"}}">
+    <link rel="stylesheet" type="text/css" href="/jyapp/css/layout.css?v={{Msg "seo" "version"}}"/>
+    <link rel="stylesheet" type="text/css" href="/jyapp/css/font.css?v={{Msg "seo" "version"}}"/>
+</head>
+<body>
+<div class="app-layout-header">
+    <span class="app-back jyapp-icon jyapp-icon-zuojiantou"></span>
+    VIP订阅修改
+</div>
+<div class="app-layout-content-b">
+    <div class="vip_subscribe_edit">
+        <div class="edit_content">
+            <!-- 购买的全国则不显示可修改区域 -->
+            <div class="title"></div>
+            <a data_href="/jyapp/vipsubscribe/toEditSubAreaPage" class="edit_item area">
+                <div class="item_top">
+                    <span>区域</span>
+                    <div class="item_bottom"></div>
+                    <i class="iconfont icon-arrow"></i>
+                </div>
+            </a>
+            <!-- 购买的全行业则不显示可修改行业 -->
+            <div class="title"></div>
+            <a data_href="/jyapp/vipsubscribe/toEditSubInduPage" class="edit_item industry">
+                <div class="item_top">
+                    <span>行业</span>
+                    <div class="item_bottom"></div>
+                    <i class="iconfont icon-arrow"></i>
+                </div>
+            </a>
+        </div>
+        <!--
+         <div class="edit_tips">
+             <div class="edit_count">总共可修改次数：<em>3</em> / 3</div>
+         </div>-->
+    </div>
+</div>
+<script src="/jyapp/vipsubscribe/js/jquery-2.1.4.js?v={{Msg "seo" "version"}}"></script>
+<script src="/jyapp/vipsubscribe/js/weui.min.js?v={{Msg "seo" "version"}}"></script>
+<script src="/jyapp/vipsubscribe/js/common.js?v={{Msg "seo" "version"}}"></script>
+<script src="/jyapp/js/common.js?v={{Msg "seo" "version"}}"></script>
+<script>
+    $(window).bind("pageshow", function (event) {
+        if (event.originalEvent.persisted) {
+            window.location.reload();
+        }
+    });
+    var EditSub = {
+        reqData: {},
+        init: function () {
+            this.getData();
+            this.showData();//初始化页面展示
+            this.initClick();//初始化点击事件
+        },
+        getData: function () {
+            //加载数据
+            $DoPost("/subscribepay/editSub/getSubBuyMsg", {}, function (r) {
+                if (r.success) {
+                    EditSub.reqData = r.data;
+                }
+            }, false)
+        },
+        showData: function () {
+            //判断是否可编辑
+            if (this.reqData.buyset.areacount === -1) { //显示编辑全国
+                $(".edit_item.area .item_bottom").text("已购买全国");
+            } else {
+                //展示已选择省份 和 城市
+                let cityCount = 0;
+                if (!$.isEmptyObject(this.reqData.buyset.citys)) { //显示编辑市
+                    for (var i in this.reqData.buyset.citys) {
+                        cityCount += this.reqData.buyset.citys[i]
+                    }
+                    $(".city").css("display", "");
+                    $(".edit_item.city span").text(cityCount + "个市");
+                }
+                let descText = "";
+                if (this.reqData.buyset.areacount > 0) {
+                    descText = "已购买" + this.reqData.buyset.areacount + "个省级区域"
+                }
+                if (cityCount > 0) {
+                    if (this.reqData.buyset.areacount > 0) {
+                        descText += "、"
+                    }
+                    descText += cityCount + "个地级市"
+                }
+                $(".edit_item.area .item_bottom").text(descText);
+            }
+
+            //行业展示                 
+            if (this.reqData.buyset.buyerclasscount === -1) {
+                $(".edit_item.industry .item_bottom").text("已购买全国");
+            } else {
+                $(".edit_item.industry .item_bottom").text("已购买" + this.reqData.buyset.buyerclasscount + "个行业");
+            }
+
+        },
+        initClick: function () {
+            $(".edit_item").on("click", function () {
+                window.location.href = $(this).attr("data_href");
+            });
+            //提交
+        },
+        showTip: function (msg) {
+            weui.toast(msg, {
+                duration: 2000,
+                className: 'custom-toast',
+            });
+        }
+    };
+    $(function () {
+        EditSub.init();
+    });
+</script>
+</body>
+</html>

src/jfw/modules/app/src/web/templates/vipsubscribe/edit_subscribe_industry.html

@@ -0,0 +1,414 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <title>行业选择</title>
+    <meta name="viewport"
+          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-status-bar-style" content="black">
+    <script src="/jyapp/vipsubscribe/js/rem.js?v={{Msg "seo" "version"}}"></script>
+    <link rel="stylesheet" href="/jyapp/vipsubscribe/css/weui.min.css?v={{Msg "seo" "version"}}">
+    <link rel="stylesheet" type="text/css" href="/jyapp/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}"/>
+    <link rel="stylesheet" type="text/css" href="/jyapp/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}"/>
+    <link rel="stylesheet" href="/jyapp/vipsubscribe/css/choose_industry.css?v={{Msg "seo" "version"}}">
+    <link rel="stylesheet" type="text/css" href="/jyapp/css/layout.css?v={{Msg "seo" "version"}}"/>
+    <link rel="stylesheet" type="text/css" href="/jyapp/css/font.css?v={{Msg "seo" "version"}}"/>
+</head>
+<body>
+<div class="app-layout-header">
+    <span class="app-back jyapp-icon jyapp-icon-zuojiantou"></span>
+    行业选择
+</div>
+<div class="app-layout-content-b">
+    <main class="choose_industry main">
+        <p class="optional_count"> 可选择行业数量： <em class="count"></em> / <span class="total"></span></p>
+        <div class="result" style="display: block;">
+            <span class="label">已选择：</span>
+            <span class="result_name">全部行业</span>
+        </div>
+        <div class="form">
+            <div class="select-area-box">
+                <ul class="list">
+                    <li class="list_item" id="all" style="display:none">
+                        <div class="item_label"></div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">全部行业</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="A">
+                        <div class="item_label">A</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">安监</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="B">
+                        <div class="item_label">B</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">保监</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="C">
+                        <div class="item_label">C</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">财政</button>
+                            <button class="industry_item">传媒</button>
+                            <button class="industry_item">城管</button>
+                            <button class="industry_item">采矿业</button>
+                            <button class="industry_item">出版广电</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="D">
+                        <div class="item_label">D</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">档案</button>
+                            <button class="industry_item">地震</button>
+                            <button class="industry_item">党委办</button>
+                            <button class="industry_item">电信行业</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="F">
+                        <div class="item_label">F</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">法院</button>
+                            <button class="industry_item">发改</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="G">
+                        <div class="item_label">G</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">工商</button>
+                            <button class="industry_item">工信</button>
+                            <button class="industry_item">国土</button>
+                            <button class="industry_item">公安</button>
+                            <button class="industry_item">国资委</button>
+                            <button class="industry_item">公共资源交易</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="H">
+                        <div class="item_label">H</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">环保</button>
+                            <button class="industry_item">海关</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="J">
+                        <div class="item_label">J</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">教育</button>
+                            <button class="industry_item">军队</button>
+                            <button class="industry_item">交通</button>
+                            <button class="industry_item">纪委</button>
+                            <button class="industry_item">金融业</button>
+                            <button class="industry_item">建筑业</button>
+                            <button class="industry_item">检察院</button>
+                            <button class="industry_item">机关事务</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="K">
+                        <div class="item_label">K</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">科技</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="L">
+                        <div class="item_label">L</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">林业</button>
+                            <button class="industry_item">旅游</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="M">
+                        <div class="item_label">M</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">民政</button>
+                            <button class="industry_item">民宗</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="N">
+                        <div class="item_label">N</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">农业</button>
+                            <button class="industry_item">能源化工</button>
+                            <button class="industry_item">农林牧渔</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="P">
+                        <div class="item_label">P</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">批发零售</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="Q">
+                        <div class="item_label">Q</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">气象</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="R">
+                        <div class="item_label">R</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">人行</button>
+                            <button class="industry_item">人社</button>
+                            <button class="industry_item">人大</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="S">
+                        <div class="item_label">S</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">食药</button>
+                            <button class="industry_item">税务</button>
+                            <button class="industry_item">水利</button>
+                            <button class="industry_item">市政</button>
+                            <button class="industry_item">审计</button>
+                            <button class="industry_item">商务</button>
+                            <button class="industry_item">司法</button>
+                            <button class="industry_item">社会团体</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="T">
+                        <div class="item_label">T</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">统计</button>
+                            <button class="industry_item">统战</button>
+                            <button class="industry_item">体育</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="W">
+                        <div class="item_label">W</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">文化</button>
+                            <button class="industry_item">卫生</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="X">
+                        <div class="item_label">X</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">学校</button>
+                            <button class="industry_item">宣传</button>
+                            <button class="industry_item">信息技术</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="Y">
+                        <div class="item_label">Y</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">医疗</button>
+                            <button class="industry_item">银监</button>
+                            <button class="industry_item">运输物流</button>
+                        </div>
+                    </li>
+                    <li class="list_item" id="Z">
+                        <div class="item_label">Z</div>
+                        <div class="item_industry_list">
+                            <button class="industry_item">质监</button>
+                            <button class="industry_item">组织</button>
+                            <button class="industry_item">政协</button>
+                            <button class="industry_item">住建</button>
+                            <button class="industry_item">证监</button>
+                            <button class="industry_item">政府办</button>
+                            <button class="industry_item">制造业</button>
+                            <button class="industry_item">政务中心</button>
+                            <button class="industry_item">住宿餐饮</button>
+                        </div>
+                    </li>
+                </ul>
+            </div>
+        </div>
+        <div class="slide">
+            <a href="javascript:;">#</a>
+            <a href="javascript:;">A</a>
+            <a href="javascript:;">B</a>
+            <a href="javascript:;">C</a>
+            <a href="javascript:;">D</a>
+            <a href="javascript:;">F</a>
+            <a href="javascript:;">G</a>
+            <a href="javascript:;">H</a>
+            <a href="javascript:;">J</a>
+            <a href="javascript:;">K</a>
+            <a href="javascript:;">L</a>
+            <a href="javascript:;">M</a>
+            <a href="javascript:;">N</a>
+            <a href="javascript:;">P</a>
+            <a href="javascript:;">Q</a>
+            <a href="javascript:;">R</a>
+            <a href="javascript:;">S</a>
+            <a href="javascript:;">T</a>
+            <a href="javascript:;">W</a>
+            <a href="javascript:;">X</a>
+            <a href="javascript:;">Y</a>
+            <a href="javascript:;">Z</a>
+        </div>
+        <!-- <div class="bottom_button">
+            <button class="reset-btn left_btn" disabled>重置</button>
+            <button class="save-btn right_btn" disabled>确认</button>
+        </div> -->
+        <div class="tips_btn">
+            <div class="btns">
+                <button class="reset-btn" id="cancel">取消</button>
+                <button disabled class="save-btn" id="enter">确认修改</button>
+            </div>
+        </div>
+    </main>
+</div>
+<script src="/jyapp/vipsubscribe/js/jquery-2.1.4.js?v={{Msg "seo" "version"}}"></script>
+<script src="/jyapp/vipsubscribe/js/weui.min.js?v={{Msg "seo" "version"}}"></script>
+<script src="/jyapp/vipsubscribe/js/common.js?v={{Msg "seo" "version"}}"></script>
+<script src="/jyapp/js/common.js?v={{Msg "seo" "version"}}"></script>
+<script>
+    //加载数据
+    var EditIndustry = {
+        reqData: {},
+        selectlast: [],
+        init: function () {
+            this.getData();
+            this.showData();//初始化页面展示
+            this.initClick();//初始化点击事件
+        },
+        getData: function () {
+            //加载数据
+            $DoPost("/subscribepay/editSub/getSubBuyMsg", {}, function (r) {
+                if (r.success) {
+                    EditIndustry.reqData = r.data;
+                }
+            }, false)
+            if (this.reqData.industry.length == 0 && this.reqData.buyset.buyerclasscount == -1) {
+                this.reqData.industry = ["全部行业"]
+            }
+        },
+        showData: function () {
+            this.selectlast = this.reqData.industry;
+
+            $('.result .result_name').html(this.reqData.industry.join('、'));
+
+            $('.industry_item').each(function () {
+                let text = $(this).text();
+                EditIndustry.reqData.industry.forEach(v => {
+                    if (v.trim() == text.trim()) {
+                        $(this).addClass('active')
+                    }
+                })
+            });
+
+            if (this.reqData.buyset.buyerclasscount != -1) { //非全部行业 展示数量
+                $('.total').html(this.reqData.buyset.buyerclasscount);
+                $('.count').html(this.reqData.industry.length);
+                if (this.reqData.industry.length >= this.reqData.buyset[2]) {
+                    $('.industry_item:not(.active)').attr('disabled', true);
+                }
+            } else {
+                $("#all").css("display", "");
+                $(".optional_count").css("display", "none");
+            }
+            EditIndustry.findSelectedIndustry(true);
+        },
+        initClick: function () {
+            // 点击导航跳转
+            $("body").on('click', '.slide a', function () {
+                var s = $(this).html()
+                if (s == '#') {
+                    return;
+                }
+                document.querySelector('#' + s).scrollIntoView({block: 'center'});
+            })
+            // 每个button的点击事件
+            $('.select-area-box .list').on('click', 'button', function (e) {
+                if ($(this).text() == "全部行业") {
+                    if ($(this).hasClass('active')) {
+                        return
+                    }
+                    if (EditIndustry.reqData.buyset.buyerclasscount != -1) { //购买不是全部行业 不能点击
+                        EditIndustry.showTip(`<span style="white-space: nowrap;">您只购买了${EditIndustry.reqData.buyset.buyerclasscount}个行业，如需更多请升级<span></p>`);
+                        return
+                    }
+                    $('.select-area-box .list button').removeClass('active');
+                    $('#all button').addClass('active');
+                    $('#enter').removeAttr('disabled');
+                } else {
+                    $(this).toggleClass('active')
+                    if ($(".industry_item.active").length == 0) {//如果没有行业被选中 则选中全部行业
+                        if (EditIndustry.reqData.buyset.buyerclasscount == -1) {
+                            $('#all button').addClass('active');
+                        } else {
+                            $('#enter').attr('disabled', 'disabled');//选择空不能提交
+                        }
+                    } else {
+                        $('#all button').removeClass('active');
+                        $('#enter').removeAttr('disabled');
+                    }
+                }
+
+                EditIndustry.findSelectedIndustry(false);
+            })
+            // 取消按钮事件 返回上一页
+            $('#cancel').click(function () {
+                window.history.go(-1);
+            })
+            // 确定修改事件
+            $('#enter').click(function () {
+                $("#enter").attr("disabled", "disabled");
+                //更新对象
+                if (EditIndustry.reqData.buyset.buyerclasscount == -1 && EditIndustry.reqData.industry[0] == "全部行业") {
+                    EditIndustry.reqData.industry = [];
+                }
+                console.log("final select ", EditIndustry.reqData)
+                $DoPost("/subscribepay/editSub/submit", {
+                    "type": "industry",
+                    "value": JSON.stringify(EditIndustry.reqData.industry)
+                }, function (r) {
+                    if (r.success) {
+                        window.location.replace('/jyapp/vipsubscribe/submitEditSubFinish');
+                    }
+                }, false)
+                $("#enter").removeAttr("disabled");
+            })
+        },
+        showTip: function (msg) {
+            weui.toast(msg, {
+                duration: 2000,
+                className: 'custom-toast',
+            });
+        },
+        findSelectedIndustry: function (isInit) {
+            var buttons = $('.select-area-box .list button')
+            // 找到已选择的数组(有active类的数组)
+            var selectedArr = []
+            buttons.each(function () {
+                if ($(this).hasClass('active')) {
+                    selectedArr.push($(this).text())
+                }
+            })
+            if (selectedArr.length == $('.select-area-box .list button').length - 1) {//选中了全部行业
+                $('#all button').trigger('click');
+                return
+            }
+            var selectCount = selectedArr.length
+            $('.count').html(selectCount);
+            // 显示隐藏优惠tips
+            if (selectedArr.length >= EditIndustry.reqData.buyset.buyerclasscount && EditIndustry.reqData.buyset.buyerclasscount != -1) {
+                if (!isInit) {
+                    EditIndustry.showTip(`<span style="white-space: nowrap;">您只购买了${EditIndustry.reqData.buyset.buyerclasscount}个行业，如需更多请升级<span></p>`);
+                }
+                $('.industry_item:not(.active)').attr('disabled', 'disabled');
+            } else {
+                $('.industry_item:not(.active)').removeAttr('disabled')
+            }
+            this.reqData.industry = selectedArr;
+            var selectedStr = selectedArr.join('、')
+            $('.result .result_name').text(selectedStr)
+            if (this.noChange(this.reqData.industry, EditIndustry.selectlast) || this.reqData.industry.length == 0) {
+                $('#enter').attr('disabled', 'disabled');
+            } else {
+                $('#enter').removeAttr('disabled');
+            }
+        },
+        noChange: function (arr1, arr2) {
+            return JSON.stringify(arr1.sort()) === JSON.stringify(arr2.sort());
+        }
+    }
+    $(function () {
+        EditIndustry.init();
+    })
+
+</script>
+</body>
+</html>

src/jfw/modules/app/src/web/templates/vipsubscribe/edit_subscribe_success.html

@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <title>VIP订阅修改</title>
+    <meta name="viewport"
+          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-status-bar-style" content="black">
+    <script src="/jyapp/vipsubscribe/js/rem.js?v={{Msg "seo" "version"}}"></script>
+    <link rel="stylesheet" type="text/css" href="/jyapp/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}"/>
+    <link rel="stylesheet" type="text/css" href="/jyapp/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}"/>
+    <link rel="stylesheet" href="/jyapp/vipsubscribe/css/public.css?v={{Msg "seo" "version"}}">
+    <link rel="stylesheet" href="/jyapp/vipsubscribe/css/edit_success.css?v={{Msg "seo" "version"}}">
+    <link rel="stylesheet" type="text/css" href="/jyapp/css/layout.css?v={{Msg "seo" "version"}}"/>
+    <link rel="stylesheet" type="text/css" href="/jyapp/css/font.css?v={{Msg "seo" "version"}}"/>
+</head>
+<body>
+<div class="app-layout-header">
+    <span class="app-back jyapp-icon jyapp-icon-zuojiantou"></span>
+    VIP订阅修改
+</div>
+<div class="app-layout-content-b">
+    <div class="edit_success">
+        <div><i class="icon iconfont success">&#xe612;</i></div>
+        <p>修改成功</p>
+        <button class="public_btn" id="back">返回<em class="time"></em></button>
+    </div>
+</div>
+<script src="/jyapp/vipsubscribe/js/jquery-2.1.4.js?v={{Msg "seo" "version"}}"></script>
+<script src="/jyapp/js/common.js?v={{Msg "seo" "version"}}"></script>
+<script>
+
+    $(function () {
+//              timer($('.time'),()=>{
+//                  window.history.go(-1); 
+//              })
+        countDown();
+        $('#back').click(function () {
+            window.history.go(-1);
+        })
+    })
+    var time = 3;
+
+    function countDown() {
+        if (time == 0) {
+            $('.time').html('');
+            window.history.go(-1);
+        } else {
+            $('.time').html('(' + time + ')');
+            time--;
+            setTimeout(() => {
+                countDown()
+            }, 1000)
+        }
+    }
+
+    function timer(obj, callback) {
+        let t = 3;
+        let timer = setInterval(() => {
+            t--;
+            obj.html(t)
+            if (t == 1) {
+                callback()
+            }
+        }, 1000);
+    }
+</script>
+</body>
+</html>

src/jfw/modules/app/src/web/templates/vipsubscribe/trial_info.html

@@ -24,7 +24,7 @@
 </div>
 <div class="app-layout-content-b">
     <div class="trial_info">
-        <form class="form" id="formInfo">
+        <form class="form">
             <div class="trial_body">
                 <div class="banner">
                     <div class="shadow"></div>
@@ -61,7 +61,7 @@
                                 <button class="code_btn" type="button">获取验证码</button>
                             </div>
                         </div>
-                        <div class="form_bottom ">
+                        <div class="form_bottom">
                             <div class="form_item form_item_line">
                                 <input type="text" id="" placeholder="输入公司名称" class="company input"
                                        onchange="check_company($(this))"></input>
@@ -79,13 +79,12 @@
                     <p class="explain_item">3、如用户在试用期间购买付费套餐，则试用权限在购买支付后自动失效。</p>
                 </div>
             </div>
-            <div class="trial_btn">
-                <!-- 未完善个人信息展示的按钮 type类型为submit-->
-                <button class="btn" type="submit">立即免费试用</button>
-                <!-- 已完善过个人信息 展示的按钮 type类型为button -->
-            </div>
-
         </form>
+        <div class="trial_btn">
+            <!-- 未完善个人信息展示的按钮 type类型为submit-->
+            <button class="btn" type="submit">立即免费试用</button>
+            <!-- 已完善过个人信息 展示的按钮 type类型为button -->
+        </div>
     </div>
 </div>
 <script src="/jyapp/vipsubscribe/js/jquery-2.1.4.js?v={{Msg "seo" "version"}}"></script>
@@ -95,8 +94,19 @@
 <script src="/jyapp/vipsubscribe/js/common.js?v={{Msg "seo" "version"}}"></script>
 <script src="/jyapp/js/common.js?v={{Msg "seo" "version"}}"></script>
 <script>
+
+    //解决android 键盘遮挡输入框
+    window.addEventListener("resize", function () {
+        if (document.activeElement.tagName === "INPUT" || document.activeElement.tagName === "TEXTAREA") {
+            window.setTimeout(function () {
+                //document.activeElement.scrollIntoViewIfNeeded();
+                document.activeElement.scrollIntoView({block: "center"});
+            }, 200);
+        }
+    });
     {{if not .T.trialSign }}
     $(function () {
+        //initScroll()
         scrollView("input");
         $(".btn").text("申请免费试用").attr("disabled", "disabled");
         //获取用户信息
@@ -105,24 +115,24 @@
                 $(".phone").val(r.phoneNum);
                 check_tel($('.phone'), $('.code_btn'), false);
             }
-        })
+        });
 
         //实时校验
         $('.name').bind("input propertychang", function (event) {
             check_name($(this), false);
-        })
+        });
         $('.phone').bind("input propertychang", function (event) {
             check_tel($(this), $('.code_btn'), false);
-        })
+        });
         $('.imgcode').bind("input propertychang", function (event) {
             check_imgcode($(this), $('.code_btn'), false)
-        })
+        });
         $('.phonecode').bind("input propertychang", function (event) {
             check_phonecode($(this), false)
-        })
+        });
         $('.company').bind("input propertychang", function (event) {
             check_company($(this))
-        })
+        });
 
         //刷新验证码
         $(".checkCode").on("click", function () {
@@ -157,9 +167,9 @@
                     }
                 })
             }
-        })
+        });
         //提交
-        $('#formInfo').submit(function (e) {
+        $(".btn").on("click", function (e) {
             var name = $('.name').val();
             var tel = $('.phone').val();
             var code = $('.phonecode').val();
@@ -171,50 +181,72 @@
                 code: code,
                 company: company,
                 job: job
-            }
+            };
             // ajax提交成功后跳转至vip购买页
             $DoPost("/subscribepay/trial/submitApply", post_data, function (r) {
                 if (r.success) {
                     window.location.replace("/jyapp/vipsubscribe/vipsubscribe_trial");
                 }
-            })
-            return false;
+            });
         });
     });
 
+    // 解决移动端软键盘弹起遮挡输入框及ios下软键盘关闭后底部留白问题
     function scrollView(obj) {
-        var view_height = $(document.body).height()
+        let u = navigator.userAgent, app = navigator.appVersion;
+        let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1;
+
+        var view_height = $(document.body).height();
 
         function change() {
             $(document.body).height(view_height)
         }
 
-        change();
-        window.addEventListener('resize', change);
+        // 给所有input绑定一个focus事件，用来判断键盘弹起。执行完成就解绑该事件
+        function focusOnce() {
+            $('.' + obj).on('focus', function (e) {
+                e.target.scrollIntoView({"block": "center"})
+                $('.' + obj).off('focus')
+            })
+        }
+
+
+        if (isAndroid) {
+            // 在安卓中键盘弹起会触发window.resize事件
+            // ios中则不会触发window.resize事件
+            change();
+            window.addEventListener('resize', change);
+        } else {
+            // 进入页面绑定，触发一次就解绑
+            focusOnce()
+        }
+
+
         $('.' + obj).on('blur', function (e) {
             setTimeout(() => {
                 let dom = document.activeElement;
-                // console.dir(dom);
                 if (dom.className.includes(obj)) {
-                    let u = navigator.userAgent, app = navigator.appVersion;
-                    let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1;
                     if (isAndroid) {
                         dom.scrollIntoView({"block": "center"})
+                    } else {
+                        // dom.scrollIntoView({"block": "bottom"})
                     }
-
                 } else {
-                    window.scroll(0, 0)
+                    window.scroll(0, 0);
+                    // 当页面上没有获得焦点的input时候就说明键盘收起来了。
+                    // 给input绑定focus事件用来监听其弹起
+                    focusOnce()
                 }
             }, 50)
         })
     }
-    
     {{else}}
-    $('#formInfo').submit(function (e) {
+    $(".btn").on("click", function (e) {
         window.location.replace("/jyapp/vipsubscribe/vipsubscribe_trial");
-        return false;
     });
     {{end}}
+
+
 </script>
 </body>
 

src/jfw/modules/app/src/web/templates/vipsubscribe/vip_purchase.html

@@ -130,8 +130,7 @@
                         </table>
                         <dl class="tips">
                             <dt>购买须知：</dt>
-                            <dd>套餐周期内，不支持套餐降级，续费可降级；</dd>
-                            <dd>用户最多购买/续费3年套餐；</dd>
+                            <dd>套餐周期内，不支持套餐降级，即将到期时续费可降级；</dd>
                             <dd>支持套餐升级，补差价（按月进行补差价，不足一个月按一个月计算)。</dd>
                         </dl>
                     </div>
@@ -179,7 +178,7 @@
                         <div class="tips yearly_tips" style="display: none">
                             1-2年5折，3年4折
                         </div> -->
-                    <div class="tips profit_tips" style="display: none">已选择10个月，建议“按年订阅”更换算哦~</div>
+                    <div class="tips profit_tips" style="display: none">已选择10个月，建议“按年订阅”</div>
                     <div class="computed_price">￥58.0</div>
                     <div class="bd_select">
                         <div class="weui-cells weui-cells_checkbox choose-form">
@@ -408,7 +407,7 @@
                 $(".number_box:eq(0)").addClass("active");
                 $("#number_box_month .month_number").text(this.timeSelect[0]);
                 if (this.timeSelect[0] >= 10) {
-                    $('.profit_tips').text("已选择" + this.timeSelect[0] + "个月，建议“按年订阅”更换算哦~").show();
+                    $('.profit_tips').text("已选择" + this.timeSelect[0] + "个月，建议“按年订阅”").show();
                 }
             }
             $(".info.choose_time").val(tmp);
@@ -528,7 +527,7 @@
             var firstButton = $('#number_box_month button:first');
             var lastButton = $('#number_box_month button:last');
             if (currentNum >= 10) {
-                $('.profit_tips').text("已选择" + currentNum + "个月，建议“按年订阅”更换算哦~").show()
+                $('.profit_tips').text("已选择" + currentNum + "个月，建议“按年订阅”").show()
             } else {
                 $('.profit_tips').hide()
             }

src/jfw/modules/app/src/web/templates/weixin/search/mainSearch.html

@@ -213,7 +213,7 @@
 				</a>
 			</li>
       <li class="dataExport">
-				<a href="/jyapp/vipsubscribe/introducePage">
+				<a href="/jyapp/vipsubscribe/vipsubscribe_new">
 					<div>vip订阅</div>
 					<div>导出任意条件的招标数据，按条数付费</div>
 				</a>

src/web/templates/weixin/vipsubscribe/choose_area.html

@@ -462,7 +462,7 @@
                 })
             })
         },
-        getResult: function (changeCity) {   /* 选中结果 */
+        getResult: function (changeCity,isFirst) {   /* 选中结果 */
             //如果选中所有，则转为全国
             if ($(".city").length == $(".city.active").length) {
                 $(".checkbox.other").trigger("click");
@@ -566,7 +566,7 @@
                 if (selectCityMax > 2) {
                     $('.tips_btn .tips_d_text').text("已选择" + selectCityMax + "个市，建议购买“全省”").slideDown();
                 } else {
-                    if (selectProvince > 9) {
+                    if (selectProvince > 9&&!isFirst) {
                         $('.tips_btn .tips_d_text').text("已选择" + selectProvince + "个省，建议购买“全国”").slideDown()
                     } else {
                         $(".tips_d_text").slideUp();
@@ -758,7 +758,7 @@
         AreaChoose.showSelected(true);//回显已选择
         /* 判断已购买的城市 在不在 全部城市里面，在，将按钮置灰，不可点击 */
 
-        AreaChoose.getResult();
+        AreaChoose.getResult("",true);
         AreaChoose.inintClick();
     })
 </script>