feat: 超级订阅关键词优化-关键词页面修改

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

@@ -1,402 +0,0 @@
-.add-key-word .input-box span {
-    width: 1.6rem;
-    min-width: 1.6rem;
-}
-
-.add-key-word .input-box input::placeholder {
-    color: #C0C4CC;
-}
-
-.add-key-word .input-box input {
-    width: 100%;
-    font-size: 0.32rem;
-    line-height: 1.5;
-    border: none;
-    color: #171826;
-    user-select: text;
-    -webkit-user-select:text;
-}
-
-.add-key-word .input-box {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: flex-start;
-    line-height: 3.6;
-    font-weight: 500;
-    font-size: 0.3rem;
-    color: #5F5E64;
-    padding: 0 0.32rem;
-    margin-top: 0.16rem;
-    background: #fff;
-    box-shadow: inset 16px 0px 0px #FFFFFF, inset 0px -0.5px 0px rgba(0, 0, 0, 0.05);
-}
-
-.add-key-word .add-box:active {
-    background-color: #ececec;
-}
-
-.add-key-word .add-box {
-    flex: 1;
-    font-weight: 500;
-    font-size: 0.3rem;
-    line-height: 1.08rem;
-    display: flex;
-    text-align: center;
-    align-items: center;
-    justify-content: center;
-    color: #171826;
-    background: #EDEFF2;
-    margin-right: 1px;
-}
-
-.add-key-word .add-box + .add-box {
-    margin-left: 1px;
-    margin-right: 0;
-}
-
-.add-key-word .fixed-tip-button {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-}
-
-.add-key-word .input-group .input-box span {
-    opacity: 0;
-}
-
-.add-key-word .input-group .input-box:first-child span {
-    opacity: 1;
-}
-
-.add-key-word .input-group + .input-group {
-    margin-top: 0.48rem;
-}
-
-
-.input-group .input-box {
-    margin-top: 0;
-    box-shadow: inset 0px -1px 1px -1px rgba(0, 0, 0, 0.05);
-    padding-right: 0;
-}
-
-.add-key-word .q-tip .call-dialog {
-    padding: 0.32rem;
-    display: inline-block;
-}
-
-.add-key-word .q-tip i {
-    font-size: 0.26rem;
-}
-
-.add-key-word .q-tip {
-    line-height: 0.4rem;
-    text-align: right;
-    font-weight: 500;
-    font-size: 0.26rem;
-    color: #2ABED1;
-}
-
-.jy-icon-add {
-}
-
-.jy-icon-add {
-    position: relative;
-    width: 0.28rem;
-    margin-right: 0.16rem;
-    height: 100%;
-}
-
-.jy-icon-add:before,
-.jy-icon-add:after {
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    content: '';
-    width: 0.26rem;
-    height: 0.04rem;
-    background-color: #5F5E64;
-    transform: translate(-50%, -50%);
-}
-
-.jy-icon-add:after {
-    transform: translate(-50%, -50%) rotate(90deg);
-}
-
-.dialog-container {
-    background: rgba(0, 0, 0, 0.5);
-    position: fixed;
-    width: 100%;
-    height: 100%;
-    height: 100vh;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    z-index: 999;
-}
-.z999 {
-    z-index: 999;
-}
-.dialog-container .problemPopContent {
-    width: 5.6rem;
-    min-height: 7.23rem;
-    display: inline-block;
-    background: #fff;
-    border-radius: 0.16rem;
-    position: relative;
-    padding: 0.58rem 0;
-}
-
-.dialog-container .problemPopContent h3 {
-    font-size: .34rem;
-    text-align: center;
-    padding-bottom: 0.2rem;
-}
-
-.dialog-container .problemPopContent ul {
-    padding: 0 .4rem;
-}
-
-.dialog-container .problemPopContent ul li {
-    margin-top: 0.16rem;
-}
-
-.dialog-container .problemPopContent ul li h4 {
-    font-size: .3rem;
-    line-height: 1.5;
-    color: #1d1d1d;
-}
-
-.dialog-container .problemPopContent ul li p {
-    font-size: .28rem;
-    color: #868686;
-    line-height: 1.4;
-}
-
-.knowBtn {
-    width: 100%;
-    background-color: #fff;
-    box-shadow: inset 0px 1px 1px -1px rgba(0, 0, 0, 0.1);
-    position: absolute;
-    bottom: 0;
-    height: 1rem;
-    line-height: 1rem;
-    font-weight: 500;
-    text-align: center;
-    font-size: .36rem;
-    color: #2ABED1;
-    border-radius: 0 0 8px 8px;
-}
-
-.addImg:active {
-    background-color: #ececec;
-}
-
-.addImg {
-    width: 0.4rem;
-    padding: 0 0.24rem;
-    margin-right: 0.08rem;
-    box-sizing: content-box;
-    display: inline-block;
-    background: url('/jyapp/vipsubscribe/image/delete.png?v=1430') center center no-repeat;
-    background-size: 0.4rem 0.4rem;
-    height: 1.08rem;
-}
-
-.sticky-box {
-    position: fixed;
-    top: 21.33333vw;
-    left: 0;
-    width: 100%;
-    background: #f5f4f9;
-    z-index: 2;
-}
-
-.fixed-bottom {
-    position: fixed;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    z-index: 2;
-    background: rgba(255, 255, 255, 0.96);
-    padding: 0.16rem 0.32rem 0.24rem;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-
-.fixed-bottom a:first-child {
-    margin-left: 0;
-    margin-right: 0.13rem;
-}
-
-.fixed-bottom a {
-    width: 100%;
-    height: 0.92rem;
-    line-height: 0.92rem;
-    border-radius: 0.16rem;
-    margin-left: 0.13rem;
-    font-weight: 500;
-    font-size: 0.36rem;
-    text-align: center;
-}
-
-.fixed-bottom .jy__btn_primary {
-    letter-spacing: 0.5em;
-}
-
-.fixed-bottom a + .jy__btn_primary {
-    letter-spacing: unset;
-}
-
-.jy__btn_primary {
-    background-color: #19b0c5;
-    color: #F7F9FA;
-}
-
-.jy__btn_primary:active {
-    background-color: #19b0c5;
-}
-
-.jy__btn_delete {
-    background-color: #EDEFF2;
-    color: #5F5E64;
-}
-
-.jy__btn_delete:active {
-    background-color: #dfe3e5;
-}
-
-.jy__btn_primary.disabled {
-    background-color: #87DFEA;
-}
-
-.jy__btn_primary.disabled:active {
-    background-color: #78cfda;
-}
-
-.add-key-word .content-box {
-    width: 100%;
-    left: 0;
-    right: 0;
-    top: 0;
-    bottom: 0;
-    padding-top: 2.20rem;
-    padding-bottom: 2.4rem;
-    z-index: 1;
-    overflow-y: scroll;
-    -webkit-overflow-scrolling: touch;
-    position: unset;
-}
-
-.select-input.left-run {
-    transform: translate3d(100%, 0, 0);
-}
-
-.select-input.right-run {
-    transform: translate3d(-100%, 0, 0);
-}
-
-.select-input {
-    position: relative;
-    transition: transform 0.3s ease-in-out;
-    width: 100%;
-}
-
-.select-input .input-box.right-box {
-    left: 100%;
-}
-
-.select-input .input-box {
-    margin-top: 0;
-    position: absolute;
-    width: 100%;
-    top: 0;
-    left: -100%;
-}
-
-.input-box .jy__btn_primary {
-    width: 0.96rem;
-    min-width: 0.96rem;
-    height: 0.52rem;
-    border-radius: 0.08rem;
-    font-weight: 500;
-    font-size: 0.26rem;
-    color: #FFFFFF;
-    line-height: 0.52rem;
-    text-align: center;
-    margin-left: 0.16rem;
-}
-
-.content-box.disabled input {
-    pointer-events: none;
-}
-
-.weui-dialog {
-    border-radius: 0.16rem;
-    left: 0.72rem;
-    right: 0.72rem;
-}
-
-.weui-dialog__hd {
-    color: #171826;
-    font-style: normal;
-    font-weight: bold;
-    padding: 0.48rem 0;
-    line-height: 0.52rem;
-}
-input.classify-keyword::-webkit-input-placeholder {
-    color: #C0C4CC;
-}
-
-.weui-dialog__bd {
-    font-weight: 500;
-    font-size: 0.3rem;
-    line-height: 0.44rem;
-    text-align: center;
-    color: #5F5E64;
-    padding-bottom: 0.47rem;
-}
-
-.weui-dialog__btn_default {
-    color: #171826;
-    font-weight: 500;
-    font-size: 0.36rem;
-}
-
-.weui-dialog__ft {
-    height: 0.92rem;
-    line-height: 0.92rem;
-}
-
-.weui-dialog .weui-dialog__ft .weui-dialog__btn_primary {
-    font-weight: 500;
-    font-size: 0.36rem;
-    color: #FB483D;
-}
-
-.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;
-}

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

@@ -1,351 +0,0 @@
-.exclusive-word,
-.addition-word {
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-/*  width: 100;*/
-  height: 100%;
-  overflow: hidden;
-}
-
-.exclusive-word .content,
-.addition-word .content {
-  flex: 1;
-  overflow-y: scroll;
-}
-
-.exclusive-word .title,
-.addition-word .title {
-  font-size: 0.26rem;
-  color: #888;
-  padding: 0.3rem;
-  line-height: 0.38rem;
-}
-
-.exclusive-word .enter .enterOne,
-.addition-word .enter .enterOne {
-  min-height: 47px;
-  width: 100%;
-  padding: 0.3rem;
-  font-size: 0.3rem;
-  background: #fff;
-}
-
-.exclusive-word .enter .btnChoose,
-.addition-word .enter .btnChoose {
-  border-top: 1px solid #e0e0e0;
-  overflow: hidden;
-  background: #fff;
-}
-
-.exclusive-word .enter .btnChoose button,
-.addition-word .enter .btnChoose button {
-  float: left;
-  height: 0.6rem;
-  font-size: 0.3rem;
-  width: 50%;
-  background: #fff;
-  margin: 0.15rem 0;
-  color: #1d1d1d;
-}
-
-.exclusive-word .enter .btnChoose button:first-child,
-.addition-word .enter .btnChoose button:first-child {
-  border-right: 1px solid #e0e0e0;
-}
-
-.exclusive-word .enter .btn,
-.addition-word .enter .btn {
-  margin-top: 0.16rem;
-}
-
-.exclusive-word .enter .btn button,
-.addition-word .enter .btn button {
-  width: 50%;
-  height: 0.94rem;
-  background: #2cb7ca;
-  color: #fff;
-  font-size: 0.36rem;
-  opacity: 0.5;
-}
-
-.exclusive-word .showKeyWord ul li,
-.addition-word .showKeyWord ul li {
-  margin-bottom: 0.16rem;
-  overflow: hidden;
-}
-
-.exclusive-word .showKeyWord ul li .one,
-.addition-word .showKeyWord ul li .one {
-  display: flex;
-  background: #fff;
-  line-height: 0.54rem;
-  padding: 0.2rem 0;
-}
-
-.exclusive-word .showKeyWord ul li .one div,
-.addition-word .showKeyWord ul li .one div {
-  flex: 1;
-}
-
-.exclusive-word .showKeyWord ul li .one div span,
-.addition-word .showKeyWord ul li .one div span {
-  display: flex;
-  padding: 0 0.3rem;
-}
-
-.exclusive-word .showKeyWord ul li .one div span strong,
-.addition-word .showKeyWord ul li .one div span strong {
-  font-size: 0.3rem;
-  color: #1d1d1d;
-  font-weight: normal;
-  display: block;
-  width: 1.3rem;
-}
-
-.exclusive-word .showKeyWord ul li .one div span p,
-.addition-word .showKeyWord ul li .one div span p {
-  flex: 1;
-  font-size: 0.3rem;
-  color: #686868;
-}
-
-.exclusive-word .showKeyWord ul li .one button,
-.addition-word .showKeyWord ul li .one button {
-  width: 1.96rem;
-  background: #fff;
-  color: #2cb7ca;
-  border-left: 1px solid #e0e0e0;
-  font-size: 0.3rem;
-  position: relative;
-  left: 0;
-}
-
-.exclusive-word .showKeyWord ul li .one button i,
-.addition-word .showKeyWord ul li .one button i {
-  font-size: 0.4rem;
-  padding-right: 0.1rem;
-}
-
-.exclusive-word .showKeyWord ul li .modify,
-.addition-word .showKeyWord ul li .modify {
-  display: none;
-  margin-top: 0.16rem;
-}
-
-.exclusive-word .showKeyWord ul li .modify textarea,
-.addition-word .showKeyWord ul li .modify textarea {
-  box-sizing: border-box;
-  min-height: 0.94rem;
-  resize: none;
-  width: 100%;
-  display: flex;
-  align-items: center;
-  padding: 0.3rem;
-  background: #fff;
-  outline: none;
-  font-size: 0.3rem;
-  color: #1d1d1d;
-}
-
-.exclusive-word .showKeyWord ul li .modify span,
-.addition-word .showKeyWord ul li .modify span {
-  width: 100%;
-  display: block;
-  line-height: 0.5rem;
-  padding: 0.2rem 0.3rem;
-  background: #fff;
-  outline: none;
-  font-size: 0.3rem;
-  color: #1d1d1d;
-  user-modify: read-write-plaintext-only;
-  -webkit-user-modify: read-write-plaintext-only;
-}
-
-.exclusive-word .showKeyWord ul li .modify button,
-.addition-word .showKeyWord ul li .modify button {
-  width: 50%;
-  height: 0.88rem;
-  float: left;
-  margin-top: 0.16rem;
-  font-size: 0.28rem;
-}
-
-.exclusive-word .showKeyWord ul li .modify button.addAdjunctWord, .exclusive-word .showKeyWord ul li .modify button.addExclusion,
-.addition-word .showKeyWord ul li .modify button.addAdjunctWord,
-.addition-word .showKeyWord ul li .modify button.addExclusion {
-  position: relative;
-  background: #fff;
-}
-
-.exclusive-word .showKeyWord ul li .modify button.addExclusion:before,
-.addition-word .showKeyWord ul li .modify button.addExclusion:before {
-  position: absolute;
-  content: "";
-  width: 1px;
-  height: 0.64rem;
-  background-color: #e0e0e0;
-  left: 0;
-  top: 0.13rem;
-}
-
-.exclusive-word .showKeyWord ul li .modify button.deleteKey,
-.addition-word .showKeyWord ul li .modify button.deleteKey {
-  color: #fff;
-  background: #fe737a;
-  font-size: 0.3rem;
-}
-
-.exclusive-word .showKeyWord ul li .modify button.ascertainKey,
-.addition-word .showKeyWord ul li .modify button.ascertainKey {
-  color: #fff;
-  background: #2cb7ca;
-  font-size: 0.3rem;
-}
-
-.exclusive-word .addKeyWord,
-.addition-word .addKeyWord {
-  padding-bottom: .2rem;
-  width: 100%;
-  text-align: center;
-}
-
-.exclusive-word .addKeyWord i,
-.addition-word .addKeyWord i {
-  margin-bottom: 0.4rem;
-  font-size: 1rem;
-  color: #2cb7ca;
-}
-
-.exclusive-word .addKeyWord p,
-.addition-word .addKeyWord p {
-  height: 0.56rem;
-  line-height: 0.56rem;
-  background-color: #fff;
-  font-size: 0.28rem;
-  color: #888;
-}
-
-.exclusive-word .problem,
-.addition-word .problem {
-  margin-top: 0.4rem;
-  font-size: 0.3rem;
-  color: #2cb7ca;
-  float: right;
-  margin-right: 0.3rem;
-}
-
-.exclusive-word .problem i,
-.addition-word .problem i {
-  margin-left: 0.06rem;
-}
-
-.exclusive-word .problemPop,
-.addition-word .problemPop {
-  background: rgba(0, 0, 0, 0.5);
-  position: fixed;
-  width: 100%;
-  height: 100%;
-  height: 100vh;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  display: none;
-  align-items: center;
-  justify-content: center;
-}
-
-.exclusive-word .problemPop .problemPopContent,
-.addition-word .problemPop .problemPopContent {
-  width: 5.6rem;
-  min-height: 7.23rem;
-  display: inline-block;
-  background: #fff;
-  border-radius: 4px;
-  position: relative;
-  padding: 0.58rem 0;
-}
-
-.exclusive-word .problemPop .problemPopContent h3,
-.addition-word .problemPop .problemPopContent h3 {
-  font-size: 0.34rem;
-  text-align: center;
-  padding-bottom: 0.2rem;
-}
-
-.exclusive-word .problemPop .problemPopContent ul,
-.addition-word .problemPop .problemPopContent ul {
-  padding: 0 0.4rem;
-}
-
-.exclusive-word .problemPop .problemPopContent ul li,
-.addition-word .problemPop .problemPopContent ul li {
-  margin-top: 0.16rem;
-}
-
-.exclusive-word .problemPop .problemPopContent ul li h4,
-.addition-word .problemPop .problemPopContent ul li h4 {
-  font-size: 0.3rem;
-  line-height: 1.5;
-  color: #1d1d1d;
-}
-
-.exclusive-word .problemPop .problemPopContent ul li p,
-.addition-word .problemPop .problemPopContent ul li p {
-  font-size: 0.28rem;
-  color: #868686;
-  line-height: 1.4;
-}
-
-.exclusive-word .problemPop .problemPopContent button,
-.addition-word .problemPop .problemPopContent button {
-  width: 100%;
-  background: #fff;
-  border-top: 1px solid #e0e0e0;
-  position: absolute;
-  bottom: 0;
-  height: 1rem;
-  font-size: 0.36rem;
-  color: #2cb7ca;
-}
-
-.custom-toast .weui-toast {
-  font-size: 0.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;
-}
-
-.weui-dialog .weui-dialog__ft .weui-dialog__btn_primary {
-  color: #2cb7ca;
-}
-
-.weui-dialog input {
-  caret-color: #2cb7ca;
-}
-.addKeyWord  i.icon-tianjia{
-	    position: fixed;
-    bottom: 0px;
-    left: 50%;
-    margin-left: -25px;
-    width: 50px;
-}
-.addkeyWord{
-	margin-bottom:.2rem;
-}

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

@@ -1,704 +1,157 @@
-.keyWord {
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    width: 100%;
-    height: 100%;
-    overflow: hidden;
-}
-html, body {
-    background: #f5f6f7;
-}
-
-.keyWord .add-keyword-container,
-.keyWord .all-classify-column {
-    display: flex;
-    flex: 1;
-    flex-direction: column;
-    justify-content: space-between;
-    overflow-y: scroll;
-}
-
-.keyWord .add-keyword-container .classify {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding: 0 .3rem;
-    height: 1.08rem;
-    background-color: #fff;
-}
-
-.keyWord .add-keyword-container .classify .classify-l {
-    font-size: .32rem;
-    color: #171826;
-    width: 2rem;
-    font-weight: 500;
-}
-
-.keyWord .add-keyword-container .classify .classify-r {
-    display: flex;
-    align-items: center;
-    justify-content: end;
-    height: 100%;
-    font-weight: 500;
-    color: #9B9CA3;
-    font-size: .28rem;
-}
-
-.keyWord .add-keyword-container .classify .classify-r .icon-arrow {
-    margin-left: .1rem;
-    line-height: 0.4rem;
-    color: #C0C4CC;
-    font-size: 0.28rem;
-}
-
-.keyWord .add-keyword-container .classify-tips {
-    padding: .16rem .32rem;
-    font-size: .24rem;
-    color: #9B9CA3;
-    line-height: .36rem;
-    font-weight: 500;
-}
-
-.keyWord .add-keyword-container .content {
-    flex: 1;
-    overflow-y: scroll;
-}
-
-.keyWord .add-keyword-container .content .enter .enterOne {
-    min-height: 47px;
-    width: 100%;
-    padding: 0.3rem;
-    font-size: .3rem;
-    background: #fff;
-}
+.group-filter-container {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 100%;
+}
+.filter-text {
+  margin-right: .16rem;
+  font-size: .28rem;
+  color: #5f5e64;
+  line-height: .4rem;
+}
+.filter-button {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: .08rem .24rem;
+  font-size: .24rem;
+  color: #171826;
+  background-color: #fff;
+  border-radius: 50px;
+}
+.filter-button:active {
+  background-color: rgba(0,0,0,.02);
+}
+.filter-button .van-icon-play {
+  margin-left: .08rem;
+  transform: rotate(90deg);
+}
+
+.j-key-card {}
+.j-key-card-top {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+}
+.j-key-card-bottom {
+  
+  margin-top: .2rem;
+  color: #5f5e64;
+  line-height: .36rem;
+  font-size: .24rem;
+}
+.j-key-card-bottom.ls {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+}
+.j-key-card-bottom.ls .subinfo-text  {
+  flex: 1;
+}
+.j-key-card .k-c-t-c {
+  margin: 0 .2rem;
+  flex: 1;
+  font-size: .28rem;
+  font-weight: 500;
+  color: #171826;
+  line-height: .4rem;
+}
+.j-key-card .k-c-t-r {
+  line-height: .4rem;
+}
+
+
+/* popup */
+.j-popup .j-main {
+  padding-left: .32rem;
+}
+.j-popup .keywords-group-item {
+  padding: .24rem .32rem;
+  padding-left: 0;
+  font-size: .28rem;
+  color: #5f5e64;
+  line-height: .4rem;
+}
+.j-popup .keywords-group-item.active {
+  color: #2abed1;
+}
+.j-popup .keywords-group-item:not(:last-of-type) {
+  border-bottom: 1px solid rgba(0,0,0,.04);
+}
+
+/* empty */
+.key-empty .add-keyword-button {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: .28rem;
+  padding: .16rem .48rem;
+  width: 3.2rem;
+  height: 0.8rem;
+  font-size: .32rem;
+  line-height: .48rem;
+  border-radius: .08rem;
+  color: #fff;
+  background-color: #2cb7ca;
+}
+.key-empty .add-keyword-button[disabled] {
+  opacity: 0.5;
+}
+.key-empty .button-text {
+  margin-left: .08rem;
+}
+
+.keywords-count {
+  margin-top: .28rem;
+  font-size: .24rem;
+  color: #9b9ca3;
+  line-height: .36rem;
+}
 
-.keyWord .add-keyword-container .content .enter .btnChoose {
-    border-top: 1px solid #e0e0e0;
-    overflow: hidden;
-    background: #fff;
+/* 快速导入 */
+.fast-import {
+  padding-top: .24rem;
+  padding-bottom: .24rem;
+  height: unset;
+  color: #fff;
+  font-size: .26rem;
+  background-color: #2abed1;
 }
-
-.keyWord .add-keyword-container .content .enter .btnChoose button {
-    float: left;
-    height: 0.6rem;
-    font-size: .3rem;
-    width: 50%;
-    background: #fff;
-    margin: 0.15rem 0;
-    color: #1D1D1D;
-}
-
-.keyWord .add-keyword-container .content .enter .btnChoose button:first-child {
-    border-right: 1px solid #e0e0e0;
-}
-
-.keyWord .add-keyword-container .content .enter .btn {
-    margin-top: .16rem;
-}
-
-.keyWord .add-keyword-container .content .enter .btn button {
-    width: 50%;
-    height: 0.94rem;
-    background: #2cb7ca;
-    color: #fff;
-    font-size: .36rem;
-    opacity: .5;
-}
-
-.keyWord .add-keyword-container .title {
-    font-size: .26rem;
-    color: #888;
-    padding: .3rem;
-    line-height: .38rem;
+.fast-import .fast-import-text {
+  margin: 0 .24rem;
+  flex: 1;
 }
-
-.keyWord .all-classify-column {
-    /*  border-top: 1px solid transparent;*/
+.fast-import .van-icon-plus {
+  font-size: .36rem;
+  font-weight: 700;
+  transform: rotate(45deg);
 }
 
-.keyWord .all-classify-column .classify-list {
-    padding-bottom: 1.1rem;
+.fast-import .fast-import-button {
+  padding: .04rem .12rem;
+  border: 1px solid rgba(255, 255, 255, 0.5);
+  border-radius: 8px;
 }
 
-.keyWord .all-classify-column .classify-list .classify-item {
-    /*display: flex;*/
-    align-items: center;
-    justify-content: space-between;
-    background-color: #fff;
-    box-shadow: inset 0 -0.5px 0 rgba(0, 0, 0, 0.05);
-    border-radius: 8px;
-    width: calc(100% - 0.48rem);
-    margin: .16rem auto 0;
-    height: 1.36rem;
-    border: none;
-    padding: 0.24rem 0.32rem;
+.fast-import-content {
+  font-size: .3rem;
+  color: #5f5e64;
+  line-height: .44rem;
 }
-
-
-.keyWord .all-classify-column .classify-list .classify-item .classify-item-l {
-    font-size: .32rem;
-    color: #1d1d1d;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    display: -webkit-inline-box;
-    -webkit-line-clamp: 1;
-    -webkit-box-orient: vertical;
-    width: 4.5rem;
-    margin-top: -0.05rem;
-}
-.classify .classify-detail{
-    text-overflow: ellipsis;
-    overflow: hidden;
-    display: -webkit-inline-box;
-    -webkit-line-clamp: 1;
-    -webkit-box-orient: vertical;
-    width: 4rem;
-    text-align:right;
+.fast-import-tip {
+  margin-top: 0.4rem;
+  font-size: .24rem;
+  color: #888;
+  line-height: .44rem;
 }
 
-.keyWord .all-classify-column .classify-list .classify-item .classify-item-r {
-    /*display: flex;*/
-    align-items: center;
-    justify-content: end;
-    /*height: 100%;*/
-    color: #888888;
-    font-size: .28rem;
-    /*new*/
-    float: right;
+.dialog-upgrade .fast-import-tip {
+  display: flex;
+  align-items: flex-start;
 }
-
-.keyWord .all-classify-column .classify-list .classify-item .classify-item-r .icon-arrow {
-    margin-left: .2rem;
-    font-size: .26rem;
-}
-
-.keyWord .delete-button {
-    font-weight: 500;
-    font-size: 0.32rem;
-    line-height: 1;
-    align-items: center;
-    color: #FFFFFF;
-    background: #FB483D;
-    border-radius: 0.16rem;
-    width: 1.76rem;
-    margin-top: .16rem;
-    margin-right: .16rem;
-    text-align: center;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-}
-
-.keyWord .showKeyWord ul li .one {
-    display: flex;
-    background: #fff;
-    line-height: .54rem;
-    margin: 0.16rem 0.24rem 0;
-    border-radius: 0.16rem;
-    padding: 0.24rem 0.32rem;
-    overflow: hidden;
-    max-width: calc(100% - 0.48rem);
-}
-
-.keyWord .showKeyWord ul li .one div {
-    flex: 1;
-}
-
-.keyWord .showKeyWord ul li .one div span {
-    display: flex;
-}
-
-.keyWord .showKeyWord ul li .one div span strong {
-    font-size: 0.3rem;
-    color: #1d1d1d;
-    font-weight: normal;
-    display: block;
-    margin-right: 0.24rem;
-}
-.keyWord .showKeyWord ul li .one div span p.key {
-    color: #171826;
-    font-size: 0.32rem;
-}
-.keyWord .showKeyWord ul li .one div span p {
-    flex: 1;
-    line-height: 0.60rem;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    display: -webkit-box;
-    -webkit-line-clamp: 1;
-    -webkit-box-orient: vertical;
-    color: #5F5E64;
-    font-weight: 500;
-    font-size: 0.26rem;
-}
-.keyWord .showKeyWord ul li .one div span.icon-arrow {
-    color: #C0C4CC;
-    font-size: 0.28rem;
-    line-height: 0.60rem;
-}
-.keyWord .showKeyWord ul li .one div span.keyWord-tags {
-    display: inline-block;
-}
-.keyWord-tags {
-    color: #05A6F3;
-    font-weight: 500;
-    font-size: 0.2rem;
-    line-height: 0.34rem;
-    padding: 0 0.08rem;
-    box-sizing: border-box;
-    text-align: center;
-    min-width: 0.76rem;
-    word-break: keep-all;
-    border: 0.5px solid #05A6F3;
-    border-radius: 0.08rem;
-}
-.keyWord-tags.exclude {
-    color: #FB483D;
-    border-color: #FB483D;
-}
-.keyWord .showKeyWord ul li .one div span.line-top-border {
-    margin-top: 0.04rem;
-    padding-top: 0.24rem;
-}
-.keyWord .showKeyWord ul li .one div span.line-top-border + .line-top-border {
-    margin-top: 0;
-    padding-top: 0;
-}
-.keyWord .showKeyWord ul li .one div span.line-top-border + .line-top-border:before {
-    content: none;
-}
-.keyWord .line-top-border {
-    position: relative;
-}
-.keyWord .line-top-border::before {
-    content: '';
-    position: absolute;
-    top: 0;
-    background: rgba(0, 0, 0, 0.05);
-    width: 100%;
-    height: 1px;
-    -webkit-transform: scaleY(0.5);
-    transform: scaleY(0.5);
-    -webkit-transform-origin: 0 0;
-    transform-origin: 0 0;
-    left: 0;
-}
-
-.keyWord .showKeyWord ul li .one button {
-    width: 1.96rem;
-    background: #fff;
-    color: #2cb7ca;
-    border-left: 1px solid #E0E0E0;
-    font-size: .3rem;
-    position: relative;
-    left: 0;
-}
-
-.keyWord .showKeyWord ul li .one button i {
-    font-size: .4rem;
-    padding-right: 0.1rem;
-}
-
-.keyWord .showKeyWord ul li .modify {
-    display: none;
-    margin-top: .16rem;
-}
-
-.keyWord .showKeyWord ul li .modify textarea {
-    box-sizing: border-box;
-    min-height: .94rem;
-    resize: none;
-    width: 100%;
-    display: flex;
-    align-items: center;
-    padding: .3rem;
-    background: #fff;
-    outline: none;
-    font-size: 0.3rem;
-    color: #1d1d1d;
-}
-
-.keyWord .showKeyWord ul li .modify span {
-    width: 100%;
-    display: block;
-    line-height: 0.5rem;
-    padding: 0.2rem .3rem;
-    background: #fff;
-    outline: none;
-    font-size: 0.3rem;
-    color: #1d1d1d;
-    user-modify: read-write-plaintext-only;
-    -webkit-user-modify: read-write-plaintext-only;
-}
-
-.keyWord .showKeyWord ul li .modify button {
-    width: 50%;
-    height: .88rem;
-    float: left;
-    margin-top: 0.16rem;
-    font-size: .28rem;
-}
-
-.keyWord .showKeyWord ul li .modify button.addAdjunctWord, .keyWord .showKeyWord ul li .modify button.addExclusion {
-    position: relative;
-    background: #fff;
-}
-
-.keyWord .showKeyWord ul li .modify button.addExclusion:before {
-    position: absolute;
-    content: '';
-    width: 1px;
-    height: .64rem;
-    background-color: #e0e0e0;
-    left: 0;
-    top: 0.13rem;
-}
-
-.keyWord .showKeyWord ul li .modify button.deleteKey {
-    color: #fff;
-    background: #FE737A;
-    font-size: .3rem;
+.dialog-upgrade .tip-text {
+  margin-left: .16rem;
+  flex: 1;
 }
 
-.keyWord .showKeyWord ul li .modify button.ascertainKey {
-    color: #fff;
-    background: #2cb7ca;
-    font-size: .3rem;
-}
-.showKeyWord {
-    padding-bottom: 2.2rem;
-}
-
-.keyWord .addKeyWord {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    width: 100%;
-    text-align: center;
-    line-height: 1;
-    background: #fff;
-    position: fixed;
-    bottom: 0;
-    padding: 0.04rem 0;
-    z-index: 2;
-}
-
-.keyWord .addKeyWord i {
-    margin-bottom: .3rem;
-    font-size: 1rem;
-    color: #2cb7ca;
-}
-
-.keyWord .addKeyWord p {
-    width: 100%;
-    height: 0.4rem;
-    line-height: 0.4rem;
-    background-color: #fff;
-    color: #9B9CA3;
-    font-size: 0.24rem;
-    font-weight: 500;
-}
-
-.keyWord .problem {
-    margin-top: .4rem;
-    font-size: .3rem;
-    color: #2cb7ca;
-    float: right;
-    margin-right: 0.3rem;
-}
-
-.keyWord .problem i {
-    margin-left: .06rem;
-}
-
-.dialog-container {
-    background: rgba(0, 0, 0, 0.5);
-    position: fixed;
-    width: 100%;
-    height: 100%;
-    height: 100vh;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    display: none;
-    align-items: center;
-    justify-content: center;
-    z-index: 999;
-}
-.z999 {
-    z-index: 999;
-}
-.dialog-container .problemPopContent {
-    width: 5.6rem;
-    min-height: 7.23rem;
-    display: inline-block;
-    background: #fff;
-    border-radius: 4px;
-    position: relative;
-    padding: 0.58rem 0;
-}
-
-.dialog-container .problemPopContent h3 {
-    font-size: .34rem;
-    text-align: center;
-    padding-bottom: 0.2rem;
-}
-
-.dialog-container .problemPopContent ul {
-    padding: 0 .4rem;
-}
-
-.dialog-container .problemPopContent ul li {
-    margin-top: 0.16rem;
-}
-
-.dialog-container .problemPopContent ul li h4 {
-    font-size: .3rem;
-    line-height: 1.5;
-    color: #1d1d1d;
-}
-
-.dialog-container .problemPopContent ul li p {
-    font-size: .28rem;
-    color: #868686;
-    line-height: 1.4;
-}
-
-.dialog-container .problemPopContent button {
-    width: 100%;
-    background: #fff;
-    border-top: 1px solid #E0E0E0;
-    position: absolute;
-    bottom: 0;
-    height: 1rem;
-    font-size: .36rem;
-    color: #2cb7ca;
-}
-
-.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;
-}
-.weui-dialog {
-    border-radius: 0.16rem;
-    left: 0.72rem;
-    right: 0.72rem;
-}
-.weui-dialog__hd {
-    color: #171826;
-    font-style: normal;
-    font-weight: bold;
-    padding: 0.48rem 0;
-    line-height: 0.52rem;
-}
-input.classify-keyword::-webkit-input-placeholder {
-    color: #C0C4CC;
-}
-.weui-dialog__bd {
-    font-weight: 500;
-    font-size: 0.3rem;
-    line-height: 0.44rem;
-    text-align: center;
-    color: #5F5E64;
-    padding-bottom: 0.47rem;
-}
-.weui-dialog__btn_default {
-    color: #171826;
-    font-weight: 500;
-    font-size: 0.36rem;
-}
-.weui-dialog__ft {
-    height: 0.92rem;
-    line-height: 0.92rem;
-}
-.weui-dialog .weui-dialog__ft .weui-dialog__btn_primary {
-    font-weight: 500;
-    font-size: 0.36rem;
-    color: #FB483D;
-}
-
-.weui-dialog input {
-    caret-color: #2cb7ca;
-}
-
-.classify-edit-pop .weui-dialog__bd input {
-    border: 1px solid rgba(0, 0, 0, 0.1);
-    box-sizing: border-box;
-    border-radius: 0.08rem;
-    font-weight: 500;
-    font-size: 0.3rem;
-    line-height: 0.32rem;
-    padding: 0.3rem 0.32rem;
-    color: #171826;
-    width: 100%;
-}
-
-.addKeyWord  i.icon-tianjia{
-    position: fixed;
-    bottom: .5rem;
-    bottom: calc(constant(safe-area-inset-bottom) + 0.5rem); /* iOS 11.0 */
-    bottom: calc(env(safe-area-inset-bottom) + 0.5rem); /* iOS 11.2 */
-    left: 50%;
-    margin-left: -25px;
-    width: 50px;
-}
-.enter.addkeyWord{
-    margin-top: 2rem;
-    margin-bottom: .2rem;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-}
-
-.enter.addkeyWord img {
-    width: 2rem;
-}
-.enter.addkeyWord img + span {
-    font-weight: 500;
-    font-size: 14px;
-    line-height: 20px;
-    color: #5F5E64;
-    margin-top: 0.77rem;
-    margin-bottom: 0.96rem;
-}
-.enter.addkeyWord .addButton {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: center;
-    padding: 0.16rem 0.48rem;
-    width: 3.04rem;
-    height: 0.8rem;
-    background: #2ABED1;
-    border-radius: 0.08rem;
-    font-weight: 500;
-    font-size: 0.32rem;
-    line-height: 0.48rem;
-    color: #F7F9FA;
-}
-.jy-icon-add {}
-.jy-icon-add {
-    position: relative;
-    width: 0.28rem;
-    margin-right: 0.16rem;
-    height: 100%;
-}
-
-.jy-icon-add:before,
-.jy-icon-add:after {
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    content: '';
-    width: 0.26rem;
-    height: 0.04rem;
-    background-color: #fff;
-    transform: translate(-50%, -50%);
-}
-
-.jy-icon-add:after {
-    transform: translate(-50%, -50%) rotate(90deg);
-}
-
-.ios-user-select {
-    -webkit-user-select: text;
-}
-.opacity6{
-    opacity: 0.6;
-}
-.keysexplain{
-    /* position: fixed; */
-    height: 0.4rem;
-    /* background: red; */
-    width: 100%;
-    font-size: .24rem;
-    line-height: 0.4rem;
-    font-weight: 500;
-    /* padding-top: .18rem; */
-    /* padding-left: .3rem; */
-    color: #9B9CA3;
-}
-.classifyKeysShow{
-    font-size: .25rem;
-    color: #686868;
-    margin-top: 0.1rem;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    display: -webkit-box;
-    -webkit-line-clamp: 1;
-    -webkit-box-orient: vertical;
-}
-.addClassify{
-    text-align: center;
-    color:#FFFFFF;
-    font-size: .36rem;
-    font-weight: 500;
-    background: #2ABED1;
-    border-radius: 0.16rem;
-    width: 6.86rem;
-    margin: 0.16rem 0 0.24rem 0;
-    line-height: 0.92rem;
-    height: 1rem;
-}
-.all-classify-column{
-    position: relative;
-    padding-bottom: 1rem;
-}
-.classify-fast{
-    height: 0.88rem;
-    background-color: #2ABED1;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    font-weight: 500;
-    font-size: 0.26rem;
-    padding: 0 0.32rem;
-    color: #FFFFFF;
-}
-.classify-fast span {
-    flex: 1;
-    width: 100%;
-}
-.classify-fast .weui-dialog__btn {
-    max-width: 1.44rem;
-    height: 0.64rem;
-    line-height: 0.64rem;
-    border: 1px solid rgba(255, 255, 255, 0.5);
-    box-sizing: border-box;
-    border-radius: 8px;
-    font-size: 0.26rem;
-    text-align: center;
-    color: #FFFFFF;
-}
-
-.classify-fast-pop .weui-dialog .weui-dialog__bd {
-    text-align: left;
-}
-.classify-fast-pop .weui-dialog .weui-dialog__bd p {
-    color: #9B9CA3;
-    font-weight: 500;
-    font-size: 0.26rem;
-    line-height: 0.4rem;
-    margin-top: 0.4rem;
-}

src/jfw/modules/app/src/web/staticres/jyapp/vipsubscribe/css/keyword-common.css

@@ -0,0 +1,290 @@
+/* 超级订阅关键词页面共用 */
+@keyframes rcmdRotateloading {
+  0% {
+    transform: rotateY(180deg) rotateZ(0);
+  }
+
+  100% {
+    transform: rotateY(180deg) rotateZ(1turn);
+  }
+}
+
+/* vant-reset */
+.van-dialog {
+  width: 6rem;
+  border-radius: .16rem;
+}
+.van-dialog__header {
+  font-weight: 700;
+  font-size: 18px;
+  line-height: 26px;
+  color: #171826;
+}
+.van-dialog__content {
+  padding: .16rem .6rem;
+}
+.van-dialog__message {
+  padding-left: 0;
+  padding-right: 0;
+  font-size: .3rem;
+  line-height: .44rem;
+  color: #5F5E64;
+}
+.van-dialog .van-button {
+  font-size: 18px;
+  line-height: 26px;
+}
+
+.van-dialog  .van-button--default {
+  color: #171826;
+}
+
+.van-toast {
+  max-width: 4.2rem;
+  line-height: 1.6;
+}
+
+/* vant-custom */
+.j-confirm-dialog {
+  border-radius: 8px;
+}
+.j-confirm-dialog .van-dialog__message {
+  font-size: .32rem;
+  color: #171826;
+  line-height: .48rem;
+  text-align: left;
+}
+.j-confirm-dialog.text-center .van-dialog__message {
+  text-align: center;
+}
+.j-confirm-dialog .van-button {
+  font-size: .36rem;
+  color: #171826;
+  line-height: .52rem;
+}
+
+/* 列表 */
+.keyword-list {
+  padding: .2rem 0;
+}
+.keywords-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.keywords-item:not(:last-of-type) {
+  margin-bottom: .16rem;
+}
+.keywords-item .checkbox-container {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  padding: .24rem 0;
+  width: .64rem;
+  transition: width .5s ease;
+}
+.keywords-item .checkbox-container.w0 {
+  width: 0;
+  padding: 0;
+}
+.keywords-item .van-swipe-cell {
+  flex: 1;
+}
+.keywords-item .j-key-card {
+  display: flex;
+  flex-direction: column;
+  margin: 0 0.24rem;
+  padding: 0.24rem 0.32rem;
+  max-width: calc(100% - 0.48rem);
+  overflow: hidden;
+  background-color: #fff;
+  border-radius: .16rem;
+  box-shadow: 0 8px 12px #ebedf0;
+}
+.keywords-item .delete-button {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-left: 2px;
+  margin-right: .24rem;
+  width: 1.76rem;
+  height: 100%;
+  font-weight: 500;
+  font-size: 0.32rem;
+  color: #FFFFFF;
+  background-color: #FB483D;
+  border-radius: 0.16rem;
+  box-shadow: 0 8px 12px #ebedf0;
+}
+.text-container {
+  white-space: pre-wrap;
+  word-break: break-all;
+}
+
+
+/* 修改分类名弹窗样式 */
+.group-name-edit .van-dialog__content {
+  padding: .48rem;
+}
+
+.group-name-edit .edit-container {
+  width: 100%;
+  font-size: 0.32rem;
+  line-height: 0.32rem;
+  padding: 0.24rem 0.3rem;
+  color: #171826;
+  border-radius: 0.08rem;
+  border: 1px solid rgba(0, 0, 0, 0.1);
+}
+.group-name-edit .edit-container input {
+  width: 100%;
+}
+
+/* tag公共样式 */
+.j-tag {
+  padding: .04rem .08rem;
+  font-size: .2rem;
+  line-height: .28rem;
+  border-radius: .08rem;
+  border: 1px solid transparent;
+}
+.tag-orange {
+  color: #ff9f40;
+  border-color: #ff9f40;
+}
+.tag-green {
+  color: #6ccf49;
+  border-color: #6ccf49;
+}
+
+
+/* 头部公共样式 */
+.m-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: .98rem;
+  padding: 0 .32rem;
+}
+
+/* 批量删除按钮 */
+.batch-delete {
+  padding: 0 .32rem;
+  color: #2abed1;
+  font-size: .28rem;
+}
+.batch-delete.h100 {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+}
+
+/* 关键词推荐卡片 */
+/* recommend-cards */
+.rec-cells {
+  padding: .32rem;
+  background-color: #fff;
+}
+.rec-cells .rec-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.rec-cells .rec-title {
+  font-size: .28rem;
+  color: #5f5e64;
+  line-height: .48rem;
+}
+.rec-cells .rec-change {
+  display: flex;
+  align-items: center;
+  color: #2abed1;
+}
+.rec-cells .rec-change:active {
+  opacity: 0.7;
+}
+.rec-cells .rec-change .text {
+  margin-left: .1rem;
+}
+.rec-cells .van-icon-replay {
+  font-size: .32rem;
+  transform: rotateY(180deg);
+}
+.rec-cells .rec-content {
+  margin-top: .24rem;
+}
+.rec-tags {
+  display: flex;
+  width: 100%;
+  flex-wrap: wrap;
+}
+.rec-tags .tag {
+  padding: .12rem .2rem;
+  margin: .08rem;
+  min-width: 30%;
+  font-size: .24rem;
+  line-height: .36rem;
+  color: #5F5E64;
+  background-color: #F5F6F7;
+  border-radius: .08rem;
+  white-space: nowrap;
+  word-break: break-all;
+  text-align: center;
+}
+.rec-change .van-icon-replay.active {
+  animation: rcmdRotateloading .5s linear infinite running;
+}
+
+/* popup */
+.j-popup .van-popup__close-icon {
+  top: .48rem;
+}
+.j-popup .popup-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 1.28rem;
+  padding: 0 .32rem;
+}
+.j-popup .header-title {
+  font-size: .4rem;
+  color: #171826;
+}
+
+/* 底部提示 */
+.footer-tip.center .van-notice-bar__wrap {
+  justify-content: center;
+}
+
+/* 底部按钮小字 */
+.j-button-confirm .sub-text {
+  font-size: .2rem;
+  margin-top: .04rem;
+}
+
+/* empty */
+.key-empty {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  width: 100%;
+}
+.key-empty .empty-img-container {
+  padding: .5rem;
+  width: 3.2rem;
+  height: 3.2rem;
+}
+.key-empty .empty-img {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+.key-empty .empty-text {
+  margin-top: .24rem;
+  font-size: .28rem;
+  color: #5f5e64;
+  line-height: .4rem;
+}

src/jfw/modules/app/src/web/staticres/jyapp/vipsubscribe/css/keyword-info.css

@@ -0,0 +1,96 @@
+/* 页面公共样式 */
+.card-radius {
+  border-radius: .16rem;
+  box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.05) inset, 16px 0px 0px 0px #ffffff inset; 
+}
+
+/* module公共样式 */
+[class^=module-]:last-of-type {
+  margin-bottom: .16rem;
+}
+[class^=module-]:not(:first-of-type) {
+  margin-top: .16rem;
+}
+[class^=module-].pd {
+  padding: 0 .32rem;
+}
+[class^=module-] .m-header {
+  padding: .2rem 0;
+  height: unset;
+}
+
+/* 自定义样式 */
+.batch-delete {
+  padding: 0;
+}
+.m-h-left {
+  color: #9b9ca3;
+}
+.match-way-list {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.match-way-item {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  padding: .2rem;
+  background-color: #fff;
+}
+.match-way-item:not(:last-of-type) {
+  margin-right: .22rem;
+}
+.match-way-item .m-w-i-title {
+  font-size: .28rem;
+  line-height: .4rem;
+  color: #171826;
+}
+.match-way-item .m-w-i-subinfo {
+  margin-top: .08rem;
+  font-size: .22rem;
+  line-height: .4rem;
+  color: #9b9ca3;
+  text-align: center;
+}
+.match-way-item.active .m-w-i-title {
+  color: #2abed1;
+}
+.match-way-item.active .m-w-i-subinfo {
+  color: #171826;
+}
+  
+.match-way-item.active::after {
+  content: '';
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  width: 0.28rem;
+  height: 0.28rem;
+  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAKySURBVHgB7Zg/aNRQHMd/eXfWP6i9omJBhBOXa0W4bK6ni6Murro76Cgu1kF0aysOjnXTyTopLkEcHM8TxIMOHghFQfBAaUtp8/P9Qt+Rpnm99y+XBO6zXJJ7gc83v+S9XwIwZsyY0jIbdB54UFIuBF/mEfFu6QLUX7drR2qVeUC8RfulChDJT7KAbzbFsdIEaLxt19nBSL4eP16KADJ5ovAB9pMnCh1g9n276VVZgAA12RgGBaURdG4OkycKWYGZoHPHQ1hQGVu4CkSrq6I8UagKkDwgzOmcU5gAojUATXIPkGwNdMk1QFproEtuAYYtUKrkEsCVPDHyAC7liZEGUGkNdBnZQqbaGugykgrotAa6ZF4B3dZAlwpkiElrILg2PQVL/nm4ceYE/N3ahu6/jdRxmd1Cpq0BQfKPZs4O9inApY9fU8dWwTGiNUDD1iApT1AAGU4DDFoDRKPWIE2eePb9l/QcZ7eQ7QIlk7//7Qe8+flHep6TAHnJE9azUFJedfYQ2MgTVgGoNWAT7BPfnBbHnl6sw8mJA3C8WoErpyZhdWNTGsJWntM3XshkrQGJxyFBEk3iQJ7oGVWAWgOG8JxvHkr+93tzK7rycZKVcCTPn2B8px1gpzV4IvufJElWFqJx9LAbeU6IuKg1C+m0BrKrnIaJPLHmhVPKFaDWgMvfUx0vq0QSU3l++yyttPxXQ1dim9ZgeUdMVgljeU4I+JB+961A7KvBVTBEVgkbeURY7F5uvqRtaQVcvruKStw+dxqO8Wn28cqquTyfOtdZOCf2Ux9i1y/eriB59MJWt+X3xLE9C1mR5T0vvB6XJ3ZVIIuvBi5Iu/KCQQWy+mpgCz2w617op8kTUQWy/GpgSB8xfIEMFmTiAs/mxdshfX6te9zjM78pPqyx7eVey++rnPgfnLxxiLvERTEAAAAASUVORK5CYII=) no-repeat;
+  background-size: contain;
+}
+
+.err-tip {
+  padding: .1rem .32rem;
+  font-size: .24rem;
+  color: #fb483d;
+  line-height: .36rem;
+}
+
+.key-textarea {
+  padding: .28rem;
+}
+.van-field__control {
+  font-size: .32rem;
+}
+
+.j-button-group.edit .j-button-cancel {
+  flex: 1;
+}
+.j-button-group.edit .j-button-confirm {
+  flex: 3;
+}
+

src/jfw/modules/app/src/web/staticres/jyapp/vipsubscribe/image/icon-write.svg

@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.9457 3.13785C14.2064 2.87757 14.2066 2.45511 13.9461 2.19459C13.6859 1.93441 13.2642 1.93421 13.0038 2.19414L6.86283 8.32335C6.60206 8.58363 6.60185 9.00609 6.86238 9.26661C7.12255 9.52679 7.54431 9.52699 7.80474 9.26706L13.9457 3.13785ZM4 1.99978H8.66667C9.03486 1.99978 9.33333 2.29825 9.33333 2.66644C9.33333 3.03463 9.03486 3.33311 8.66667 3.33311H4C3.63181 3.33311 3.33333 3.63159 3.33333 3.99978V11.9998C3.33333 12.368 3.63181 12.6664 4 12.6664H12C12.3682 12.6664 12.6667 12.368 12.6667 11.9998V7.33311C12.6667 6.96492 12.9651 6.66644 13.3333 6.66644C13.7015 6.66644 14 6.96492 14 7.33311V11.9998C14 13.1043 13.1046 13.9998 12 13.9998H4C2.89543 13.9998 2 13.1043 2 11.9998V3.99978C2 2.89521 2.89543 1.99978 4 1.99978Z" fill="#2ABED1"/>
+</svg>

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

@@ -1,360 +0,0 @@
-/* 全局变量 */
-var SessionData = JSON.parse(sessionStorage.a_items || false);
-var SessionPageData = {
-    appendkey: [],
-    notkey: [],
-    key: ['']
-}
-try {
-    var tempData = SessionData[sessionStorage.classify_index]['a_key'][sessionStorage.kws_index]
-    if (tempData) {
-        SessionPageData = tempData
-    }
-} catch (e) {
-    SessionPageData = {
-        appendkey: [],
-        notkey: [],
-        key: ['']
-    }
-}
-var KeyData = {
-    includeKeys: [],
-    excludeKeys: [],
-    keyStr: ''
-}
-var beforeInput = {
-    status: null,
-    index: null,
-    include: '',
-    exclude: ''
-}
-/* 回显数据 */
-function echoPageData(data) {
-    KeyData = {
-        includeKeys: data.appendkey || [],
-        excludeKeys: data.notkey || [],
-        keyStr: data.key ? data.key.join(' ') : ''
-    }
-    $("#keyStr").val(KeyData.keyStr)
-    if (KeyData.keyStr !== '') {
-        $(".jy__btn_delete").show()
-        $(".submitButton").removeClass('disabled')
-    } else {
-        $(".jy__btn_delete").remove()
-    }
-    KeyData.excludeKeys.forEach(function (v) {
-        prependKeyDom(false, v)
-    })
-    KeyData.includeKeys.forEach(function (v) {
-        prependKeyDom(true, v)
-    })
-}
-
-/* 保存数据 */
-function savePageData(actionType) {
-    //  SK：保存关键词； DK：删除关键词； SC：保存分类
-    weui.loading()
-    var params = {
-        pageType: "keyWords",
-        classify_index: sessionStorage.classify_index,
-        classify_name: sessionStorage.classify_name,
-        kws_index: sessionStorage.kws_index,
-        kws_name: KeyData.keyStr,
-        actionType: actionType,
-        addition_kws: KeyData.includeKeys,
-        not_kws: KeyData.excludeKeys,
-        kwscount: sessionStorage.kws_count
-    }
-    if (actionType === 'DK') {
-        params.kws_name = SessionPageData.key.join(' ')
-    }
-    var result = false
-    $.ajax({
-        type: "POST",
-        url: "/subscribepay/afterPay/setUserInfo",
-        data: params,
-        dataType: "json",
-        async: false,
-        traditional: true,
-        success: function (r) {
-            result = r
-        }
-    })
-    if (result.flag) {
-        sessionStorage.setItem('addition_kws', JSON.stringify(KeyData.includeKeys))
-        sessionStorage.setItem('not_kws', JSON.stringify(KeyData.excludeKeys))
-    }
-    weui.loading().hide()
-    return result
-}
-
-/* 删除提示 */
-function deleteKeys() {
-    weui.confirm('删除后将无法恢复，确定删除？', {
-        title: '删除关键词',
-        isAndroid: false,
-        buttons: [{
-            label: '取消',
-            type: 'default',
-            onClick: function () {
-            }
-        }, {
-            label: '确定',
-            type: 'primary',
-            onClick: function () {
-                var temp = savePageData('DK')
-                if (temp.flag) {
-                    weui.toast('删除成功', {
-                        duration: 2000,
-                        className: 'custom-toast',
-                        callback: function () {
-                            window.history.go(-1)
-                        }
-                    });
-                } else {
-                    wToast('无法删除或已被删除')
-                }
-            }
-        }]
-    });
-}
-
-function openDialog(name, e) {
-    e && e.stopPropagation()
-    $("div[data-dialog='" + name + "']").toggle()
-}
-
-/* 附加词、排除词插入Dom */
-function prependKeyDom(status, value) {
-    var ac = (status ? '附加' : '排除') + '词'
-    var bc = '输入' + (status ? '' : '不') + '希望接收的关键词（选填）'
-    var inDom = $("#" + (status ? 'include' : 'exclude'))
-    var templateHtml = "<div class=\"input-box\"><span>" + ac + "</span><input readonly value=\"" + value + "\" type=\"text\" placeholder=\"" + bc + "\"/><i  class=\"addImg\"></i></div>";
-    var nextStatus = inDom.children(':last-child').children('input').length ? inDom.children(':last-child').children('input').val().trim().length > 0 : true
-    if (nextStatus) {
-        inDom.append(templateHtml)
-    }
-    // inDom.children(':last-child').children('input').focus()
-}
-
-/* 切换输入框 */
-function showInputBox(_ref) {
-    var _ref$status = _ref.status,
-        status = _ref$status === void 0 ? true : _ref$status,
-        _ref$value = _ref.value,
-        value = _ref$value === void 0 ? '' : _ref$value,
-        _ref$text = _ref.text,
-        text = _ref$text === void 0 ? '添加' : _ref$text,
-        _ref$index = _ref.index,
-        index = _ref$index === void 0 ? null : _ref$index;
-    beforeInput.status = status
-    beforeInput.index = index
-    $(".select-input").addClass((status ? 'left' : 'right') + '-run')
-    var tempIDom = $(".select-input .input-box" + (status ? ':first-child input' : '.right-box input'))
-    tempIDom.val(value).focus().next().text(text)
-    // ios部分机型不显示光标
-    var iosInfo = navigator.userAgent.toLowerCase();
-    var ver= iosInfo.match(/cpu iphone os (.*?) like mac os/);
-    try {
-        if(ver){
-            var tempV = ver[1].split('_')[0]
-            if (tempV >= 11 && tempV <= 12) {
-                setTimeout(function(){
-                    tempIDom.val(value + ' ').focus()
-                }, 300)
-                setTimeout(function(){
-                    tempIDom.val(value).focus()
-                }, 600)
-            }
-        }
-    }catch (e) {
-        console.log('no ios')
-    }
-}
-
-function addInput(status) {
-    showInputBox({
-        status: status,
-        value: beforeInput[status ? 'include' : 'exclude']
-    })
-}
-
-/* toast */
-function wToast (text) {
-    return weui.toast(text, {
-        duration: 2000,
-        className: 'custom-toast'
-    })
-}
-
-/* 改变按钮状态 */
-function changeInputStatus (status, dom) {
-    if (status) {
-        dom.addClass('error')
-    } else {
-        dom.removeClass('error')
-        $('.addButton').removeClass('disabled')
-    }
-}
-
-/* 初始化事件监听 */
-$(function () {
-    /* 获取窗口滚动条高度 */
-    function getScrollTop() {
-        var scrollTop = 0;
-        if (document.documentElement && document.documentElement.scrollTop) {
-            scrollTop = document.documentElement.scrollTop;
-        } else if (document.body) {
-            scrollTop = document.body.scrollTop;
-        }
-        return scrollTop;
-    };
-    $(".select-input input").on('blur', function () {
-        $(".fixed-bottom").show()
-    }).on('focus', function () {
-        $(".fixed-bottom").hide()
-    })
-
-    var oldScrollTop = getScrollTop() || 0
-    document.body.addEventListener('focusout', function () {
-        var ua = window.navigator.userAgent
-        if (ua.indexOf('iPhone') > 0 || ua.indexOf('iPad') > 0) {
-            document.body.scrollTop = oldScrollTop;
-            document.documentElement.scrollTop = oldScrollTop
-        }
-    })
-
-    // 输入框事件
-    $(".select-input .input-box").on('input', 'input', function () {
-        // $(this)[0].scrollIntoView({block: "center"})
-        var nowInput = $(this).val().trim()
-        var aDom = $(this).next()
-        var nowText = aDom.text()
-        if (nowText === '添加') {
-            beforeInput[beforeInput.status ? 'include' : 'exclude'] = nowInput
-        }
-        if (nowInput.length) {
-            aDom.removeClass('disabled')
-        } else {
-            aDom.addClass('disabled')
-        }
-    })
-    $(".select-input .input-box").on('blur', 'input', function () {
-        $(".add-key-word .content-box").removeClass('disabled')
-        $(this).parents('.select-input').removeClass('right-run').removeClass('left-run')
-    })
-    $(".select-input .input-box").on('focus', 'input', function () {
-        $(".add-key-word .content-box").addClass('disabled')
-    })
-    $("#keyStr").on('input', function (e) {
-        var nowInput = $(this).val().trim()
-        KeyData.keyStr = nowInput
-        if (nowInput.length) {
-            $('.submitButton').removeClass('disabled')
-        } else {
-            $('.submitButton').addClass('disabled')
-        }
-    })
-
-    // $("input").on('input', function () {
-    //     $(this).val($(this).val().slice(0, 20))
-    // })
-    $("input").attr('maxlength', '20')
-    $(".input-group").on('click', 'input', function (e) {
-        var nowType = $(this).parents('.input-group').attr('id') === 'include'
-        var nowInput = $(this).val().trim()
-        var nowIndex = $(this).parents('.input-box').index()
-        var nowInputStatus = $(".add-key-word .content-box").hasClass('disabled')
-        if (nowInputStatus) {
-            e.stopPropagation()
-        } else {
-            showInputBox({
-                status: nowType,
-                value: nowInput,
-                index: nowIndex,
-                text: '修改'
-            })
-        }
-    })
-    // $(".select-input .input-box").on('blur', 'input', function () {
-    //     var nowIndex = $(this).parents('.input-box').index()
-    //     var nowType = $(this).parents('.input-group').attr('id') === 'include'
-    //     var nowInput = $(this).val().trim()
-    //     var nowArr = KeyData[(nowType ? 'in' : 'ex') + 'cludeKeys']
-    //     if (nowInput.length) {
-    //         $(this).next().show()
-    //     } else {
-    //         $(this).next().hide()
-    //     }
-    //     if (nowArr.indexOf(nowInput) !== -1) {
-    //         $(this).css('color', '#fb483d')
-    //     } else {
-    //         $(this).css('color', '#171826')
-    //     }
-    //     nowArr.splice(nowIndex, 1, nowInput)
-    // })
-    // 按钮事件
-    // 按钮事件
-    $(".select-input .input-box a").on('click', function () {
-        $('.fixed-bottom').show()
-        setTimeout(function() {
-            $('.fixed-bottom').show()
-        }, 300)
-        // $(this)[0].scrollIntoView({block: "center"})
-        var nowInput = $(this).prev().val().trim()
-        var nowType = !$(this).parents('.input-box').hasClass('right-box')
-        var nowArr = KeyData[(nowType ? 'in' : 'ex') + 'cludeKeys']
-        var canPush = nowArr.indexOf(nowInput)
-        if (!nowInput.length) {
-            return
-        }
-        if (nowInput.length > 20) {
-            return wToast('每组'+(nowType ? '附加' : '排除')+'词不能超过20个字符')
-        }
-        if (canPush !== -1 && canPush !== beforeInput.index) {
-            return wToast('您设置的'+(nowType ? '附加' : '排除')+'词已存在，请调整后再添加。')
-        }
-        if (beforeInput.index !== null) {
-            $("#" + (nowType ? 'include' : 'exclude')).find('.input-box').eq(beforeInput.index).children('input').val(nowInput)
-            nowArr.splice(beforeInput.index, 1, nowInput)
-        } else {
-            prependKeyDom(nowType, nowInput)
-            nowArr.push(nowInput)
-        }
-        beforeInput.exclude = ''
-        beforeInput.include = ''
-    })
-    $(".submitButton").on('click', function () {
-        var canSub = $(this).hasClass('disabled')
-        if (!canSub) {
-            var kws_arr = JSON.parse(sessionStorage.getItem('kws_arr') || [])
-            if (kws_arr.indexOf(KeyData.keyStr) !== -1 && SessionPageData.key.join(' ') !== KeyData.keyStr) {
-                return wToast('您设置的关键词已存在，请调整后再添加。')
-            }
-            if (KeyData.keyStr.length > 20) {
-                return wToast('关键词不能超过20个字符')
-            }
-            var temp = savePageData('SK')
-            if (temp.flag) {
-                weui.toast('保存成功', {
-                    duration: 1000,
-                    className: 'custom-toast',
-                    callback: function () {
-                        window.history.go(-1)
-                    }
-                });
-            } else {
-                wToast('保存出错，稍后再试')
-            }
-
-        }
-    })
-    $(".input-group").on('click', '.addImg', function () {
-        var tempDom = $(this).parents('.input-box')
-        var nowType = $(this).parents('.input-group').attr('id') === 'include'
-        var nowArr = KeyData[(nowType ? 'in' : 'ex') + 'cludeKeys']
-        nowArr.splice(tempDom.index(), 1)
-        tempDom.remove()
-    })
-})
-echoPageData(SessionPageData)

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

@@ -1,188 +0,0 @@
-$(function(){
-
-    $('.knowBtn').on('click',function(){
-        $(".problemPop").hide()
-    })
-    $(".problem").on('click',function(){
-        $(".problemPop").css("display",'flex');
-    })
-
-    function hasWords () {
-        var showKeyWordLength = $(".showKeyWord ul").find('li').length;
-        if(showKeyWordLength === 0){
-            $(".addkeyWord").show();
-            $('.addKeyWord').hide();
-        } else {
-            $(".addkeyWord").hide();
-            $('.addKeyWord').show();
-        }
-    }
-    hasWords()
-    
-    // 添加按钮
-    $(".addKeyWord i").on('click',function(){
-        $(".addkeyWord").show();
-        $(".addKeyWord").hide();
-        $(".addkeyWord input").focus();
-        $('.showKeyWord').find('.one').show();
-        $('.showKeyWord').find('.modify').hide();
-    })
-    // 输入框自适应高度
-    $('textarea').each(function(i,dom){
-        // console.log(i,dom)
-        dom.style.height = dom.scrollHeight +'px';
-    })
-    $("textarea").on("input", function() {
-        this.style.height = 'auto';
-        this.style.height = this.scrollHeight + "px";
-    })
-    // 添加keyWords检查输入框内是否有文字，如果有才能点击添加按钮
-    $('.addkeyWord input.enterOne').on('input', function() {
-        var buttonDOM = $(this).siblings().find('button')[1]
-        if ($.trim($(this).val()).length >= 1) {
-            buttonDOM.style.opacity = 1
-            buttonDOM.removeAttribute("disabled")
-        } else {
-            buttonDOM.style.opacity = .5
-            buttonDOM.setAttribute("disabled", true)
-        }
-    })
-    
-    // 添加 按钮的点击事件
-    $('.addkeyWord .btn button:nth-child(2)').on('click', function(){
-        var timestamp = new Date().getTime();//动态生成不同的id，因为id唯一不能重复，所以 用时间戳 代替  防止重复
-        var keyWord = $.trim($('.addkeyWord input.enterOne').val()).replace(/\s+/g,' ');
-		if(keyWord==""&&keyWord.length==0){
-            weui.toast('附加词不能为空', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-			return
-		}
-		_addindex = 0;
-		if($(".showKeyWord li").length>0){
-        	_addindex =  Number($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex")) + Number(1);
-		}
-		if(addkws_arr[keyWord]!=undefined){
-            weui.toast('您设置的附加词已存在，请调整后再添加。', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-			return
-		}
-        //保存新附加词
-        _addkws = keyWord;
-        saveSession("",_addindex);
-        var html = `<li>
-                        <div class="one">
-                            <div>
-                                <span>
-                                    <p class="key">${ keyWord }</p>
-                                </span>
-                            </div>
-                            <button class="editKeyWord" dataindex="`+_addindex+`"><i class="iconfont icon-xiugai"></i> 修改</button>
-                        </div>
-                        <div class="modify">
-                            <textarea  name=""  rows="1"  placeholder="" maxlength="20">${ keyWord}</textarea>
-                            <button class="deleteKey">删除</button>
-                            <button class="ascertainKey">确定</button>
-                        </div>
-                    </li>`
-        $('.showKeyWord > ul').prepend(html)
-        // 隐藏
-        $(".addkeyWord").hide();
-        $('.showKeyWord').show();
-        $('.addKeyWord').show();
-        $('.enter.addkeyWord > input').val('')
-        var buttonDOM = $('.enter.addkeyWord .btn button')[1]
-        buttonDOM.style.opacity = .5
-        buttonDOM.setAttribute("disabled", true)
-
-    })
-
-    // 编辑
-    $(".showKeyWord").on('click', '.editKeyWord',function(e){
-        _addindex = Number($(this).attr("dataindex"));
-        $('.enter.addkeyWord').hide()
-        $('.addKeyWord').hide()
-
-        let oSpan = $(this).parent().siblings().children('textarea');
-        let val = $(oSpan).val()
-        $(this).parent().siblings().show().parents('li').siblings().children('.modify').hide().siblings('.one').show()
-        $(oSpan).val('').focus().val(val) 
-        $(this).parent().hide()
-        $(this).parent().siblings().css('display','block')
-    })
-
-    // 编辑 删除
-    $('.showKeyWord').on('click', '.deleteKey', function(e) {
-        var jQueryDOM = $(this).parents('li');
-        _addkws = $.trim($(this).siblings('textarea').val());
-		var _index =  $('.showKeyWord li').length - $(this).parent().parent("li").index() -1;
-        weui.confirm('确定要删除附加词？', {
-            buttons: [{
-                label: '取消',
-                type: 'default',
-                onClick: function () { console.log('不删了') }
-            }, {
-                label: '确定',
-                type: 'primary',
-                onClick: function () {
-                    jQueryDOM.remove();
-                    hasWords();
-                    saveSession("D",_addindex,_index);
-                }
-            }]
-        });
-    })
-    // 编辑 确定
-    $('.showKeyWord').on('click', '.ascertainKey', function(e) {
-        var keyWord = $.trim($(this).siblings('textarea').val());
-		var _index =  $('.showKeyWord li').length - $(this).parent().parent("li").index() -1;
-		if(keyWord.length==0){
-            weui.toast('附加词不能为空', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-		}else if(keyWord.length > 20){
-            weui.toast('每组附加词不能超过20字', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-        }else{
-			if(addkws_arr[keyWord]!=undefined&&addkws_arr[keyWord]!=_addindex){
-	            weui.toast('您设置的附加词已存在，请调整后再添加。', {
-	                duration: 2000,
-	                className: 'custom-toast',
-	                callback: function () { console.log('close') }
-	            });
-				return
-			}
-        	$('.addKeyWord').show()
-            _addkws = keyWord;
-            saveSession("",_addindex,_index);
-            $(this).parent().siblings().find('.key').text(keyWord)
-            $(this).parent().hide().siblings().show()
-        }
-    })
-
-    
-    //防止键盘把当前输入框给挡住
-    var u = navigator.userAgent;
-	var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
-	var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
-	if(isAndroid){
-		//防止键盘把当前输入框给挡住
-	    window.addEventListener('resize', function () {
-	    　　	if (document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA') {
-	        　　		window.setTimeout(function () {
-	　　　　　　　　　	document.activeElement.scrollIntoViewIfNeeded();
-	            }, 0);
-	        }
-	    })
-	}
-})

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

@@ -1,202 +0,0 @@
-$(function(){
-
-    $('.knowBtn').on('click',function(){
-        $(".problemPop").hide()
-    })
-    $(".problem").on('click',function(){
-        $(".problemPop").css("display",'flex');
-    })
-
-    function hasWords () {
-        var showKeyWordLength = $(".showKeyWord ul").find('li').length;
-        if(showKeyWordLength === 0){
-            $(".addkeyWord").show();
-            $('.addKeyWord').hide();
-        } else {
-            $(".addkeyWord").hide();
-            $('.addKeyWord').show();
-        }
-    }
-    hasWords()
-    
-    // 添加按钮
-    $(".addKeyWord i").on('click',function(){
-        $(".addkeyWord").show()
-        $(".addKeyWord").hide();
-        $(".addkeyWord input").focus()
-        $('.showKeyWord').find('.one').show()
-        $('.showKeyWord').find('.modify').hide()
-    })
-
-    // 添加keyWords检查输入框内是否有文字，如果有才能点击添加按钮
-    $('.addkeyWord input.enterOne').on('input', function() {
-        if ($(this).val().length >= 100) {
-            var s = $(this).val().slice(0,100)
-            $(this).val(s)
-
-            weui.toast('排除词不能超过100字', {
-                duration: 2000,
-                className: 'text-overflow100',
-                callback: function(){ console.log('close') }
-            });
-            return
-        }
-
-        var buttonDOM = $(this).siblings().find('button')[1]
-        if ($.trim($(this).val()).length >= 1) {
-            buttonDOM.style.opacity = 1
-            buttonDOM.removeAttribute("disabled")
-        } else {
-            buttonDOM.style.opacity = .5
-            buttonDOM.setAttribute("disabled", true)
-        }
-    })
-    // 输入框自适应高度
-    $('textarea').each(function(i,dom){
-        // console.log(i,dom)
-        dom.style.height = dom.scrollHeight +'px';
-    })
-    $("textarea").on("input", function() {
-        this.style.height = 'auto';
-        this.style.height = this.scrollHeight + "px";
-    })
-    // 添加 按钮的点击事件
-   
-    $('.addkeyWord .btn button:nth-child(2)').on('click', function(){
-        var keyWord = $.trim($('.addkeyWord input.enterOne').val()).replace(/\s+/g,' ');
-		if (keyWord==""){
-            weui.toast('排除词不能为空', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-			return
-		}
-		_notindex = 0;
-		if($(".showKeyWord li").length>0){
-        	_notindex = Number($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex")) + Number(1);
-		}
-        //保存新附加词
-        _notkws = keyWord;
-		if(notkws_arr[keyWord]!=undefined){
-            weui.toast('您设置的排除词已存在，请调整后再添加。', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-			return
-		}
-        saveSession("",_notindex);
-        var html = `<li>
-                        <div class="one">
-                            <div>
-                                <span>
-                                    <p class="key">${ keyWord }</p>
-                                </span>
-                            </div>
-                            <button class="editKeyWord" dataindex="`+_notindex+`"><i class="iconfont icon-xiugai"></i> 修改</button>
-                        </div>
-                        <div class="modify">
-                            <textarea  name=""  rows="1"  placeholder="">${ keyWord}</textarea>
-                            <button class="deleteKey">删除</button>
-                            <button class="ascertainKey">确定</button>
-                        </div>
-                    </li>`
-        $('.showKeyWord > ul').prepend(html)
-        
-        // 隐藏
-        $(".addkeyWord").hide();
-        $('.showKeyWord').show();
-        $('.addKeyWord').show();
-        $('.enter.addkeyWord > input').val('')
-        var buttonDOM = $('.enter.addkeyWord .btn button')[1]
-        buttonDOM.style.opacity = .5
-        buttonDOM.setAttribute("disabled", true)
-
-    })
-
-    // 编辑
-    $(".showKeyWord").on('click', '.editKeyWord', function(e){
-        _notindex = Number($(this).attr("dataindex"));
-        $('.enter.addkeyWord').hide()
-        $('.addKeyWord').hide()
-
-        let oSpan = $(this).parent().siblings().children('textarea');
-        let val = $(oSpan).val()
-        $(this).parent().hide()
-        $(this).parent().siblings().show().parents('li').siblings().children('.modify').hide().siblings('.one').show()
-        $(oSpan).val('').focus().val(val) 
-    })
-
-    // 编辑 删除
-    $('.showKeyWord').on('click', '.deleteKey', function(e) {
-        var jQueryDOM = $(this).parents('li');
-        _notkws = $.trim($(this).siblings('textarea').val());
-		var _index =  $('.showKeyWord li').length - $(this).parent().parent("li").index() -1;
-        weui.confirm('确定要删除排除词？', {
-            buttons: [{
-                label: '取消',
-                type: 'default',
-                onClick: function () { console.log('不删了') }
-            }, {
-                label: '确定',
-                type: 'primary',
-                onClick: function () {
-                    jQueryDOM.remove()
-                    hasWords()
-                    saveSession("D",_notindex,_index);
-                }
-            }]
-        });
-        console.log('删除排除词:',$(this).parent().find('span').text())
-    })
-    // 编辑 确定
-    $('.showKeyWord').on('click', '.ascertainKey', function(e) {
-        var $this = $(this);
-        var keyWord = $.trim($(this).siblings('textarea').val());
-		var _index =  $('.showKeyWord li').length - $(this).parent().parent("li").index() -1;
-		if(keyWord.length ==0){
-            weui.toast('排除词不能为空', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-        }else if(keyWord.length > 20){
-            weui.toast('每组排除词不能超过20字', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-        }else{
-			if(notkws_arr[keyWord]!=undefined&&notkws_arr[keyWord]!=_notindex){
-	            weui.toast('您设置的排除词已存在，请调整后再添加。', {
-	                duration: 2000,
-	                className: 'custom-toast',
-	                callback: function () { console.log('close') }
-	            });
-				return
-			}
-            $this.parent().siblings().find('.key').text(keyWord);
-            $this.parent().hide().siblings().show();
-            $('.addKeyWord').show();
-            _notkws = keyWord;
-            saveSession("",_notindex,_index);
-        }
-    })
-
-    
-    //防止键盘把当前输入框给挡住
-    var u = navigator.userAgent;
-	var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
-	var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
-	if(isAndroid){
-		//防止键盘把当前输入框给挡住
-	    window.addEventListener('resize', function () {
-	    　　	if (document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA') {
-	        　　		window.setTimeout(function () {
-	　　　　　　　　　	document.activeElement.scrollIntoViewIfNeeded();
-	            }, 0);
-	        }
-	    })
-	}
-})

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

@@ -1,341 +1,407 @@
+var vm = new Vue({
+  delimiters: ['${', '}'],
+  el: '.app-layout-content-b',
+  data: {
+    conf: {
+      keywordMax: 300
+    },
+    batchDeleteState: false, // 是否在批量删除状态
+    userData: {}, // getUserInfo接口用户原始数据
+    keywordsGroupList: [], // 所有关键词列表
+    groupNameList: [], // 关键词分类名称列表
+    // 当前信息
+    filter: {
+      loaded: false, // 是否请求加载完成
+      pickerShow: false, //picker是否显示
+      groupName: '', // 为空表示全部
+      allKeywordsList: [],  // 筛选前的数组
+      keywordsList: [], // 筛选后的数组
+    },
+    dialog: {
+      fastImport: false, // 快速导入弹框
+      upgrade: false // 关键词升级提示弹框
+    },
+    tip: {
+      fastImport: true
+    }
+  },
+  computed: {
+    fastImportTipShow: function () {
+      return this.filter.allKeywordsList.length === 0 && this.filter.loaded && this.tip.fastImport
+    },
+    listShow: function () {
+      return this.filter.keywordsList.length !== 0 && this.filter.loaded
+    },
+    emptyShow: function () {
+      return this.filter.keywordsList.length === 0 && this.filter.loaded
+    },
+    selectedCount: function () {
+      var selectedArr = this.getSelectedArr()
+      return selectedArr.length
+    }
+  },
+  created: function () {
+    this.getKeywordsGroupList(true)
+  },
+  mounted: function () {},
+  methods: {
+    showLoading: function () {
+      return this.$toast.loading({
+        duration: 0,
+        forbidClick: true,
+        message: 'loading...',
+      })
+    },
+    showToast: function (message) {
+      return this.$toast({
+        duration: 1500,
+        forbidClick: true,
+        message: message,
+      })
+    },
+    showDialog: function (conf) {
+      var defaultConf = {
+        title: '提示',
+        message: 'message',
+        className: 'j-confirm-dialog',
+        showConfirmButton: true,
+        showCancelButton: true,
+        confirmButtonColor: '#2abed1'
+      }
+      if (conf) {
+        Object.assign(defaultConf, conf)
+      }
+      return this.$dialog.confirm(defaultConf)
+    },
+    // 对象转form
+    qsStringify: function (t) {
+      var arr = []
+      for (var k in t) {
+        arr.push(`${k}=${t[k]}`)
+      }
+      return arr.join('&')
+    },
+    getKeywordsGroupList: function (needLoading) {
+      var _this = this
+      if (needLoading)  {
+        var loading = this.showLoading()
+      }
+      $.ajax({
+        type: 'POST',
+        url: '/subscribepay/afterPay/getUserInfo?t=' + Date.now(),
+        success: function (res) {
+          if (needLoading) {
+            loading && loading.clear()
+          }
+          if (res && res.userData) {
+            _this.userData = res.userData
+            if (res.userData && res.userData.o_vipjy) {
+              // 整理数据
+              var groupList = _this.addInfoToKeyItem(res.userData.o_vipjy.a_items)
+              var groupNameList = _this.getGroupNameList(groupList)
+              _this.keywordsGroupList = groupList
+              _this.groupNameList = groupNameList
+              _this.doFilter(_this.filter.groupName)
+              _this.filter.allKeywordsList = _this.filterKeywordsList()
+            }
+          }
+        },
+        error: function () {
+          if (needLoading) {
+            loading && loading.clear()
+          }
+        },
+        complete: function () {
+          _this.filter.loaded = true
+        }
+      })
+    },
+    // 向关键词中添加一些信息
+    addInfoToKeyItem: function (groupList) {
+      if (!Array.isArray(groupList)) return []
 
-var reloadFunc = function(){
-
-    //去空格方法
-    // String.prototype.trim = function () {
-    //     return this.replace(/(^\s*)|(\s*$)/g, ' ');
-    // }
-
-    // 疑问解答相关操作
-    $('.knowBtn').on('click', function () {
-        $(".problemPop").hide()
-    })
-    $(".problem").on('click', function () {
-        $(".problemPop").css("display", 'flex');
-    })
-
-    $(".enterOne").focus(function () {
-        $(".btnChoose").show();
-    })
+      groupList.forEach(function (keywordsList, index) {
+        if (Array.isArray(keywordsList.a_key)) {
+          keywordsList.a_key.forEach(function (keyword, iindex) {
+            // 添加一些其他信息
+            keyword.groupName = keywordsList.s_item // 分类名
+            keyword.groupIndex = index // 该关键词所在分类 在分类列表中的索引
+            keyword.keyIndex = iindex // 该关键词在其所在分类中的索引
+          })
+        }
+      })
 
-    // 输入框自适应高度
-    $('textarea').each(function(i,dom){
-        dom.style.height = dom.scrollHeight +'px';
-    })
-    $("textarea").on("input", function() {
-        this.style.height = 'auto';
-        this.style.height = this.scrollHeight + "px";
-    })
+      return groupList
+    },
+    getGroupNameList: function (keywordsGroupList) {
+      var groupNameList = []
+      if (!Array.isArray(keywordsGroupList)) return groupNameList
+      keywordsGroupList.forEach(function (item, index) {
+        var count = Array.isArray(item.a_key) ? item.a_key.length : 0
+        groupNameList.push({
+          name: item.s_item, // 分类名
+          count: count // 分类下有多少个关键词
+        })
+      })
+      return groupNameList
+    },
+    calcKeyInfo: function (item) {
+      // 匹配方式 item.matchway 0/null精准 1模糊
+      var key = item.key
+      var notkey = []
+      if (Array.isArray(item.appendkey)) {
+        key = key.concat(item.appendkey)
+      }
+      if (Array.isArray(item.notkey)) {
+        notkey = item.notkey
+      }
 
-    // 添加keyWords检查输入框内是否有文字，如果有才能点击添加按钮
-    $('.content .addkeyWord input.enterOne').on('input', function () {
-        var buttonDOM = $(this).siblings()[1].children[1]
-        if ($.trim($(this).val()).length >= 1) {
-            buttonDOM.style.opacity = 1
-            buttonDOM.removeAttribute("disabled")
+      return {
+        key: key.join(' '),
+        notkey: notkey.join(' '),
+        matchWay: item.matchway == 1 ? '模糊' : '精准',
+        matchWayClass: item.matchway == 1 ? 'tag-orange' : 'tag-green'
+      }
+    },
+    showFilterPicker: function (f) {
+      this.filter.pickerShow = f
+    },
+    checkThisGroup: function (item) {
+      var groupName = ''
+      if (item) {
+        groupName = item.name
+      } else {
+        groupName = ''
+      }
+      this.doFilter(groupName)
+      this.showFilterPicker(false)
+    },
+    doFilter: function (groupName) {
+      this.filter.groupName = groupName
+      var rList = this.filterKeywordsList(groupName)
+      this.filter.keywordsList = rList
+    },
+    // 筛选分类列表
+    filterKeywordsList: function (filterName) {
+      var list = []
+      // 筛选关键词
+      this.keywordsGroupList.forEach(function (keywordsList) {
+        if (Array.isArray(keywordsList.a_key)) {
+          keywordsList.a_key.forEach(function (keyword) {
+            // 筛选全部(筛选词为空)，需要把关键词所属分类信息记录
+            if (!filterName) {
+              list.push(keyword)
+            } else {
+              if (filterName === keywordsList.s_item) {
+                list.push(keyword)
+              }
+            }
+          })
+        }
+      })
+      // 给新的list添加checked
+      list = JSON.parse(JSON.stringify(list))
+      list.forEach(function (item) {
+        item.checked = false
+        item.calcInfo = this.calcKeyInfo(item)
+      }.bind(this))
+      return list
+    },
+    clickKeyCard: function (item) {
+      if (this.batchDeleteState) {
+        // 执行点击选中逻辑
+        // 如果关键词组下有关键词，则不能点击
+        item.checked = !item.checked
+      } else {
+        // type: edit编辑、add新增
+        // gIndex: groupIndex 该关键词所在分类 在分类列表中的索引
+        // kIndex: keyIndex 该关键词在其所在分类中的索引
+        location.href = `/jyapp/vipsubscribe/toSetInfoPage?type=edit&gIndex=${item.groupIndex}&kIndex=${item.keyIndex}`
+      }
+    },
+    batchDeleteStateChange: function () {
+      this.batchDeleteState = !this.batchDeleteState
+    },
+    batchDelete: function () {
+      var _this = this
+      if (this.selectedCount <= 0) return
+      this.showDialog({
+        title: '',
+        message: '确定删除所选' + this.selectedCount + '个关键词吗？',
+        className: 'j-confirm-dialog text-center',
+      }).then(function () {
+        console.log('确认批量删除关键词')
+        _this.batchDeleteConfirmed()
+      })
+      .catch(function() {
+        console.log('取消批量删除关键词')
+      })
+    },
+    getSelectedArr: function () {
+      var selectedArr = []
+      this.filter.keywordsList.forEach(function (item) {
+        if (item.checked) {
+          selectedArr.push(item)
+        }
+      })
+      return selectedArr
+    },
+    getDeleteKey: function () {
+      var deleteKeyArr = {}
+      var deleteKey = {}
+      var selectedArr = this.getSelectedArr()
+      selectedArr.forEach(function (item) {
+        var groupIndex = item.groupIndex
+        var keyIndex = item.keyIndex
+        if (deleteKeyArr[groupIndex]) {
+          deleteKeyArr[groupIndex].push(keyIndex)
         } else {
-            buttonDOM.style.opacity = .5
-            buttonDOM.setAttribute("disabled", true)
+          deleteKeyArr[groupIndex] = [keyIndex]
         }
-    })
+      })
 
-    // 添加 确认按钮的点击事件
-	var pushHistoryFlag = true;
-    $('.content .addkeyWord .btn button:nth-child(2)').on('click', function () {
-		setTimeout(function(){
-	        var keyWord = $.trim($('.addkeyWord input.enterOne').val());
-			if(keyWord==""){
-				return
-			}
-			if(kws_arr[keyWord]!=undefined){
-	            weui.toast('您设置的关键词已存在，请调整后再添加。', {
-	                duration: 2000,
-	                className: 'custom-toast',
-	                callback: function () { console.log('close') }
-	            });
-				return
-			}
-	        if(kws_name.length > 20){
-	            weui.toast('关键词不能超过20字', {
-	                duration: 2000,
-	                className: 'custom-toast',
-	                callback: function () { console.log('close') }
-	            });
-	        }
-	        kws_name = keyWord;
-			kws_index = $(".showKeyWord li").length;
-	        if(kws_index==0){
-	            //分类首次添加关键词需重新获取分类索引
-	            classify_index = a_items.length;
-	        }
-			var _index = 0;
-			if($(".showKeyWord li").length>0){
-	        	_index =  Number($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex")) + Number(1);
-			}
-	        classify_name = $.trim($('.classify-r .classify-detail').text());
-	        //保存关键词
-	        kws_count = parseInt(kws_count) + 1;
-			if(kws_count==1&&pushHistoryFlag){
-				pushHistoryFlag = false;//首次进入页面后，添加第一个关键词时调用，删除首次添加关键词再添加则不会再push历史
-				pushHistory();
-			}
-	        if(kws_count>300){
-	            weui.toast('您设置的关键词已超出最高上限，请调整后再添加。', {
-	                duration: 2000,
-	                className: 'custom-toast',
-	                callback: function () { console.log('close') }
-	            });
-	        }else if (saveData("SK")){
-	            // 设置状态 首次添加关键词
-	            if(a_items.length==0){
-	                setEmptyHistory();
-	            }
-	            //
-	            doSessionData("",_index);
-				setTimeout(function(){
-                	$(".add-keyword-container .addNewKeyword i").show();
-				},300)
-	            //$(".add-keyword-container .addNewKeyword i").show();
-	            //点击保存关键词，查看缓存中存的附加词 和排除词。
-	            $(".kws_count").text(kws_count);
-	            var html = `<li><div class="one"><div>
-	                            <span>
-	                                <strong> 关键词：</strong>
-	                                <p class="key">${keyWord}</p>
-	                            </span>`
-	                if (addition_kws.length>0){
-	                    html +='<span>'
-	                                +'<strong> 附加词：</strong>'
-	                                +'<p class="addition" addArr=\''+addition_kws+'\'>'+addition_kws.join(" ")+'</p>'
-	                                +'</span>'
-	                }
-	                if (not_kws.length>0){
-	                    html +='<span>'
-	                                +'<strong> 排除词：</strong>'
-	                                +'<p class="notkey" notArr=\''+not_kws+'\'>'+not_kws.join(" ")+'</p>'
-	                                +'</span>'
-	                }
-	                html +=`</div>
-	                        <button class="editKeyWord" onclick=\"editKeyWord(this)\"  dataIndex=`+_index+`><i class="iconfont icon-xiugai"></i> 修改</button>
-	                        </div>
-	                        <div class="modify">
-	                        <textarea  name=""  rows="1"  placeholder="" maxlength="20" onBlur="window.scrollTo(0, 0)">${keyWord}</textarea>`
-	            if (addition_kws.length>0){
-	                html +=`<button class="addAdjunctWord" onclick="toappendkey(this)">编辑 附加词<i>(`+addition_kws.length+`)</i></button>`
-	            }else{
-	                html +=`<button class="addAdjunctWord" onclick="toappendkey(this)">添加 附加词</button>`
-	            }
-	            if (not_kws.length>0){
-	                html +=`<button class="addExclusion" onclick="tonotkey(this)">编辑 排除词<i>(`+not_kws.length+`)</i></button>`
-	            }else{
-	                html +=`<button class="addExclusion" onclick="tonotkey(this)">添加 排除词</button>`
-	            }
-	                html +=`<button class="deleteKey" onclick="deleteKey(this)">删除</button><button class="ascertainKey" dataIndex=`+_index+` onclick="saveK(this)">确定</button></div></li>`
-	            $('.showKeyWord > ul').prepend(html);
-	            // 添加完成隐藏输入框
-	            $(".enter.addkeyWord").hide();
-	            // 还原状态
-	            $('.enter.addkeyWord > input').val('')
-	            //把kws_name,kws_index,addition_kws,not_kws初始化
-	            kws_index = 0;
-	            kws_name = "";
-	            addition_kws = [];
-	            not_kws = [];
-				//
-	            var buttonDOM = $('.enter.addkeyWord .btn button')[1]
-	            buttonDOM.style.opacity = .5
-	            buttonDOM.setAttribute("disabled", true)
-	            //保存关键词 查看关键词数量 未分类 超过20 100提示
-	            if(classify_name.indexOf("未分类")>-1){
-	                if((kws_tips==1&&$(".showKeyWord li").length>=20)||(kws_tips==20&&$(".showKeyWord li").length>=100)){
-	                    //未分类 20个关键词提示，100个关键词提示
-	                    showMeg();
-	                    var param = {};
-	                    param.classify_index = classify_index;
-	                    if(kws_tips==1){
-	                        param.kws_tips = 20;
-	                    }else if(kws_tips==20){
-	                        param.kws_tips = 100;
-	                    }
-	                    $.post("/subscribepay/afterPay/updateUserTips",param,function(r){
-	                        if(r.flag){
-	                            kws_tips = param.kws_tips;
-	                            $(".classify").attr("tips",kws_tips);
-	                        }
-	                    })
-	                }
-	            }
-	        }
-		},150)
-    })
-//    // 编辑
-//    $(".showKeyWord").on('click', '.editKeyWord', function (e) {
-//        kws_name = $.trim($(this).parent().find('.key').text());
-//        //当前关键词数组的位置 是数组的总长度-当前所在的位置-1 数组正序索引
-//        kws_index = $('.showKeyWord li').length - $(this).parent().parent("li").index() -1;
-//        if($(this).prev('div').find(".addition").text()!=""){
-//			addition_kws = $(this).prev('div').find(".addition").attr("addArr").split(",")
-//        }else{
-//            addition_kws = []
-//        }
-//        if ($(this).prev('div').find(".notkey").text()!=""){
-//            not_kws = $(this).prev('div').find(".notkey").attr("notArr").split(",")
-//        }else{
-//            not_kws = []
-//        }
-//        $('.enter.addkeyWord').hide()
-//        let oSpan = $(this).parent().siblings().children('textarea');
-//        let val =  $.trim($(oSpan).val());
-//        $(this).parent().hide()
-//        $(this).parent().siblings().show().parent().siblings().children('.modify').hide().siblings('.one').show()
-//        $(oSpan).val('').focus().val(val)
-//        $(".add-keyword-container .addNewKeyword i").hide()
-//    })
-
-    // 编辑确定
-    // $('.showKeyWord').on('click', '.ascertainKey', function (e) {
-    //     var $this = $(this)
-    //     var keyWord = $(this).siblings('textarea').val()
-    //     if(keyWord.length > 20){
-    //         weui.toast('关键词不能超过20字', {
-    //             duration: 2000,
-    //             className: 'custom-toast',
-    //             callback: function () { console.log('close') }
-    //         });
-    //     }else{
-    //         $this.parent().siblings().find('.key').text(keyWord)
-    //         $this.parent().hide().siblings().show()
-    //         $('.addKeyWord').show()
-    //     }
-    // })
-
-    //防止键盘把当前输入框给挡住
-    var u = navigator.userAgent;
-	var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
-	var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
-	if(isAndroid){
-		//防止键盘把当前输入框给挡住
-	    window.addEventListener('resize', function () {
-	    　　	if (document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA') {
-	        　　		window.setTimeout(function () {
-	　　　　　　　　　	document.activeElement.scrollIntoViewIfNeeded();
-	            }, 0);
-	        }
-	    })
-	}
-	(/iphone|ipod|ipad/i.test(navigator.appVersion)) && document.addEventListener('blur', (e) => {
-	    // 这里加了个类型判断，因为a等元素也会触发blur事件
-	    ['input', 'textarea'].includes(e.target.localName) && document.body.scrollIntoView(false)
-	}, true)
-
-    // 显示关键词分类弹框
-    $('.classify-r').on('click', function(){
-		modalOne();
-    })
-    // 显示快速导入弹框
-    $('.classify-fast').on('click', 'i', function(){
-        sessionStorage.fastimport = 1
-        $('.classify-fast').hide()
-    })
-    $('.classify-fast').on('click', 'a', function(){
-		modalTwo();
-    })
-    // 关键词分类 - 去设置按钮点击事件
-    $('.classify-fast-pop .dialog__btn_confirm').on('click', function() {
-		$.ajax({
-            type: "POST",
-            url: "/subscribepay/afterPay/fastImport",
-            data: {c_index:classify_index,k_index:$(".showKeyWord li").length,c_name:$(".classify-detail").text()},
-            dataType: "json",
-            async: false,
-            traditional: true,
-            success: function(r){
-				$('.classify-fast-pop').hide();
-                if(r.flagInt==1){
-					sessionStorage.fastimport = r.flagInt;
-					$(".classify-fast").hide();
-					var kwcount = r.kwMap.length;
-					var newCount = parseInt($(".addNewKeyword .kws_count").text())+parseInt(kwcount);
-					$(".kws_count").text(newCount);
-					weui.toast('成功导入'+kwcount+'个关键词', {
-		                duration: 2000,
-		                className: 'custom-toast',
-		                callback: function () { console.log('close') }
-		            });
-					window.location.reload()
-				}else{
-					weui.toast('导入失败', {
-		                duration: 2000,
-		                className: 'custom-toast',
-		                callback: function () { console.log('close') }
-		            });
-				}
-				try{
-					JyObj.checkLab()//刷新搜索首页和订阅首页
-					sessionStorage.reloadHomePage = true;
-					sessionStorage.reloadSubPage = true;
-				}catch(e){}
-            }
-        });
-    })
-    // 关键词分类 - 取消按钮点击事件
-    $('.classify-fast-pop .dialog__btn_cancel').on('click', function() {
-        $('.classify-fast-pop').hide();
-    })
-    //
+      for (var key in deleteKeyArr) {
+        if (Array.isArray(deleteKeyArr[key])) {
+          deleteKey[key] = deleteKeyArr[key].join(',')
+        }
+      }
+      return deleteKey
+    },
+    batchDeleteConfirmed: function () {
+      var deleteKey = this.getDeleteKey()
+      var loading = this.showLoading()
+      var _this = this
+      $.ajax({
+        url: '/subscribepay/afterPay/setUserInfo',
+        type: 'POST',
+        data: {
+          pageType: 'keyWords',
+          actionType: 'DK',
+          delete_key: JSON.stringify(deleteKey)
+        },
+        success: function (res) {
+          loading && loading.clear()
+          if (res.flag) {
+            _this.showToast('删除成功')
+            _this.getKeywordsGroupList()
+            _this.batchDeleteState = false
+          } else {
+            _this.showToast(res.msg ? res.msg : '删除失败' )
+          }
+        },
+        error: function () {
+          loading && loading.clear()
+        }
+      })
+    },
+    beforeKeySwipeCellClose: function (e) {
+      // position 为关闭时点击的位置
+      // instance 为对应的 SwipeCell 实例
+      var position = e.position
+      var instance = e.instance
+      var index = e.name
 
-    $('.classify-edit-pop .classify-keyword').bind('input propertychange', function() {
-        var s = $('input.classify-keyword').val()
-        // 去空格
-        s = s.trim()
-        if (s.length === 0) {
-            $('.weui-dialog__ft .dialog__btn_confirm').addClass("opacity6");
-            return
+      switch (position) {
+        case 'left': {
+          break
+        }
+        case 'cell': {
+          instance.close()
+          break
         }
-        $('.weui-dialog__ft .dialog__btn_confirm').removeClass("opacity6");
-    })
-    // 关键词分类 - 确定按钮点击事件
-    $('.classify-edit-pop .dialog__btn_confirm').on('click', function() {
-        classify_name = $.trim($('input.classify-keyword').val());
-        // 去空格
-        classify_name = classify_name.trim();
-        if (classify_name.length === 0) {
-            return
+        case 'outside': {
+          instance.close()
+          break
         }
-        //分类名称是否已存在
-        if($.inArray(classify_name, classify_arr)>-1){
-            weui.toast('此分类名称已存在', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-            return
+        case 'right': {
+          this.delThisKey(index, instance)
+          break
         }
-		if(classify_name.length > 20){
-			classify_name = classify_name.substring(0,20);
-		}
-        $(this).removeClass("opacity6");
-        $('.classify-r .classify-detail').text(classify_name);
-        // 关闭弹框后要重置input内容
-        $('.classify-edit-pop').hide();
-        $('input.classify-keyword').val('');
-        if($(".showKeyWord li").length>0){
-			kws_name = classify_name;
-            saveData('SC')
-			kws_name = "";
-            a_items[classify_index]["s_item"] = classify_name;
-			setTimeout(function(){
-				doSessionData();
-			},300)
+        default: {
+          break
         }
-    })
+      }
+    },
+    /**
+     * 删除单个关键词
+     * @param {number} index 当前关键词在列表中的index
+     * @param {Object} instance SwipeCell的实例
+     */
+    delThisKey: function (index, instance) {
+      var _this = this
+      // 需要找到当前关键词组的item
+      var key = this.filter.keywordsList[index]
+      this.showDialog({
+        title: '',
+        message: '确定删除当前关键词？',
+        confirmButtonText: '删除',
+        className: 'j-confirm-dialog text-center'
+      }).then(function () {
+        // 点击确定，将当前关键词在批量选选择中，选中
+        key.checked = true
+        _this.batchDeleteConfirmed()
+      }).catch(function () {
+        console.log('取消删除关键词')
+      })
+    },
+    // 根据分类名，得到分类索引
+    getGroupIndexWithGroupName: function (gn) {
+      var groupIndex = -1
+      this.keywordsGroupList.forEach(function(item, index) {
+        console.log(item)
+        if (gn === item.s_item) {
+          groupIndex = index
+        }
+      })
+      return groupIndex
+    },
+    addKeyWord: function () {
+      var query = {
+        type: 'add'
+      }
+      // 新增，往哪个分组下新增（默认往未分组下新增）
+      var groupIndex = this.getGroupIndexWithGroupName(this.filter.groupName)
+      if (groupIndex != -1) {
+        query.gIndex = groupIndex
+      }
 
-    // 关键词分类 - 取消按钮点击事件
-    $('.classify-edit-pop .dialog__btn_cancel').unbind('tap').on('tap', function() {
-		setTimeout(function(){
-        	$('.classify-edit-pop').hide()
-       	 	$('input.classify-keyword').val('')
-		},300)
-		return true;
-    })
-}
+      var queryString = this.qsStringify(query)
+      location.href = '/jyapp/vipsubscribe/toSetInfoPage' + '?' + queryString
+    },
+    toKeyManagePage: function () {
+      location.href = '/jyapp/vipsubscribe/toSetManagePage'
+    },
+    fastImportDialogShow: function () {
+      this.dialog.fastImport = true
+    },
+    fastImport: function () {
+      var _this = this
+      var loading = this.showLoading()
+      $.ajax({
+        type: 'POST',
+        url: '/subscribepay/afterPay/fastImport',
+        data: {
+          c_index: _this.keywordsGroupList.length,
+          c_name: '未分类'
+        },
+        success: function (r) {
+          loading && loading.clear()
+          if (r.flagInt == 1) {
+            _this.showToast('成功导入' + r.kwMap.length + '个关键词')
+            _this.getKeywordsGroupList()
+          } else {
+            _this.showToast('导入失败')
+          }
+          try {
+            JyObj.checkLab(); //刷新搜索首页和订阅首页
+            sessionStorage.reloadHomePage = true;
+            sessionStorage.reloadSubPage = true;
+          } catch (e) {}
+        },
+        error: function () {
+          loading && loading.clear()
+        }
+      })
+    }
+  }
+})

src/jfw/modules/app/src/web/staticres/jyapp/vipsubscribe/js/keyword-info.js

@@ -0,0 +1,612 @@
+var vm = new Vue({
+  delimiters: ['${', '}'],
+  el: '.app-layout-content-b',
+  data: {
+    conf: {
+      keywordMax: 300
+    },
+    userData: {}, // getUserInfo接口用户原始数据
+    keywordsGroupList: [], // 所有关键词列表
+    groupNameList: [], // 关键词分类名称列表
+    allKeywordsList: [], // 所有关键词列表
+    matchWayList: [
+      {
+        title: '模糊匹配',
+        subInfo: '任意1个关键词匹配成功即推送',
+        value: 1
+      },
+      {
+        title: '精准匹配',
+        subInfo: '同时包含所有关键词才推送',
+        value: 0
+      }
+    ],
+    // 当前页面信息
+    pInfo: {
+      editType: '', // 当前页面状态(add新增关键词，edit修改关键词)
+      gIndex: '', // gIndex: groupIndex 该关键词所在分类 在分类列表中的索引
+      kIndex: '', // kIndex: keyIndex 该关键词在其所在分类中的索引
+      pushCount: 0
+    },
+    // 当前关键词信息
+    keyInfo: {
+      key: '',
+      matchWay: 1, // 0精准/1模糊->新增默认为：模糊1
+      notKey: ''
+    },
+    showNotKeyModule: false,
+    // 关键词刷新状态保存(类似前端分页)
+    recListState: {
+      loading: false, // 是否刷新中?
+      loaded: false, // 请求是否完成
+      pageNum: 1,
+      pageSize: 6,
+      total: 0, // 一共多少条数据
+      list: [],
+      listAll: [] // 后端返回的全部推荐关键词
+    },
+  },
+  computed: {
+    tooLittleTipShow: function () {
+      return this.pInfo.pushCount < 30
+    }
+  },
+  created: function () {
+    // 获取url参数
+    var type = utils.getParam('type')
+    var gIndex = utils.getParam('gIndex')
+    var kIndex = utils.getParam('kIndex')
+    this.pInfo.editType = type ? type : 'add'
+    if (gIndex !== '' && gIndex !== undefined && gIndex !== null) {
+      this.pInfo.gIndex = gIndex
+    }
+    if (kIndex !== '' && kIndex !== undefined && kIndex !== null) {
+      this.pInfo.kIndex = kIndex
+    }
+
+    this.getKeywordsGroupList({
+      needLoading: true,
+      callback: function () {
+        this.getKeyRecommend()
+        if (this.pInfo.editType === 'edit') {
+          this.getPushCount()
+        }
+      }.bind(this)
+    })
+  },
+  mounted: function () {},
+  methods: {
+    showLoading: function () {
+      return this.$toast.loading({
+        duration: 0,
+        forbidClick: true,
+        message: 'loading...',
+      })
+    },
+    showToast: function (message) {
+      return this.$toast({
+        duration: 1500,
+        forbidClick: true,
+        message: message,
+      })
+    },
+    showDialog: function (conf) {
+      var defaultConf = {
+        title: '提示',
+        message: 'message',
+        className: 'j-confirm-dialog',
+        showConfirmButton: true,
+        showCancelButton: true,
+        confirmButtonColor: '#2abed1'
+      }
+      if (conf) {
+        Object.assign(defaultConf, conf)
+      }
+      return this.$dialog.confirm(defaultConf)
+    },
+    getPushCount: function () {
+      var groupInfo = {
+        name: '',
+        kIndex: -1
+      }
+      if (this.pInfo.editType === 'add') {
+        
+      } else if (this.pInfo.editType === 'edit') {
+        groupInfo.name = this.keywordsGroupList[this.pInfo.gIndex].s_item
+        groupInfo.kIndex = this.pInfo.kIndex
+      } else {
+        return
+      }
+
+      this.getPushCountConfirmed(groupInfo)
+    },
+    getPushCountConfirmed: function (groupInfo) {
+      var _this = this
+      // 全部关键词-推送结果预览总数参数：item值为空 index值为-1
+      // 某个关键词组-推送结果预览总数参数：item值不为空 index值大于等于0
+      $.ajax({
+        url: '/subscribepay/afterPay/getPushCount',
+        type: 'POST',
+        data: {
+          item: groupInfo.name, // 关键词组所在分类名称
+          index: groupInfo.kIndex // 关键词组所在分类下的索引位置
+        },
+        success: function (res) {
+          if (res && res.count) {
+            _this.pInfo.pushCount = res.count
+          }
+        }
+      })
+    },
+    getKeywordsGroupList: function (options) {
+      var defaultOptions = {
+        async: true,
+        needLoading: false,
+        callback: ''
+      }
+      if (options) {
+        Object.assign(defaultOptions, options)
+      }
+      var _this = this
+      if (defaultOptions.needLoading) {
+        var loading = this.showLoading()
+      }
+      $.ajax({
+        type: 'POST',
+        url: '/subscribepay/afterPay/getUserInfo?t=' + Date.now(),
+        async: defaultOptions.async,
+        success: function (res) {
+          if (defaultOptions.needLoading) {
+            loading && loading.clear()
+          }
+          if (res && res.userData) {
+            _this.userData = res.userData
+            if (res.userData && res.userData.o_vipjy) {
+              // 整理数据
+              var groupList = _this.addInfoToKeyItem(res.userData.o_vipjy.a_items)
+              var groupNameList = _this.getGroupNameList(groupList)
+              _this.keywordsGroupList = groupList
+              _this.groupNameList = groupNameList
+              _this.allKeywordsList = _this.filterKeywordsList()
+              if (_this.pInfo.editType === 'edit') {
+                _this.getKeyInfoFromIndex()
+              }
+              defaultOptions.callback && defaultOptions.callback()
+            }
+          }
+        },
+        error: function () {
+          if (defaultOptions.needLoading) {
+            loading && loading.clear()
+          }
+        }
+      })
+    },
+    // 向关键词中添加一些信息
+    addInfoToKeyItem: function (groupList) {
+      if (!Array.isArray(groupList)) return []
+
+      groupList.forEach(function (keywordsList, index) {
+        if (Array.isArray(keywordsList.a_key)) {
+          keywordsList.a_key.forEach(function (keyword, iindex) {
+            // 添加一些其他信息
+            keyword.groupName = keywordsList.s_item // 分类名
+            keyword.groupIndex = index // 该关键词所在分类 在分类列表中的索引
+            keyword.keyIndex = iindex // 该关键词在其所在分类中的索引
+          })
+        }
+      })
+
+      return groupList
+    },
+    getGroupNameList: function (keywordsGroupList) {
+      var groupNameList = []
+      if (!Array.isArray(keywordsGroupList)) return groupNameList
+      keywordsGroupList.forEach(function (item, index) {
+        var count = Array.isArray(item.a_key) ? item.a_key.length : 0
+        groupNameList.push({
+          name: item.s_item, // 分类名
+          checked: false,
+          count: count // 分类下有多少个关键词
+        })
+      })
+      return groupNameList
+    },
+    calcKeyInfo: function (item) {
+      // 匹配方式 item.matchWay 0/null精准 1模糊
+      var key = item.key
+      var notkey = []
+      if (Array.isArray(item.appendkey)) {
+        key = key.concat(item.appendkey)
+      }
+      if (Array.isArray(item.notkey)) {
+        notkey = item.notkey
+      }
+
+      return {
+        key: key.join(' '),
+        notkey: notkey.join(' '),
+        matchWay: item.matchway == 1 ? '模糊' : '精准',
+        matchWayClass: item.matchway == 1 ? 'tag-orange' : 'tag-green'
+      }
+    },
+    getKeyInfoFromIndex: function () {
+      // 关键词所在分类
+      var keyList = this.keywordsGroupList[this.pInfo.gIndex]
+      var keyMap = keyList.a_key[this.pInfo.kIndex]
+      var keyArr = keyMap.key
+      if (Array.isArray(keyMap.appendkey)) {
+        keyArr = keyArr.concat(keyMap.appendkey)
+      }
+      var notKeyArr = Array.isArray(keyMap.notkey) ? keyMap.notkey : []
+      var matchWay = keyMap.matchway == 1 ? 1 : 0
+
+      this.keyInfo.key = keyArr.join(' ')
+      this.keyInfo.notKey = notKeyArr.join(' ')
+      this.keyInfo.matchWay = matchWay
+
+      if (this.keyInfo.notKey) {
+        this.showNotKeyModule = true
+      }
+    },
+    // 筛选关键词分组（传空则取所有关键词平铺到一个数组中）
+    filterKeywordsList: function (filterName) {
+      var list = []
+      // 筛选关键词
+      this.keywordsGroupList.forEach(function (keywordsList) {
+        if (Array.isArray(keywordsList.a_key)) {
+          keywordsList.a_key.forEach(function (keyword) {
+            // 筛选全部(筛选词为空)，需要把关键词所属分类信息记录
+            if (!filterName) {
+              list.push(keyword)
+            } else {
+              if (filterName === keywordsList.s_item) {
+                list.push(keyword)
+              }
+            }
+          })
+        }
+      })
+      // 给新的list添加checked
+      list = JSON.parse(JSON.stringify(list))
+      list.forEach(function (item) {
+        item.checked = false
+        item.calcInfo = this.calcKeyInfo(item)
+      }.bind(this))
+      return list
+    },
+    // 通过分类名获得分类信息
+    getGroupInfo: function (groupName) {
+      if (!groupName) return
+      // 筛选关键词
+      var groupInfo = {}
+      this.keywordsGroupList.some(function (keywordsList, index) {
+        if (groupName === keywordsList.s_item) {
+          groupInfo.name = keywordsList.s_item
+          groupInfo.gIndex = index
+          groupInfo.keyCount = Array.isArray(keywordsList.a_key) ? keywordsList.a_key.length : 0
+          return true
+        }
+      })
+      return groupInfo
+    },
+    getPageKeyInfoFromGroupList: function () {},
+    delThisKey: function () {
+      var _this = this
+      this.showDialog({
+        title: '',
+        message: '确定删除当前关键词？',
+        confirmButtonText: '删除',
+        className: 'j-confirm-dialog text-center'
+      }).then(function () {
+        _this.delThisKeyConfirmed()
+      }).catch(function () {
+        console.log('取消删除关键词')
+      })
+    },
+    delThisKeyConfirmed: function () {
+      var loading = this.showLoading()
+      var _this = this
+      var deleteKey = {
+        [this.pInfo.gIndex]: this.pInfo.kIndex
+      }
+      $.ajax({
+        url: '/subscribepay/afterPay/setUserInfo',
+        type: 'POST',
+        data: {
+          pageType: 'keyWords',
+          actionType: 'DK',
+          delete_key: JSON.stringify(deleteKey)
+        },
+        success: function (res) {
+          loading && loading.clear()
+          if (res.flag) {
+            _this.showToast('删除成功')
+            setTimeout(function () {
+              history.back()
+            }, 1500)
+          } else {
+            _this.showToast(res.msg ? res.msg : '删除失败' )
+          }
+        },
+        error: function () {
+          loading && loading.clear()
+        }
+      })
+    },
+    getGKIndex: function () {
+      var editType = this.pInfo.editType
+      var editIndex = {
+        gIndex: '',
+        kIndex: '',
+        name: '',
+      }
+      if (editType === 'add') {
+        // 获取索引
+        // 1. 判断url中是否传索引，如果传了，就直接用。否则取未分类索引
+        // 2. 如果未分类索引也没取到，则创建未分类
+        if (this.pInfo.gIndex !== null && this.pInfo.gIndex !== undefined && this.pInfo.gIndex !== '') {
+          // url中取到索引，可以直接用
+          editIndex.gIndex = this.pInfo.gIndex
+          editIndex.kIndex = this.keywordsGroupList[this.pInfo.gIndex].a_key.length
+          editIndex.name = this.keywordsGroupList[this.pInfo.gIndex].s_item
+        } else {
+          // 没取到传入的索引，则取未分类的索引
+          var groupInfo = this.getGroupInfo('未分类')
+          if (!groupInfo) {
+            // 没找到未分类，创建未分类，并获取其信息
+            groupInfo = this.createGroupAndGetInfo()
+          }
+          editIndex.gIndex = groupInfo.gIndex
+          editIndex.kIndex = groupInfo.keyCount
+          editIndex.name = groupInfo.name
+        }
+        return editIndex
+      } else if (editType === 'edit') {
+        editIndex.gIndex = this.pInfo.gIndex
+        editIndex.kIndex = this.pInfo.kIndex
+        editIndex.name = this.keywordsGroupList[this.pInfo.gIndex].s_item
+        return editIndex
+      } else {
+        return {}
+      }
+    },
+    // 创建分类
+    createGroup: function () {
+      var _this = this
+      var groupName = '未分类'
+      $.ajax({
+        type: 'POST',
+        url: '/subscribepay/afterPay/setUserInfo',
+        async: false,
+        data: {
+          pageType: 'keyWords',
+          actionType: 'SC',
+          classify_name: groupName
+        },
+        success: function (res) {
+          if (res.flag) {
+            _this.getKeywordsGroupList({
+              needLoading: false,
+              async: false
+            })
+          } else {
+            loading && loading.clear()
+            _this.showToast(res.msg ? res.msg : '新建分类失败' )
+          }
+        },
+        error: function () {
+          loading && loading.clear()
+        }
+      })
+    },
+    createGroupAndGetInfo: function () {
+      // 创建一个未分类
+      this.createGroup()
+      return this.getGroupInfo('未分类')
+    },
+    getNotKeyArr: function () {
+      var notKey = this.keyInfo.notKey.trim()
+      if (!notKey) return []
+      return notKey.split(/\s+/)
+    },
+    saveKeyWord: function () {
+      var _this = this
+      if (!this.keyInfo.key) {
+        return this.showDialog({
+          title: '',
+          message: '关键词不能为空',
+          className: 'j-confirm-dialog text-center',
+          showConfirmButton: true,
+          showCancelButton: false,
+          confirmButtonText: '我知道了'
+        })
+      }
+      
+      // 整理数据
+      //  SK：保存关键词； DK：删除关键词； SC：保存分类
+      var groupInfo = this.getGKIndex()
+      var params = {
+        pageType: 'keyWords',
+        actionType: 'SK',
+        match_way: this.keyInfo.matchWay,
+        kws_name: this.keyInfo.key.trim(),
+        not_kws: this.getNotKeyArr(),
+        kwscount: this.allKeywordsList.length,
+        classify_index: groupInfo.gIndex,
+        classify_name: groupInfo.name,
+        kws_index: groupInfo.kIndex,
+      }
+
+      var loading = this.showLoading()
+
+      $.ajax({
+        url: '/subscribepay/afterPay/setUserInfo',
+        type: 'POST',
+        traditional: true,
+        data: params,
+        success: function (res) {
+          loading && loading.clear()
+          if (res.flag) {
+            _this.showToast('保存成功')
+            setTimeout(function () {
+              // history.back()
+            }, 1500)
+          } else {
+            if (res.msg.indexOf('存在') !== -1) {
+              _this.showDialog({
+                title: '',
+                message: '该组关键词已存在，请勿重复添加',
+                className: 'j-confirm-dialog text-center',
+                showConfirmButton: true,
+                showCancelButton: false,
+                confirmButtonText: '我知道了'
+              })
+            } else {
+              _this.showToast(res.msg ? res.msg : '保存失败')
+            }
+          }
+        },
+        error: function () {
+          loading && loading.clear()
+        }
+      })
+    },
+    // 获取关键词推荐
+    getKeyRecommend: function () {
+      var _this = this
+      var keysArr = []
+      var filterArr = [] // 当前分类key数组
+      // 1. 如果传了gIndex则取gIndex分类中的关键词
+      // 2. 没传gIndex则取【未分类】中的关键词，没有【未分类】，则不发送请求
+      if (this.pInfo.gIndex !== null && this.pInfo.gIndex !== undefined && this.pInfo.gIndex !== '') {
+        // url中取到索引，可以直接用
+        filterArr = this.keywordsGroupList[this.pInfo.gIndex].a_key
+      } else {
+        filterArr = this.filterKeywordsList('未分类')
+      }
+
+      filterArr.forEach(function (item) {
+        if (item.key) {
+          if (item.key instanceof Array) {
+            keysArr.push(item.key.join('+'))
+          } else {
+            keysArr.push(item.key)
+          }
+        }
+      })
+
+      if (keysArr.length === 0) return
+
+      var fetchData = {
+        count: 20,
+        value: utils.unique(keysArr).join(' ')
+      }
+      $.ajax({
+        url: '/jyapp/member/getRecomKWs',
+        type: 'POST',
+        data: fetchData,
+        success: function (r) {
+          if (r && r instanceof Array && r.length !== 0) {
+            _this.loadKeyRecommend(r)
+          }
+        }
+      })
+    },
+    loadKeyRecommend: function (list) {
+      var afterFilterArr = this.filterKeyRecommend(list)
+      this.recommendTags = afterFilterArr.slice(0, this.conf.recommendTagsCount)
+
+      this.recListState.listAll = afterFilterArr
+      this.recListState.count = afterFilterArr.length
+      this.nextPageRec()
+    },
+    // 过滤后端返回的推荐数组
+    filterKeyRecommend: function (list) {
+      var arr = utils.bSort(list, 'sim')
+      // 排序后
+      var afterSort = arr.reverse()
+      var afterTile = []
+
+      // 已订阅关键词数组
+      var allKeyArr = []
+      var allKeyArrLower = []
+
+      // 已订阅关键词的整理 -----
+      // 将所有关键词整理到一个数组中
+      this.allKeywordsList.forEach(function (item) {
+        if (item.key instanceof Array) {
+          allKeyArr = allKeyArr.concat(item.key)
+        } else {
+          allKeyArr.push(item.key)
+        }
+      })
+      // 数组中英文转小写
+      allKeyArr.forEach(function (item) {
+        allKeyArrLower.push(item.toLowerCase())
+      })
+
+      // 推荐数组整理
+      // 平铺，将数组中的对象去掉，使用字符串平铺内容
+      afterSort.forEach(function (item) {
+        afterTile.push(item.word.toLowerCase())
+      })
+      // 去重1，当前数组中的内容去重，不精确大小写
+      var afterTileLength = afterTile.length
+      for (var i = afterTileLength - 1; i >= 0; i--) {
+        var aIndex = afterTile.indexOf(afterTile[i].toLowerCase())
+        if (aIndex !== i) {
+          afterTile.splice(i, 1)
+        }
+      }
+
+      // 去重2，找到已经订阅过的，进行删除
+      afterTileLength = afterTile.length
+      for (var j = afterTileLength - 1; j >= 0; j--) {
+        var aIndex = allKeyArrLower.indexOf(afterTile[j])
+        if (aIndex !== -1) {
+          afterTile.splice(j, 1)
+        }
+      }
+
+      return afterTile
+    },
+    getRecListTags: function () {
+      var listAll = this.recListState.listAll
+      this.recListState.total = listAll.length
+
+      var startIndex = ((this.recListState.pageNum - 1) * this.recListState.pageSize)
+      var endIndex = (this.recListState.pageNum * this.recListState.pageSize)
+
+      return listAll.slice(startIndex, endIndex)
+    },
+    nextPageRec: function () {
+      if (this.recListState.loading) return
+      this.recListState.loading = true
+      this.recListState.list = this.getRecListTags()
+
+      setTimeout(function () {
+        this.recListState.loading = false
+      }.bind(this), 500)
+
+      // 最后一页，则重置页码
+      if (this.recListState.pageNum * this.recListState.pageSize >= this.recListState.total) {
+        this.recListState.pageNum = 1
+      } else {
+        this.recListState.pageNum++
+      }
+
+      return this.recListState.list
+    },
+    clickTag: function (item) {
+      var key = this.keyInfo.key
+      if (key) {
+        var keyArr = this.keyInfo.key.split(/\s+/)
+        keyArr.push(item)
+        this.keyInfo.key = utils.unique(keyArr).join(' ')
+      } else {
+        this.keyInfo.key = item
+      }
+    }
+  }
+})

src/jfw/modules/app/src/web/staticres/jyapp/vipsubscribe/js/keyword-manage.js

@@ -0,0 +1,359 @@
+var vm = new Vue({
+  delimiters: ['${', '}'],
+  el: '.app-layout-content-b',
+  data: {
+    batchDeleteState: false, // 是否在批量删除状态
+    userData: {}, // getUserInfo接口用户原始数据
+    groupNameList: [],
+    listState: {
+      loaded: false
+    },
+    // 修改关键词组名称弹窗显示
+    editGroupNameDialog: {
+      show: false,
+      type: '', // 状态：add/edit
+      value: ''
+    },
+  },
+  computed: {
+    listShow: function () {
+      return this.groupNameList.length !== 0 && this.listState.loaded
+    },
+    emptyShow: function () {
+      return this.groupNameList.length === 0 && this.listState.loaded
+    },
+    selectedCount: function () {
+      var selectedArr = this.getSelectArr()
+      return selectedArr.length
+    }
+  },
+  watch: {
+    'editGroupNameDialog.value': {
+      handler: function (newVal, oldVal) {
+        this.$nextTick(function () {
+          $('.group-name-edit .van-dialog__confirm').prop('disabled', !newVal)
+        })
+      }
+    }
+  },
+  created: function () {
+    this.getKeywordsGroupList(true)
+  },
+  mounted: function () {},
+  methods: {
+    showLoading: function () {
+      return this.$toast.loading({
+        duration: 0,
+        forbidClick: true,
+        message: 'loading...',
+      })
+    },
+    showToast: function (message) {
+      return this.$toast({
+        duration: 1500,
+        forbidClick: true,
+        message: message,
+      })
+    },
+    showDialog: function (conf) {
+      var defaultConf = {
+        title: '提示',
+        message: 'message',
+        className: 'j-confirm-dialog',
+        showConfirmButton: true,
+        showCancelButton: true,
+        confirmButtonColor: '#2abed1'
+      }
+      if (conf) {
+        Object.assign(defaultConf, conf)
+      }
+      return this.$dialog.confirm(defaultConf)
+    },
+    getKeywordsGroupList: function (needLoading) {
+      var _this = this
+      if (needLoading) {
+        var loading = this.showLoading()
+      }
+      $.ajax({
+        type: 'POST',
+        url: '/subscribepay/afterPay/getUserInfo?t=' + Date.now(),
+        success: function (res) {
+          if (needLoading) {
+            loading && loading.clear()
+          }
+          if (res && res.userData) {
+            _this.userData = res.userData
+            if (res.userData && res.userData.o_vipjy) {
+              // 整理数据
+              var list = _this.getGroupNameList(res.userData.o_vipjy.a_items)
+              if (Array.isArray(list)) {
+                _this.groupNameList = list
+              }
+            }
+          }
+        },
+        error: function () {
+          if (needLoading) {
+            loading && loading.clear()
+          }
+        },
+        complete: function () {
+          _this.listState.loaded = true
+        }
+      })
+    },
+    getGroupNameList: function (keywordsGroupList) {
+      if (!Array.isArray(keywordsGroupList)) return
+      var groupNameList = []
+      keywordsGroupList.forEach(function (item, index) {
+        var count = Array.isArray(item.a_key) ? item.a_key.length : 0
+        groupNameList.push({
+          name: item.s_item, // 分类名
+          checked: false,
+          deleteDisabled: count > 0, // 该分类是否能被删除
+          count: count // 分类下有多少个关键词
+        })
+      })
+      return groupNameList
+    },
+    // 通过已有分类得到一个未分类名
+    getNewClassName: function () {
+      var conf = {
+        defaultT: '未分类',
+        reg: /^未分类(\d*)$/,
+        // 未分类名称数组
+        unclassified: [],
+        // 未分类名称数字数组
+        unclassifiedNum: [],
+        sortedArr: []
+      }
+
+      this.groupNameList.forEach(function (item) {
+        if (conf.reg.test(item.name)) {
+          var num = item.name.replace(new RegExp(conf.defaultT, 'g'), '')
+          num = parseInt(num)
+          if (isNaN(num)) {
+            num = 0
+          }
+          conf.unclassifiedNum.push(num)
+          conf.unclassified.push(item.name)
+        }
+      })
+
+      // 得到分类名
+      if (conf.unclassifiedNum.length === 0) {
+        return '未分类'
+      } else {
+        conf.sortedArr = conf.unclassifiedNum.sort(function (a, b) {
+          return b - a
+        })
+
+        return conf.defaultT + (conf.sortedArr[0] + 1)
+      }
+    },
+    getSelectArr: function () {
+      var selectedArr = []
+      this.groupNameList.forEach(function (item) {
+        if (!item.deleteDisabled && item.checked) {
+          selectedArr.push(item)
+        }
+      })
+      return selectedArr
+    },
+    getSelectIndexArr: function () {
+      var selectedIndexArr = []
+      this.groupNameList.forEach(function (item, index) {
+        if (!item.deleteDisabled && item.checked) {
+          selectedIndexArr.push(index)
+        }
+      })
+      return selectedIndexArr
+    },
+    batchDeleteStateChange: function () {
+      this.batchDeleteState = !this.batchDeleteState
+    },
+    batchDelete: function () {
+      var _this = this
+      if (this.selectedCount <= 0) return
+      this.showDialog({
+        title: '',
+        message: '确定删除所选关键词分类吗？',
+        className: 'j-confirm-dialog text-center',
+      }).then(function () {
+        console.log('确认批量删除分类')
+        _this.batchDeleteConfirmed()
+      })
+      .catch(function() {
+        console.log('取消批量删除分类')
+      })
+    },
+    batchDeleteConfirmed: function () {
+      var selectedIndexArr = this.getSelectIndexArr()
+      var loading = this.showLoading()
+      var _this = this
+      $.ajax({
+        url: '/subscribepay/afterPay/setUserInfo',
+        type: 'POST',
+        data: {
+          pageType: 'keyWords',
+          actionType: 'DC',
+          classify_index: selectedIndexArr.join(',')
+        },
+        success: function (res) {
+          loading && loading.clear()
+          if (res.flag) {
+            _this.showToast('删除成功')
+            _this.getKeywordsGroupList()
+            _this.batchDeleteState = false
+          } else {
+            _this.showToast(res.msg ? res.msg : '删除失败' )
+          }
+        },
+        error: function () {
+          loading && loading.clear()
+        }
+      })
+    },
+    clickKeyCard: function (item, index) {
+      if (this.batchDeleteState) {
+        // 执行点击选中逻辑
+        // 如果关键词组下有关键词，则不能点击
+        if (!item.deleteDisabled) {
+          item.checked = !item.checked
+        }
+      } else {
+        // 显示修改关键词组名弹框
+        this.editGroupName('edit', item, index)
+      }
+    },
+    beforeKeySwipeCellClose: function (e) {
+      // position 为关闭时点击的位置
+      // instance 为对应的 SwipeCell 实例
+      var position = e.position
+      var instance = e.instance
+      var index = e.name
+
+      switch (position) {
+        case 'left': {
+          break
+        }
+        case 'cell': {
+          instance.close()
+          break
+        }
+        case 'outside': {
+          instance.close()
+          break
+        }
+        case 'right': {
+          this.delThisKey(index, instance)
+          break
+        }
+        default: {
+          break
+        }
+      }
+    },
+    /**
+     * 删除单个分类
+     * @param {number} index 当前关键词在当前分组的index
+     * @param {Object} instance SwipeCell的实例
+     */
+    delThisKey: function (index, instance) {
+      var _this = this
+      // 需要找到当前分类的item
+      var group = this.groupNameList[index]
+      this.showDialog({
+        title: '',
+        message: '确定删除当前分类？',
+        confirmButtonText: '删除',
+        className: 'j-confirm-dialog text-center'
+      }).then(function () {
+        // 点击确定，将当前关键词在批量选选择中，选中
+        group.checked = true
+        _this.batchDeleteConfirmed()
+        console.log('确定删除分类')
+      }).catch(function () {
+        console.log('取消删除分类')
+      })
+    },
+    getAllGroupName: function () {
+      var arr = []
+      this.groupNameList.forEach(function (item) {
+        if (item.name) {
+          arr.push(item.name)
+        }
+      })
+      return arr
+    },
+    addGroup: function () {
+      this.editGroupName('add')
+    },
+    // 编辑或者添加分类名
+    editGroupName: function (editType, item, index) {
+      this.editGroupNameDialog.type = editType
+      this.editGroupNameDialog.show = true
+      if (editType === 'edit') {
+        this.editGroupNameDialog.value = item.name
+        this.editGroupNameDialog.gIndex = index
+      } else if (editType === 'add') {
+        this.editGroupNameDialog.value = ''
+      }
+      this.$nextTick(function () {
+        $('.group-name-edit .van-dialog__confirm').prop('disabled', !this.editGroupNameDialog.value)
+      })
+    },
+    confirmEditGroupName: function () {
+      // 关键词分类名判重
+      var classNameArr = this.getAllGroupName()
+      if (classNameArr.indexOf(this.editGroupNameDialog.value) === -1) {
+        // 分类名不重复，新建分类
+        this.saveGroupEdit(this.editGroupNameDialog.type)
+      } else {
+        this.showToast('分类名不能重复')
+      }
+    },
+    saveGroupEdit: function (type) {
+      var _this = this
+      var data = {}
+      var toastType = ''
+      if (type === 'add') {
+        toastType = '新建'
+        data = {
+          pageType: 'keyWords',
+          actionType: 'SC',
+          classify_name: this.editGroupNameDialog.value
+        }
+      } else if (type === 'edit') {
+        toastType = '修改'
+        data = {
+          pageType: 'keyWords',
+          actionType: 'SC',
+          classify_index: this.editGroupNameDialog.gIndex,
+          classify_name: this.editGroupNameDialog.value
+        }
+      } else {
+        return
+      }
+      var loading = this.showLoading()
+      $.ajax({
+        type: 'POST',
+        url: '/subscribepay/afterPay/setUserInfo',
+        data: data,
+        success: function (res) {
+          loading && loading.clear()
+          if (res.flag) {
+            _this.showToast(toastType + '分类成功')
+            _this.getKeywordsGroupList()
+            _this.batchDeleteState = false
+          } else {
+            _this.showToast(res.msg ? res.msg : toastType + '失败')
+          }
+        },
+        error: function () {
+          loading && loading.clear()
+        }
+      })
+    }
+  }
+})

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

@@ -1,643 +0,0 @@
-"use strict";
-
-var PageData = {
-    a_items: [],
-    data: null,
-    keysArr: [],
-    classArr: [],
-    classIndex: 0,
-    keyIndex: 0
-};
-
-function wToast(text) {
-    return weui.toast(text, {
-        duration: 2000,
-        className: 'custom-toast'
-    });
-} // 获取数据
-
-
-function getPageData() {
-    var loading = weui.loading();
-    $.post("/subscribepay/afterPay/getUserInfo", {}, function (_ref) {
-        var userData = _ref.userData;
-        PageData.data = userData;
-
-        if (userData) {
-            if (userData.o_vipjy && userData.o_vipjy.a_items && userData.o_vipjy.a_items.length) {
-                var a_items = userData.o_vipjy.a_items;
-                PageData.a_items = a_items;
-                drawDom(PageData.a_items);
-            } else {
-                if (history.state && history.state.className) {
-                    checkPageStatus()
-                } else {
-                    $(".addClassify").click();
-                }
-            }
-
-            loading.hide();
-        } else {
-            loading.hide();
-        }
-    });
-} // 保存数据
-
-
-function setPageData(actionType) {
-    var loading = weui.loading();
-    var ClassData = PageData.a_items[PageData.classIndex];
-    var ajaxResult = null;
-    var param = {};
-    param.pageType = "keyWords";
-    param.classify_index = PageData.classIndex;
-    param.classify_name = ClassData.s_item;
-    param.kws_index = PageData.keyIndex;
-    param.kws_name = ClassData.a_key.length ? ClassData.a_key[PageData.keyIndex].key.join(' ') : null;
-    param.actionType = actionType;
-    param.addition_kws = ClassData.a_key.length ? ClassData.a_key[PageData.keyIndex].appendkey : null;
-    param.not_kws = ClassData.a_key.length ? ClassData.a_key[PageData.keyIndex].notkey : null;
-    param.kwscount = ClassData.keys.length;
-    $.ajax({
-        type: "POST",
-        url: "/subscribepay/afterPay/setUserInfo",
-        data: param,
-        dataType: "json",
-        async: false,
-        traditional: true,
-        success: function success(r) {
-            ajaxResult = r;
-
-            if (r.flag) {
-                console.log("保存成功");
-
-                try {
-                    JyObj.checkLab(); //刷新搜索首页和订阅首页
-
-                    sessionStorage.reloadHomePage = true;
-                    sessionStorage.reloadSubPage = true;
-                    setTimeout(function () {
-                        //ios 从我的菜单进入 保存关键词 底部导航会显示
-                        JyObj.hiddenBottom("0");
-                    }, 300);
-                } catch (e) {}
-            }
-        }
-    });
-
-    if (actionType === 'DK' && ajaxResult.flag) {
-        ClassData.a_key.splice(param.kws_index, 1);
-        ClassData.keys.splice(param.kws_index, 1);
-        PageData.keysArr.splice(PageData.keysArr.indexOf(param.kws_name), 1);
-        drawKwsCount(PageData.keysArr.length);
-
-        if (ClassData.keys.length === 0) {
-            $(".enter.addkeyWord").show();
-            $(".classify-item[data-c='" + PageData.classIndex + "']").remove();
-            var nowI = PageData.classArr.indexOf(PageData.a_items[PageData.classIndex].s_item)
-            PageData.classArr.splice(nowI, 1);
-            PageData.classIndex = PageData.classArr.length
-            var nowArr = PageData.a_items.splice(nowI, 1)[0];
-            PageData.a_items.push(nowArr)
-            PageData.classArr.push(nowArr.s_item)
-            $(".add-keyword-container .addNewKeyword .jy-icon-add-box").hide();
-        } else {
-            upDrawClassPage();
-        }
-        drawDom(PageData.a_items)
-    }
-
-    loading.hide();
-    return ajaxResult.flag;
-} // 处理页面切换
-
-
-function checkPageStatus() {
-    sessionStorage.removeItem('sub_vip_state')
-    if (history.state && history.state.className.toString()) {
-        var nowClassIndex = PageData.classArr.indexOf(history.state.className)
-        if (nowClassIndex === -1) {
-            PageData.a_items.push({
-                a_key: [],
-                keys: [],
-                s_item: history.state.className,
-                tip: true
-            })
-            nowClassIndex = PageData.a_items.length - 1
-        }
-        PageData.classIndex = nowClassIndex
-        PageData.a_items[nowClassIndex].tip = true
-        toggleSection(false);
-    } else {
-        if (!PageData.a_items.length || !PageData.classArr.length) {
-            return history.go(-1)
-        }
-        var tempAItems = PageData.a_items.filter(function (v) {
-            return v.keys.length;
-        });
-
-        if (tempAItems.length !== PageData.a_items.length) {
-            PageData.a_items = tempAItems;
-            drawDom(PageData.a_items);
-        }
-
-        toggleSection(true);
-    }
-} // 切换
-
-
-function toggleSection(type) {
-    var tempDomList = $(".keyWord .all-classify-column");
-    var tempDomKey = $(".keyWord .add-keyword-container");
-
-    if (type) {
-        $(".classify-edit-pop").hide();
-        tempDomList.show();
-        tempDomKey.hide();
-        document.title = '关键词分类';
-    } else {
-        tempDomKey.show();
-        tempDomList.hide();
-        upDrawClassPage();
-        document.title = '关键词';
-    }
-
-    $(".app-layout-header span:eq(1)").text(document.title);
-} //保存缓存
-
-
-function setSesstion() {
-    sessionStorage.classify_name = PageData.a_items[PageData.classIndex].s_item; //当前分类
-
-    sessionStorage.kws_index = PageData.keyIndex; //当前关键词索引
-
-    sessionStorage.classify_index = PageData.classIndex; //当前分类索引
-
-    sessionStorage.a_items = JSON.stringify(PageData.a_items); //当前数据
-
-    sessionStorage.kws_arr = JSON.stringify(PageData.keysArr); //当前所有关键词排
-
-    sessionStorage.kws_count = PageData.keysArr.length; //关键词个数
-} // 编辑删除
-
-
-function deleteKey(th) {
-    var jQueryDOM = $(th).parents('li.delete-box');
-    var liIndex = Number(jQueryDOM.index());
-    PageData.keyIndex = jQueryDOM.attr('data-k');
-    var deleteStaus = false
-    weui.confirm('删除后将无法恢复，确定删除？', {
-        title: '删除关键词',
-        isAndroid: false,
-        buttons: [{
-            label: '取消',
-            type: 'default',
-            onClick: function onClick() {
-                deleteSwiper.length ? deleteSwiper[liIndex].slideTo(0) : deleteSwiper.slideTo(0);
-            }
-        }, {
-            label: '确定',
-            type: 'primary',
-            onClick: function onClick() {
-                if (deleteStaus) {
-                    return
-                }
-                weui.loading()
-                if (setPageData('DK')) {
-                    jQueryDOM.remove();
-                } else {
-                    wToast('无法删除或已被删除');
-                }
-                deleteStaus = true
-            }
-        }]
-    });
-}
-/* swiper */
-
-
-function initSwiper() {
-    console.log('swiper');
-
-    if (window.deleteSwiper) {
-        if (window.deleteSwiper.length) {
-            window.deleteSwiper.forEach(function (e) {
-                try {
-                    e.destroy();
-                } catch (err) {
-                    e = null;
-                }
-            });
-        } else {
-            try {
-                window.deleteSwiper.destroy();
-            } catch (e) {
-                window.deleteSwiper = null;
-            }
-        }
-
-        window.deleteSwiper = null;
-    }
-
-    window.deleteSwiper = new Swiper('.delete-box', {
-        slidesPerView: 'auto',
-        initialSlide: 0,
-        resistanceRatio: 0,
-        slideToClickedSlide: true,
-        on: {
-            init: function init() {
-                var aEl = $(this.$wrapperEl).find(".one");
-                var bEl = $(this.$wrapperEl).find(".delete-button");
-                var aH = aEl[0] && aEl[0].offsetHeight;
-                aH && $(bEl).height(aH);
-            },
-            tap: function tap(event) {
-                var canDelete = event.target.className.indexOf('delete-button') !== -1;
-                var cI = $(this.$el).attr('data-c');
-                var kI = $(this.$el).attr('data-k');
-                PageData.keyIndex = kI;
-
-                if (!canDelete) {
-                    console.log(cI, kI);
-                    setSesstion();
-                    window.location.href = '/jyapp/vipsubscribe/toSetaddKeyPage';
-                }
-            },
-            touchStart: function touchStart(event) {
-                var nowIndex = $(this.$wrapperEl).parents('li').index('.showKeyWord ul li');
-
-                if (deleteSwiper.length) {
-                    deleteSwiper.forEach(function (e, i) {
-                        var canDelete = e.getTranslate() !== 0;
-
-                        if (canDelete && i !== nowIndex) {
-                            e.slideTo(0);
-                        }
-                    });
-                }
-            }
-        }
-    });
-} // 渲染
-
-
-function drawKeyDom(index, data) {
-    console.log(index, data);
-    var keyStr = data.key.join(' ');
-    var appendkeyStr = data.appendkey ? data.appendkey.join('、') : '';
-    var notkeyStr = data.notkey ? data.notkey.join('、') : '';
-    var tempDom = $(".delete-box[data-c='" + PageData.classIndex + "'][data-k='" + index + "']"); // 待优化
-
-    if (false && tempDom.hasClass('delete-box')) {
-        // 更新
-        tempDom.find('p.key').text(keyStr);
-        var tempA = tempDom.find('p.addition').text(appendkeyStr).parent();
-        appendkeyStr.length ? tempA.show() : tempA.hide();
-        var tempB = tempDom.find('p.notkey').text(notkeyStr).parent();
-        notkeyStr.length ? tempB.show() : tempB.hide();
-    } else {
-        // 新增
-        var tempHTML = "\n        <li class=\"delete-box swiper-container\" data-c=\"" + PageData.classIndex + "\" data-k=\"" + index + "\">\n            <div class=\"swiper-wrapper\">\n                <div class=\"one swiper-slide\">\n                    <div>\n                        <span>\n                            <p class=\"key\">" + keyStr + "</p>\n                            <span class=\"iconfont icon-arrow\"></span>\n                        </span>\n                        <span class=\"line-top-border\" " + (appendkeyStr.length ? '' : 'style="display: none"') + ">\n                            <strong> <span class=\"keyWord-tags\">\u9644\u52A0\u8BCD</span></strong>\n                            <p class=\"addition\">" + appendkeyStr + "</p>\n                        </span>\n                        <span class=\"line-top-border\" " + (notkeyStr.length ? '' : 'style="display: none"') + ">\n                            <strong> <span class=\"keyWord-tags exclude\">\u6392\u9664\u8BCD</span></strong>\n                            <p class=\"notkey\">" + notkeyStr + "</p>\n                        </span>\n                    </div>\n                </div>\n                <div class=\"swiper-slide delete-button\" onclick=\"deleteKey(this)\" style=\"height: 128px;\">\u5220\u9664</div>\n            </div>\n        </li>\n        ";
-        $('.showKeyWord ul').append(tempHTML);
-    }
-} //强制弹出 提示信息
-
-
-function showMeg() {
-    // 如果是苹果手机，打开时候要设置top
-    var agent = navigator.userAgent.toLowerCase();
-    var dialog = $('.classify-show-pop .weui-dialog');
-
-    if (/iphone|ipod|ipad|ios/.test(agent)) {
-        dialog.css({
-            'top': '30%'
-        });
-    } else {
-        dialog.css({
-            'top': '50%'
-        });
-    }
-
-    $('.classify-show-pop').show();
-}
-
-function upDrawClassPage() {
-    var ClassPageData = PageData.a_items[PageData.classIndex];
-    $(".classify .classify-detail").text(ClassPageData.s_item);
-    $(".delete-box:not([data-c='" + PageData.classIndex + "'])").remove();
-    $('.showKeyWord ul').html('');
-    if (sessionStorage.fastimport != 1 && PageData.data && PageData.data.i_vip_fastimport == 0 && PageData.data.ordinarykc > 0) {
-        $(".classify-fast").show();
-    } else {
-        $(".classify-fast").hide();
-    }
-
-    if (ClassPageData.a_key && ClassPageData.a_key.length) {
-        // 旧有模式
-        // 判断是否需要提示分类
-        if (ClassPageData.i_tips !== 1 && !ClassPageData.tip) {
-            if (ClassPageData.s_item.indexOf('未分类') !== -1) {
-                showMeg();
-            }
-            var param = {};
-            param.classify_index = PageData.classIndex;
-            param.kws_tips = 1;
-            $.post("/subscribepay/afterPay/updateUserTips", param, function (r) {
-                if (r.flag) {
-                    ClassPageData.i_tips = 1;
-                }
-            });
-        }
-
-        $(".enter.addkeyWord").hide();
-        $(".add-keyword-container .addNewKeyword .jy-icon-add-box").show();
-        ClassPageData.a_key.forEach(function (v, i) {
-            drawKeyDom(i, v);
-        });
-        initSwiper();
-    } else {
-        // 新增模式
-        if (!ClassPageData.tip) {
-            modalOne();
-        }
-        $(".enter.addkeyWord").show();
-        $(".add-keyword-container .addNewKeyword .jy-icon-add-box").hide();
-    }
-}
-
-function drawKwsCount(count) {
-    $(".kws_count").text(count);
-}
-
-function drawDom(a_items) {
-    var allHTML = '';
-    var keysArr = [];
-    var classArr = [];
-    a_items.forEach(function (data, i) {
-        data.keys = data.a_key.map(function (v) {
-            return v.key.join(' ');
-        });
-        keysArr = keysArr.concat(data.keys);
-        classArr.push(data.s_item);
-        var tempHTML = "\n            <li class=\"classify-item\" data-c=\"" + i + "\">\n                <div>\n                    <span class=\"classify-item-l\">" + data.s_item + "</span>\n                    <span class=\"classify-item-r\">\n                        <span class=\"classify-item-detail\">" + data.keys.length + "\u4E2A\u5173\u952E\u8BCD</span>\n                        <span class=\"iconfont icon-arrow\"></span>\n                    </span>\n                </div>\n                <div class=\"classifyKeysShow\">" + data.keys.join('、') + "</div>\n            </li>";
-        allHTML += tempHTML;
-    });
-    PageData.keysArr = keysArr;
-    PageData.classArr = classArr;
-    drawKwsCount(PageData.keysArr.length);
-    $(".keyWord .all-classify-column ul.classify-list").html(allHTML);
-    checkPageStatus();
-    return allHTML;
-} //
-
-
-function modalOne() {
-    // 如果是苹果手机，打开时候要设置top
-    var agent = navigator.userAgent.toLowerCase();
-    var dialog = $('.classify-edit-pop .weui-dialog');
-
-    if (/iphone|ipod|ipad|ios/.test(agent)) {
-        dialog.css({
-            'top': '30%'
-        });
-    } else {
-        dialog.css({
-            'top': '50%'
-        });
-    }
-
-    $('.classify-edit-pop').show();
-    var currentClassifyName = $(".classify").find('.classify-detail').text();
-
-    if (currentClassifyName.indexOf("未分类") > -1) {
-        currentClassifyName = "";
-    }
-
-    $('input.classify-keyword').val(currentClassifyName).focus();
-} //
-
-
-function modalTwo() {
-    $(".fastICName").text($(".classify-detail").text()); // 如果是苹果手机，打开时候要设置top
-
-    var agent = navigator.userAgent.toLowerCase();
-    var dialog = $('.classify-fast-pop .weui-dialog');
-
-    if (/iphone|ipod|ipad|ios/.test(agent)) {
-        dialog.css({
-            'top': '40%'
-        });
-    } else {
-        dialog.css({
-            'top': '50%'
-        });
-    }
-
-    $('.classify-fast-pop').show();
-} // 显示关键词分类弹框
-
-
-$('.classify-r').on('click', function () {
-    modalOne();
-}); // 显示快速导入弹框
-
-$('.classify-fast').on('click', 'i', function () {
-    sessionStorage.fastimport = 1;
-    $('.classify-fast').hide();
-});
-$('.classify-fast').on('click', 'a', function () {
-    modalTwo();
-});
-$('.classify-edit-pop .classify-keyword').bind('input propertychange', function () {
-    var s = $('input.classify-keyword').val(); // 去空格
-
-    s = s.trim().slice(0, 20);
-
-    if (s.length === 0) {
-        $('.weui-dialog__ft .dialog__btn_confirm').addClass("opacity6");
-        return;
-    }
-
-    $('.weui-dialog__ft .dialog__btn_confirm').removeClass("opacity6");
-}); // 关键词分类 - 确定按钮点击事件
-
-$('.classify-edit-pop .dialog__btn_confirm').on('click', function () {
-    var classify_name = $.trim($('input.classify-keyword').val()); // 去空格
-
-    classify_name = classify_name.trim();
-
-    if (classify_name.length === 0) {
-        return;
-    } //分类名称是否已存在
-
-
-    if (PageData.classArr.indexOf(classify_name) !== -1) {
-        return wToast('此分类名称已存在');
-    }
-
-    if (classify_name.length > 20) {
-        return wToast('分类名称最大长度为20个字符');
-    }
-
-    $(this).removeClass("opacity6"); // 关闭弹框后要重置input内容
-
-    $('.classify-edit-pop').hide();
-    $('input.classify-keyword').val('');
-    PageData.keyIndex = 0;
-    var tempName = PageData.a_items[PageData.classIndex].s_item;
-    PageData.a_items[PageData.classIndex].s_item = classify_name; // 新增分类时不提交
-
-    if (PageData.classArr.length === PageData.classIndex || !PageData.a_items[PageData.classIndex].a_key.length) {
-        $(".classify-item[data-c='" + PageData.classIndex + "'] .classify-item-l").text(classify_name);
-        $('.classify-r .classify-detail').text(classify_name);
-        PageData.classArr.splice(PageData.classArr.indexOf(tempName), 1, classify_name);
-        history.replaceState({
-            classIndex: PageData.classIndex,
-            className: classify_name
-        }, "classPage", location.pathname);
-        return;
-    }
-
-    if (setPageData('SC')) {
-        $(".classify-item[data-c='" + PageData.classIndex + "'] .classify-item-l").text(classify_name);
-        $('.classify-r .classify-detail').text(classify_name);
-        PageData.classArr.splice(PageData.classArr.indexOf(tempName), 1, classify_name);
-        history.replaceState({
-            classIndex: PageData.classIndex,
-            className: classify_name
-        }, "classPage", location.pathname);
-        wToast('关键词分类添加成功');
-    } else {
-        PageData.a_items[PageData.classIndex].s_item = tempName;
-    }
-}); // 关键词分类 - 取消按钮点击事件
-
-$('.classify-edit-pop .dialog__btn_cancel').unbind('click').on('click', function () {
-    setTimeout(function () {
-        $('.classify-edit-pop').hide();
-        $('input.classify-keyword').val('');
-    }, 300);
-    return true;
-});
-
-var missingNumber = function missingNumber(nums) {
-    nums = nums.sort(function (a, b) {
-        return a - b;
-    });
-
-    for (var i = 0, n; i < nums.length; i++) {
-        if (nums[i] + 1 != nums[i + 1]) {
-            n = nums[i] + 1;
-            break;
-        }
-    }
-
-    return nums[0] != 0 ? 0 : n;
-};
-
-function getMaxClassName() {
-    var defalutT = '未分类';
-    var tempArr = PageData.classArr.filter(function (v) {
-        return /^未分类(\d+)$/.test(v) || v === defalutT;
-    }).map(function (v) {
-        return +v.replace(defalutT, '') + 0;
-    });
-
-    if (tempArr.length) {
-        return defalutT + (missingNumber(tempArr) > 0 ? missingNumber(tempArr) : '');
-    }
-
-    return defalutT;
-} // 添加关键词
-
-
-function addNewKeys() {
-    if (PageData.keysArr.length >= 300) {
-        return wToast('最多添加300组关键词');
-    }
-
-    PageData.keyIndex = PageData.a_items[PageData.classIndex].keys.length;
-    setSesstion();
-    window.location.href = '/jyapp/vipsubscribe/toSetaddKeyPage';
-}
-
-$(function () {
-    getPageData();
-    $(window).off('popstate', checkPageStatus);
-    $(window).on('popstate', checkPageStatus); // 新增分类
-
-    $(".addClassify").on('click', function () {
-        PageData.classIndex = PageData.classArr.length;
-        PageData.a_items[PageData.classIndex] = {
-            a_key: [],
-            keys: [],
-            s_item: getMaxClassName()
-        };
-        toggleSection(false);
-        history.pushState({
-            classIndex: PageData.classIndex,
-            className: getMaxClassName()
-        }, "classPage", location.pathname);
-    }); // 提示分类弹窗
-
-    $('.classify-show-pop .dialog__btn_confirm').on('click', function () {
-        $('.classify-show-pop').hide();
-        modalOne();
-    });
-    $('.classify-show-pop .dialog__btn_cancel').on('click', function () {
-        $('.classify-show-pop').hide();
-    }); // 快速导入
-    // 关键词分类 - 去设置按钮点击事件
-
-    $('.classify-fast-pop .dialog__btn_confirm').on('click', function () {
-        var loading = weui.loading();
-        $.ajax({
-            type: "POST",
-            url: "/subscribepay/afterPay/fastImport",
-            data: {
-                c_index: PageData.classIndex,
-                k_index: PageData.keysArr.length,
-                c_name: $(".classify-detail").text()
-            },
-            dataType: "json",
-            async: false,
-            traditional: true,
-            success: function success(r) {
-                $('.classify-fast-pop').hide();
-
-                if (r.flagInt == 1) {
-                    $(".classify-fast").hide();
-                    wToast('成功导入' + r.kwMap.length + '个关键词');
-                    getPageData();
-                } else {
-                    wToast('导入失败');
-                }
-
-                try {
-                    JyObj.checkLab(); //刷新搜索首页和订阅首页
-
-                    sessionStorage.reloadHomePage = true;
-                    sessionStorage.reloadSubPage = true;
-                } catch (e) {}
-            }
-        });
-        loading.hide();
-    }); // 关键词分类 - 取消按钮点击事件
-
-    $('.classify-fast-pop .dialog__btn_cancel').on('click', function () {
-        $('.classify-fast-pop').hide();
-    }); // 新增关键词
-
-    $(".addButton").on('click', addNewKeys);
-    $(".addNewKeyword .jy-icon-add-box").on('click', addNewKeys); // 分类点击事件
-
-    $(".keyWord .all-classify-column ul.classify-list").on('click', 'li', function (e) {
-        var index = $(this).index();
-        PageData.classIndex = index;
-        toggleSection(false);
-        history.pushState({
-            classIndex: PageData.classIndex,
-            className: PageData.a_items[PageData.classIndex].s_item
-        }, "classPage", location.pathname);
-    });
-});

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

@@ -1,108 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-    {{include "/common/meta.html"}}
-    <meta name="viewport"
-          content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,viewport-fit=cover" />
-    <meta name="apple-mobile-web-app-capable" content="yes">
-    <meta name="apple-mobile-web-app-status-bar-style" content="black">
-    <title>关键词</title>
-    <link href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/layout.css' rel="stylesheet">
-    <link href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/css/font.css?v={{Msg "seo" "version"}}' rel="stylesheet">
-    <script src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/rem.js'></script>
-    <link rel="stylesheet"
-          href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}'>
-    <link rel="stylesheet"
-          href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}'>
-    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/weui.min.css'>
-    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/addKeyWord.css?v={{Msg "seo" "version"}}'>
-    <style>
-        .addImg {
-            background-image: url('{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/image/delete.png?v={{Msg "seo" "version"}}');
-        }
-    </style>
-</head>
-
-<body>
-<div class="app-layout-header jy-app-header z999">
-    <span class="app-back jyapp-icon jyapp-icon-zuojiantou"></span>
-    关键词
-    <span></span>
-</div>
-
-<div class="app-layout-content-b add-key-word">
-    <div class="sticky-box">
-        <div class="input-box">
-            <span>关键词</span>
-            <input id="keyStr" type="text" placeholder="请输入关键词">
-        </div>
-        <div class="select-input">
-            <div class="input-box">
-                <span>附加词</span>
-                <input type="text" placeholder="请输入附加词">
-                <a href="javascript:;" disabled="true" class="weui-dialog__btn jy__btn_primary disabled">添加</a>
-            </div>
-            <div class="input-box right-box">
-                <span>排除词</span>
-                <input type="text" placeholder="请输入排除词">
-                <a href="javascript:;" disabled="true" class="weui-dialog__btn jy__btn_primary disabled">添加</a>
-            </div>
-            <div class="fixed-tip-button">
-                <div class="add-box" onclick="addInput(true)">
-                    <span class="jy-icon-add"></span>
-                    <span>添加附加词</span>
-                </div>
-                <div class="add-box" onclick="addInput(false)">
-                    <span class="jy-icon-add"></span>
-                    <span>添加排除词</span>
-                </div>
-            </div>
-        </div>
-    </div>
-    <div class="content-box">
-        <div class="q-tip">
-            <div class="call-dialog" onclick="openDialog('help')">
-                <i class="iconfont icon-wenhao"></i>&nbsp;疑问解答
-            </div>
-        </div>
-        <div class="input-group" id="include"></div>
-        <div class="input-group" id="exclude"></div>
-    </div>
-    <!--submit-->
-    <div class="fixed-bottom safe-area-inset-bottom">
-        <a href="javascript:;" onclick="deleteKeys()" style="display: none" class="weui-dialog__btn jy__btn_delete">删除 </a>
-        <a href="javascript:;" disabled="true" class="weui-dialog__btn jy__btn_primary submitButton disabled">确认</a>
-    </div>
-    <!--dialog-->
-    <div class="problemPop dialog-container" data-dialog="help" onclick="openDialog('help')" style="display: none;">
-        <div class="problemPopContent" onclick="event.stopPropagation()">
-            <h3>疑问解答</h3>
-            <ul>
-                <li>
-                    <p>例：某公司主营业务为软件系统开发</p>
-                </li>
-                <li>
-                    <h4>关键词:</h4>
-                    <p>目标信息中的关键性词语，如“软件系统”</p>
-                </li>
-                <li>
-                    <h4>附加词:</h4>
-                    <p>与关键词形成一体/组合，便于查找准确信息，如“开发”</p>
-                </li>
-                <li>
-                    <h4>排除词:</h4>
-                    <p>与关键词互斥，可排除一部分非目标信息，如“运维”</p>
-                </li>
-            </ul>
-            <a href="javascript:;" class="weui-dialog__btn knowBtn" onclick="openDialog('help', event)">我知道了</a>
-        </div>
-    </div>
-</div>
-<script src='https://cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js'></script>
-<script src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/weui.min.js'></script>
-{{include "/common/js.html"}}
-<script src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/js/addKeyWord.js?v={{Msg "seo" "version"}}'></script>
-{{include "/common/baiducc.html"}}
-</body>
-</html>

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

@@ -1,167 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-	{{include "/common/meta.html"}}
-    <title>附加词</title>
-	<link href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/layout.css" rel="stylesheet">
-	<link href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/css/font.css?v={{Msg "seo" "version"}}" rel="stylesheet">
-    <script src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/rem.js"></script>
-    <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}">
-    <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}">
-    <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/weui.min.css">
-    <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/addition_exclusive_word.css?v={{Msg "seo" "version"}}">
-</head>
-
-<body>
-	<div class="app-layout-header jy-app-header">
-		<span class="app-back jyapp-icon jyapp-icon-zuojiantou"></span>
-		附加词
-	<span></span></div>
-
-	<div class="app-layout-content-b">
-	    <div class="addition-word">
-	        <section class="content">
-	            <p class="title">示例：开发（附加词）</p>
-	            <!-- 添加附加词 -->
-	            <div class="enter addkeyWord" style="display: none;">
-	                <input type="text" class="enterOne" maxlength="20" placeholder="请输入附加词" />
-	                <div class="btn">
-	                    <button onclick="Cancel()" style="width:49%;background:#fff;color:#2cb7ca;opacity: 1;">取消</button>
-	                    <button disabled>确认</button>
-	                </div>
-	            </div>
-
-	            <!-- 添加附加词显示列表 -->
-	            <div class="showKeyWord" style="display: none;">
-	                <ul>
-
-	                </ul>
-	            </div>
-	            <div class="problem">
-	                疑问解答 <i class="iconfont icon-wenhao"></i>
-	            </div>
-	        </section>
-	        <div class="addKeyWord" style="display:none;">
-	            <i class="iconfont icon-tianjia"></i>
-	        </div>
-	        <!-- 疑难问题弹窗 -->
-	        <div class="problemPop">
-	            <div class="problemPopContent">
-	                <h3>疑问解答</h3>
-	                <ul>
-	                    <li>
-	                        <p>例：某公司主营业务为软件系统开发</p>
-	                    </li>
-	                    <li>
-	                        <h4>关键词:</h4>
-	                        <p>目标信息中的关键性词语，如“软件系统”</p>
-	                    </li>
-	                    <li>
-	                        <h4>附加词:</h4>
-	                        <p>与关键词形成一体/组合，便于查找准确信息，如“开发”</p>
-	                    </li>
-	                    <li>
-	                        <h4>排除词:</h4>
-	                        <p>与关键词互斥，可排除一部分非目标信息，如“运维”</p>
-	                    </li>
-	                </ul>
-	                <button class="knowBtn">我知道了</button>
-	            </div>
-	        </div>
-	    </div>
-    </div>
-	<script src="https://cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js"></script>
-    <script src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/weui.min.js"></script>
-    <script src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/js/additionWord.js?v={{Msg "seo" "version"}}"></script>
-	{{include "/common/js.html"}}
-    <script>
-        var addition_kws = []//附加词
-        var _addkws = "";
-        var _addindex = -1;
-		var addkws_arr = {}
-        $(function() {
-			(/iphone|ipod|ipad/i.test(navigator.appVersion)) && document.addEventListener('blur', function(e) {
-				// 这里加了个类型判断，因为a等元素也会触发blur事件
-				['input', 'textarea'].includes(e.target.localName) && document.body.scrollIntoView(true)
-			}, true)
-            if(sessionStorage&&sessionStorage.addition_kws!=undefined){
-                addition_kws = JSON.parse(sessionStorage.addition_kws);
-                appendHtml(addition_kws);
-            }else{
-                $(".enter.addkeyWord").show();
-                $(".showKeyWord").hide();
-            }
-        })
-		//
-		function Cancel(){
-			if($(".showKeyWord li").length==0){
-				window.history.go(-1)
-			}else{
-				$(".content .addkeyWord").hide();
-        		$(".addKeyWord").show();
-			}
-		}
-        //
-        function appendHtml(data){
-            if (data.length>0){
-				$('.addKeyWord').show();
-                var additionHtml = '';
-                for (var i = data.length - 1; i >= 0; i--) {
-					addkws_arr[data[i]]=i
-                    additionHtml +='<li>'
-                                    +'<div class="one">'
-                                    +'<div>'
-                                    +'<span>'
-                                    +'<p class="key">'+data[i]+'</p>'
-                                    +'</span>'
-                                    +'</div>'
-                                    +'<button class="editKeyWord" dataIndex="'+i+'"><i class="iconfont icon-xiugai"></i> 修改</button>'
-                                    +'</div>'
-                                    +'<div class="modify">'
-                                    +'<textarea  name=""  rows="1"  placeholder="" maxlength="20" >'+data[i]+'</textarea>'
-                                    +'<button class="deleteKey">删除</button>'
-                                    +'<button class="ascertainKey">确定</button>'
-                                    +'</div>'
-                                    +'</li>'
-                }
-                $(".showKeyWord ul").html(additionHtml);
-                $(".enter.addkeyWord").hide();
-                $(".showKeyWord").show();
-            }else{
-                $(".enter.addkeyWord").show();
-                $(".showKeyWord").hide();
-            }
-        }
-        //
-        function saveSession(t,i,index){
-            if (_addkws!=""){
-                if(t!="D"){
-                    if($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex")!=undefined&&i <= Number($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex"))){
-						for (var n in addkws_arr){
-							if(addkws_arr[n]==i){
-								delete addkws_arr[n];
-							}
-						}
-						addkws_arr[_addkws] = i;
-                        addition_kws[index] = _addkws
-                    }else{
-						addkws_arr[_addkws] = i;
-                        addition_kws.push(_addkws)
-                    }
-                }else{
-					for (var n in addkws_arr){
-						if(addkws_arr[n]==i){
-							delete addkws_arr[n];
-						}
-					}
-                    addition_kws.splice(index,1);
-                }
-                sessionStorage.addition_kws = JSON.stringify(addition_kws)
-           }
-        }
-    </script>
-	{{include "/common/baiducc.html"}}
-</body>
-
-</html>

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

@@ -1,167 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-	{{include "/common/meta.html"}}
-    <title>排除词</title>
-	<link href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/layout.css" rel="stylesheet">
-	<link href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/css/font.css?v={{Msg "seo" "version"}}" rel="stylesheet">
-    <script src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/rem.js"></script>
-    <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}">
-    <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}">
-    <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/weui.min.css">
-    <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/addition_exclusive_word.css?v={{Msg "seo" "version"}}">
-</head>
-
-<body>
-	<div class="app-layout-header jy-app-header">
-		<span class="app-back jyapp-icon jyapp-icon-zuojiantou"></span>
-		排除词
-	<span></span></div>
-
-	<div class="app-layout-content-b">
-	    <div class="exclusive-word">
-	        <section class="content">
-	            <p class="title">示例：运维（排除词）</p>
-	            <!-- 添加排除词 -->
-	            <div class="enter addkeyWord">
-	                <input type="text" class="enterOne" maxlength="20" placeholder="请输入排除词" />
-	                <div class="btn">
-					    <button onclick="Cancel()" style="width:49%;background:#fff;color:#2cb7ca;opacity: 1;">取消</button>
-	                    <button disabled>确认</button>
-	                </div>
-	            </div>
-	            <!-- 添加排除词显示列表 -->
-	            <div class="showKeyWord">
-	                <ul>
-
-	                </ul>
-	            </div>
-	            <div class="problem">
-	                疑问解答 <i class="iconfont icon-wenhao"></i>
-	            </div>
-	        </section>
-	        <div class="addKeyWord" style="display:none;">
-	            <i class="iconfont icon-tianjia"></i>
-	        </div>
-	        <!-- 疑难问题弹窗 -->
-	        <div class="problemPop">
-	            <div class="problemPopContent">
-	                <h3>疑问解答</h3>
-	                <ul>
-	                    <li>
-	                        <p>例：某公司主营业务为软件系统开发</p>
-	                    </li>
-	                    <li>
-	                        <h4>关键词:</h4>
-	                        <p>目标信息中的关键性词语，如“软件系统”</p>
-	                    </li>
-	                    <li>
-	                        <h4>附加词:</h4>
-	                        <p>与关键词形成一体/组合，便于查找准确信息，如“开发”</p>
-	                    </li>
-	                    <li>
-	                        <h4>排除词:</h4>
-	                        <p>与关键词互斥，可排除一部分非目标信息，如“运维”</p>
-	                    </li>
-	                </ul>
-	                <button class="knowBtn">我知道了</button>
-	            </div>
-	        </div>
-	    </div>
-    </div>
-	<script src="https://cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js"></script>
-    <script src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/weui.min.js"></script>
-    <script src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/js/exclusiveWord.js?v={{Msg "seo" "version"}}"></script>
-	{{include "/common/js.html"}}
-    <script>
-        var not_kws = []//排除词
-        var _notkws = "";
-        var _notindex = -1;
-		var notkws_arr = {}
-        $(function() {
-			(/iphone|ipod|ipad/i.test(navigator.appVersion)) && document.addEventListener('blur', function(e) {
-				// 这里加了个类型判断，因为a等元素也会触发blur事件
-				['input', 'textarea'].includes(e.target.localName) && document.body.scrollIntoView(true)
-			}, true)
-            if(sessionStorage&&sessionStorage.not_kws!=undefined){
-                not_kws = JSON.parse(sessionStorage.not_kws);
-                appendHtml(not_kws);
-            }else{
-                $(".enter.addkeyWord").show();
-                $(".showKeyWord").hide();
-            }
-        })
-		//
-		function Cancel(){
-			if($(".showKeyWord li").length==0){
-				window.history.go(-1)
-			}else{
-				$(".content .addkeyWord").hide();
-        		$(".addKeyWord").show();
-			}
-		}
-        //
-        function appendHtml(data){
-            if (data.length>0){
-				$('.addKeyWord').show();
-                var additionHtml = '';
-                for (var i = data.length - 1; i >= 0; i--) {
-					notkws_arr[data[i]]=i
-                    additionHtml +='<li>'
-                                    +'<div class="one">'
-                                    +'<div>'
-                                    +'<span>'
-                                    +'<p class="key">'+data[i]+'</p>'
-                                    +'</span>'
-                                    +'</div>'
-                                    +'<button class="editKeyWord" dataIndex="'+i+'"><i class="iconfont icon-xiugai"></i> 修改</button>'
-                                    +'</div>'
-                                    +'<div class="modify">'
-                                    +'<textarea  name=""  rows="1"  placeholder="" maxlength="20" >'+data[i]+'</textarea>'
-                                    +'<button class="deleteKey">删除</button>'
-                                    +'<button class="ascertainKey">确定</button>'
-                                    +'</div>'
-                                    +'</li>'
-                }
-                $(".showKeyWord ul").html(additionHtml);
-                $(".enter.addkeyWord").hide();
-                $(".showKeyWord").show();
-            }else{
-                $(".enter.addkeyWord").show();
-                $(".showKeyWord").hide();
-            }
-        }
-        //
-        function saveSession(t,i,index){
-            if (_notkws!=""){
-                if(t!="D"){
-                    if($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex")!=undefined&&i <= Number($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex"))){
-						for (var n in notkws_arr){
-							if(notkws_arr[n]==i){
-								delete notkws_arr[n];
-							}
-						}
-						notkws_arr[_notkws] = i;
-                        not_kws[index] = _notkws
-                    }else{
-						notkws_arr[_notkws] = i;
-                        not_kws.push(_notkws)
-                    }
-                }else{
-					for (var n in notkws_arr){
-						console.log(n,i)
-						if(notkws_arr[n]==i){
-							delete notkws_arr[n];
-						}
-					}
-                    not_kws.splice(index,1)
-                }
-                sessionStorage.not_kws = JSON.stringify(not_kws)
-           }
-        }
-    </script>
-	{{include "/common/baiducc.html"}}
-</body>
-
-</html>

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

@@ -0,0 +1,132 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    {{include "/common/meta.html"}}
+    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,viewport-fit=cover" />
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-status-bar-style" content="black">
+    <title>订阅关键词</title>
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/layout.css' />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/css/font.css?v={{Msg "seo" "version"}}' />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}' />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}' />
+    <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/index.css />
+    <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/icon/local.css />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/public_.css?v={{Msg "seo" "version"}}' />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/keyword-common.css?v={{Msg "seo" "version"}}' />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/keyword-info.css?v={{Msg "seo" "version"}}' />
+</head>
+
+<body>
+<div class="app-layout-header jy-app-header z999">
+    <span class="app-back jyapp-icon jyapp-icon-zuojiantou"></span>
+    <span>订阅关键词</span>
+    <span></span>
+</div>
+<div class="app-layout-content-b" v-cloak>
+    <div class="j-container">
+        <div class="j-main">
+            <div class="module-key pd">
+                <div class="m-header">
+                    <div class="m-h-left batch-delete">关键词</div>
+                    <div class="m-h-right batch-delete" v-show="!showNotKeyModule" @click="showNotKeyModule=true">+ 添加排除词</div>
+                </div>
+                <van-field
+                    class="card-radius key-textarea"
+                    v-model.trim="keyInfo.key"
+                    rows="3"
+                    maxlength="200"
+                    autosize
+                    type="textarea"
+                    placeholder="请输入关键词，多个关键词用空格隔开，例如：税务局 软件"
+                ></van-field>
+            </div>
+            <div class="module-rec pd">
+                <div class="rec-cells card-radius" v-show="recListState.listAll.length">
+                    <div class="rec-header">
+                        <div class="rec-title">相似订阅条件推荐</div>
+                        <div class="rec-change" @click="nextPageRec">
+                            <van-icon :class="recListState.loading ? 'active' : ''" name="replay"></van-icon>
+                            <span class="text">换一批</span>
+                        </div>
+                    </div>
+                    <div class="rec-content">
+                        <div class="rec-tags">
+                            <div class="tag" v-for="(item,index) in recListState.list" :key="index" v-text="item" @click="clickTag(item)">筛选</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="module-match-way pd">
+                <div class="m-header">
+                    <div class="m-h-left batch-delete">匹配模式</div>
+                    <div></div>
+                </div>
+                <div class="match-way-list">
+                    <div
+                        class="match-way-item card-radius"
+                        :class="{ active: item.value == keyInfo.matchWay }"
+                        v-for="(item,index) in matchWayList"
+                        @click="keyInfo.matchWay = item.value"
+                        :key="index">
+                        <div class="m-w-i-title">${ item.title }</div>
+                        <div class="m-w-i-subinfo">${ item.subInfo }</div>
+                    </div>
+                </div>
+            </div>
+            <div class="module-not-key pd" v-show="showNotKeyModule">
+                <div class="m-header">
+                    <div class="m-h-left batch-delete">排除词</div>
+                    <div></div>
+                </div>
+                <van-field
+                    class="card-radius key-textarea"
+                    v-model.trim="keyInfo.notKey"
+                    rows="3"
+                    maxlength="200"
+                    autosize
+                    type="textarea"
+                    placeholder="请输入排除词，多个关键词用空格隔开，例如：税务局 软件"
+                ></van-field>
+                <div class="err-tip">不希望接收，与关键词互斥</div>
+            </div>
+        </div>
+        <div class="j-footer">
+            <van-notice-bar
+                v-show="tooLittleTipShow"
+                class="footer-tip center"
+                color="#ff9f40"
+                background="#fff4e8"
+                :scrollable="false"
+                :wrapable="true">
+                当前匹配信息过少，请适当修改关键词
+            </van-notice-bar>
+            <div class="j-button-group add" v-if="pInfo.editType === 'add'">
+                <button class="j-button-confirm" @click="saveKeyWord" :disabled="!keyInfo.key">
+                    <span class="info-text">确认</span>
+                    <span class="sub-text" v-if="false">（近3个月内共匹${ pInfo.pushCount }条信息）</span>
+                </button>
+            </div>
+            <div class="j-button-group edit" v-if="pInfo.editType === 'edit'">
+                <button class="j-button-cancel" @click="delThisKey">删除</button>
+                <button class="j-button-confirm" @click="saveKeyWord">
+                    <span class="info-text">确认</span>
+                    <span class="sub-text">（近3个月内共匹配${ pInfo.pushCount }条信息）</span>
+                </button>
+            </div>
+        </div>
+    </div>
+</div>
+<script src=//cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js></script>
+<script src=//cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js></script>
+<script src=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/vant.min.js></script>
+<script src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/big-member/js/utils.js?v={{Msg "seo" "version"}}'></script>
+<script>
+    utils.iosBackRefresh()
+</script>
+<script src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/js/keyword-info.js?v={{Msg "seo" "version"}}'></script>
+{{include "/common/js.html"}}
+{{include "/common/baiducc.html"}}
+</body>
+</html>

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

@@ -3,248 +3,203 @@
 
 <head>
     {{include "/common/meta.html"}}
-    <meta name="viewport"
-          content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,viewport-fit=cover" />
-    <meta name="apple-mobile-web-app-capable" content="yes">
-    <meta name="apple-mobile-web-app-status-bar-style" content="black">
+    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,viewport-fit=cover" />
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
     <title>关键词</title>
-    <link href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/layout.css" rel="stylesheet">
-    <link href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/css/font.css?v={{Msg "seo" "version"}}" rel="stylesheet">
-    <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}">
-    <link rel="stylesheet"
-          href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}">
-    <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/weui.min.css">
-    <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/keyWord.css?v={{Msg "seo" "version"}}">
-    <script src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/rem.js"></script>
-    <link rel="stylesheet" type="text/css" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/swiper.min.css" />
-    <script src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/swiper.min.js"></script>
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/layout.css' />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/css/font.css?v={{Msg "seo" "version"}}' />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}' />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}' />
+    <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/index.css />
+    <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/icon/local.css />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/public_.css?v={{Msg "seo" "version"}}' />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/keyword-common.css?v={{Msg "seo" "version"}}' />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/keyWord.css?v={{Msg "seo" "version"}}' />
     <style>
         .ios-user-select {
             -webkit-user-select: text;
         }
-
-        .opacity6 {
-            opacity: 0.6;
-        }
-
-        .classifyKeysShow {
-            font-size: .25rem;
-            color: #686868;
-            margin-top: 0.1rem;
-            text-overflow: ellipsis;
-            overflow: hidden;
-            display: -webkit-box;
-            -webkit-line-clamp: 1;
-            -webkit-box-orient: vertical;
-        }
-
-        .all-classify-column {
-            position: relative;
-            padding-bottom: 1rem;
-        }
-
-        .weui-mask {
-            height: 100vh;
-        }
-    </style>
-    <style>
-        .keyWord .all-classify-column .classify-list .classify-item > div:first-of-type  {
-            line-height: 1;
-            padding: 0.04rem 0;
-        }
-        .keyWord .all-classify-column .classify-list .classify-item .classify-item-l {
-            color: #171826;
-            font-weight: 500;
-        }
-        .keyWord .all-classify-column .classify-list .classify-item .classify-item-r {
-            color: #9B9CA3;
-        }
-        .keyWord .all-classify-column .classify-list .classify-item .classify-item-r .icon-arrow {
-            color: #C0C4CC;
-        }
-        .classifyKeysShow {
-            color: #5F5E64;
-        }
-    </style>
-    <style>
-        /* 新添加 icon */
-        .jy-icon-add-box {
-            position: fixed;
-            bottom: .5rem;
-            bottom: calc(constant(safe-area-inset-bottom) + 0.5rem);
-            bottom: calc(env(safe-area-inset-bottom) + 0.5rem);
-            margin-bottom: .3rem;
-            background: #2cb7ca;
-            width: 56px;
-            height: 56px;
-            border-radius: 50%;
-            text-align: center;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-        }
-        .jy-icon-add-box .jy-icon-add {
-            margin-right: 0;
-        }
-        .jy-icon-add-box .jy-icon-add:before, .jy-icon-add-box .jy-icon-add:after {
-            width: 0.36rem;
-        }
     </style>
 </head>
 
 <body>
-
 <div class="app-layout-header jy-app-header z999">
     <span class="app-back jyapp-icon jyapp-icon-zuojiantou"></span>
-    <span>关键词分类</span>
-<span></span></div>
-
-<div class="app-layout-content-b safe-area-inset-bottom-padding">
-    <div class="keyWord">
-        <section class="add-keyword-container" style="display: none;">
-            <div>
-                <p class="classify-fast" style="display:none;">
-                    <i class="jy-icon-add" style="transform: rotate(45deg);"></i>
-                    <span>导入免费订阅中的关键词及排除词</span>
-                    <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary" style="font-weight: 500;">快速导入</a>
-                </p>
-                <div class="classify">
-                    <span class="classify-l">关键词分类</span>
-                    <span class="classify-r">
-		                        <span class="classify-detail">未分类</span>
-		                        <span class="iconfont icon-arrow"></span>
-		                    </span>
+    <span>关键词</span>
+    <span></span>
+</div>
+<div class="app-layout-content-b" v-cloak>
+    <div class="j-container">
+        <div class="m-header fast-import" v-if="fastImportTipShow">
+            <van-icon name="plus" style="transform: rotate(45deg);" @click="tip.fastImport = false"></van-icon>
+            <div class="fast-import-text" style="flex: 1;">导入免费订阅中的关键词及排除词</div>
+            <div class="fast-import-button" @click="fastImportDialogShow">快速导入</div>
+        </div>
+        <div class="m-header">
+            <div class="group-filter-container">
+                <div class="filter-text">关键词组分类</div>
+                <div class="filter-button" @click="showFilterPicker(true)">
+                    <span>${ filter.groupName ? filter.groupName : '全部' }</span>
+                    <van-icon name="play"></van-icon>
                 </div>
-                <p class="classify-tips">
-                    关键词分类便于对同类别关键词做整合管理
-                </p>
             </div>
-            <section class="content">
-                <!-- 添加关键词 -->
-                <div class="enter addkeyWord" style="display: none;">
-                    <img alt="暂无关键词" src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/image/nothing.png?v={{Msg "seo" "version"}}'>
-                    <span>暂无关键词</span>
-                    <div class="addButton">
-                        <span class="jy-icon-add"></span>
-                        <span>添加关键词</span>
+            <div class="batch-delete h100" v-show="listShow" @click="batchDeleteStateChange">
+                ${ batchDeleteState ? '取消' : '批量删除' }
+            </div>
+        </div>
+        <div class="j-main">
+            <div class="keyword-list" v-show="listShow">
+                <div
+                    class="keywords-item"
+                    v-for="(item,index) in filter.keywordsList"
+                    :key="index">
+                    <div class="checkbox-container" :class="{ w0: !batchDeleteState }">
+                        <van-checkbox
+                            v-model="item.checked"
+                            checked-color="#2ABED1"
+                            icon-size="18px">
+                        </van-checkbox>
                     </div>
+                    <van-swipe-cell
+                        :name="index"
+                        :disabled="batchDeleteState"
+                        :before-close="beforeKeySwipeCellClose">
+                        <div class="j-key-card" @click="clickKeyCard(item)">
+                            <div class="j-key-card-top">
+                                <div class="k-c-t-l j-tag" :class="item.calcInfo.matchWayClass">${ item.calcInfo.matchWay }</div>
+                                <div class="k-c-t-c text-container">${ item.calcInfo.key }</div>
+                                <van-icon class="k-c-t-r" name="arrow"></van-icon>
+                            </div>
+                            <div class="j-key-card-bottom" v-if="item.calcInfo.notkey">
+                                <span class="subinfo-label">排除词：</span>
+                                <span class="subinfo-text text-container">${ item.calcInfo.notkey }</span>
+                            </div>
+                        </div>
+                        <template #right>
+                            <div class="delete-button">删除</div>
+                        </template>
+                    </van-swipe-cell>
                 </div>
-                <!-- 添加关键词显示列表 -->
-                <div class="showKeyWord">
-                    <ul>
-                    </ul>
+            </div>
+            <div class="key-empty" v-show="emptyShow">
+                <div class="empty-img-container">
+                    <img class="empty-img" src="/jyapp/images/wxkeyset/nopush.png">
                 </div>
-
-<!--               <div class="problem">-->
-<!--                   疑问解答111 <i class="iconfont icon-wenhao"></i>-->
-<!--               </div>-->
-            </section>
-
-            <div class="addKeyWord addNewKeyword safe-area-inset-bottom-padding">
-                <div class="jy-icon-add-box" style="display: none;">
-                    <span class="jy-icon-add"></span>
+                <div class="empty-text">暂无关键词组</div>
+                <button class="add-keyword-button" @click="addKeyWord" :disabled="filter.allKeywordsList.length >= conf.keywordMax">
+                    <van-icon name="plus"></van-icon>
+                    <span class="button-text">订阅关键词</span>
+                </button>
+                <div class="keywords-count">
+                    关键词添加数量：<span class="highlight-text">${ filter.allKeywordsList.length }</span> / ${ conf.keywordMax }
                 </div>
-                <p> 关键词添加数量：<em style="color: #2cb7ca;" class="kws_count">0 </em>&nbsp;/ 300</p>
-            </div>
-        </section>
-        <section class="all-classify-column" style="display: none;">
-            <ul class="classify-list">
-
-            </ul>
-
-            <div class="addKeyWord addNewKeyword safe-area-inset-bottom-padding">
-                <div class="keysexplain"><p> 关键词添加数量：<em style="color: #2cb7ca;" class="kws_count">0 </em>&nbsp;/ 300</p></div>
-                <div class="addClassify">新增关键词分类</div>
+          </div>
+        </div>
+        <div class="j-footer" v-show="listShow">
+            <van-notice-bar
+                class="footer-tip center"
+                color="#2abed1"
+                background="#fff"
+                :scrollable="false"
+                :wrapable="true">
+                任意1组关键词组匹配成功即推送相关信息
+            </van-notice-bar>
+            <div class="j-button-group" v-if="batchDeleteState">
+                <button class="j-button-confirm" @click="batchDelete" :disabled="this.selectedCount <= 0">
+                    <span class="info-text">删除</span>
+                    <span class="sub-text">（已选中${ selectedCount }项）</span>
+                </button>
             </div>
-        </section>
-
-        <!-- 疑难问题弹窗 -->
-        <div class="problemPop dialog-container">
-            <div class="problemPopContent">
-                <h3>疑问解答</h3>
-                <ul>
-                    <li>
-                        <p>例：某公司主营业务为软件系统开发</p>
-                    </li>
-                    <li>
-                        <h4>关键词:</h4>
-                        <p>目标信息中的关键性词语，如“软件系统”</p>
-                    </li>
-                    <li>
-                        <h4>附加词:</h4>
-                        <p>与关键词形成一体/组合，便于查找准确信息，如“开发”</p>
-                    </li>
-                    <li>
-                        <h4>排除词:</h4>
-                        <p>与关键词互斥，可排除一部分非目标信息，如“运维”</p>
-                    </li>
-                </ul>
-                <button class="knowBtn">我知道了</button>
+            <div class="j-button-group" v-else>
+                <button class="j-button-confirm" @click="addKeyWord" :disabled="filter.allKeywordsList.length >= conf.keywordMax">
+                    <span class="info-text">新增关键词</span>
+                    <span class="sub-text">（${ filter.allKeywordsList.length } / ${ conf.keywordMax }）</span>
+                </button>
             </div>
         </div>
-        <!-- 关键词分类弹框 -->
-        <div class="classify-edit-pop dialog-container">
-           <div class="weui-dialog weui-animate-fade-in">
-                <div class="weui-dialog__hd">
-                    <strong class="weui-dialog__title">关键词分类</strong>
-                </div>
-                <div class="weui-dialog__bd">
-                    <input type="text" class="classify-keyword" maxlength="20" placeholder="输入关键词分类名称" onBlur="window.scrollTo(0, 0)">
-                </div>
-                <div class="weui-dialog__ft">
-                    <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_default dialog__btn dialog__btn_cancel">取消</a>
-                    <a href="javascript:;" style="color: #2ABED1" class="weui-dialog__btn weui-dialog__btn_primary dialog__btn dialog__btn_confirm opacity6">确定</a>
-                </div>
+    </div>
+    <van-dialog
+        v-model="dialog.fastImport"
+        title="快速导入"
+        confirm-button-text="导入"
+        confirm-button-color="#2abed1"
+        @confirm="fastImport"
+        show-cancel-button>
+        <div class="fast-import-content">
+            快速导入可将免费版招标订阅内所设置的关键词及其排除词将一并导入至“未分类"关键词分类内，无需再次手动输入，简化您的订阅过程
+        </div>
+        <div class="fast-import-tip">
+            注：地区与行业分类以超级订阅设置内为准,不做导入。
+        </div>
+    </van-dialog>
+    <van-dialog
+        v-model="dialog.upgrade"
+        class="dialog-upgrade"
+        title="关键词升级提示"
+        confirm-button-text="我知道了"
+        confirm-button-color="#2abed1">
+        <div class="fast-import-content">
+            “附加词”已整合至“关键词”中，添加多个关键词用空格隔开即可，并可以灵活选择匹配模式（精准、模糊），示例说明：
+        </div>
+        <div class="fast-import-tip">
+            <div class="tip-label">调整前：</div>
+            <div class="tip-text">
+                <div class="tip-text-item">关键词：软件</div>
+                <div class="tip-text-item">附加词：系统</div>
             </div>
         </div>
-
-        <!-- 关键词分类说明 -->
-        <div class="classify-show-pop dialog-container">
-            <!-- <div class="weui-mask weui-animate-fade-in"></div> -->
-            <div class="weui-dialog weui-animate-fade-in">
-                <div class="weui-dialog__hd">
-                    <strong class="weui-dialog__title">提示信息</strong>
-                </div>
-                <div class="weui-dialog__bd">
-                    关键词分类有利于关键词做整合管理<br>工作更为高效！
-                </div>
-                <div class="weui-dialog__ft">
-                    <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary dialog__btn dialog__btn_confirm">去设置</a>
-                    <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_default dialog__btn dialog__btn_cancel">取消</a>
-                </div>
+        <div class="fast-import-tip">
+            <div class="tip-label">调整后：</div>
+            <div class="tip-text">
+                <div class="tip-text-item">关键词：软件 系统</div>
+                <div class="tip-text-item">匹配模式：精准（同时包含所有 关键词才推送）</div>
             </div>
         </div>
-        <!-- 快速导入说明 -->
-        <div class="classify-fast-pop dialog-container">
-            <!-- <div class="weui-mask weui-animate-fade-in"></div> -->
-            <div class="weui-dialog weui-animate-fade-in">
-                <div class="weui-dialog__hd">
-                    <strong class="weui-dialog__title">快速导入</strong>
-                </div>
-                <div class="weui-dialog__bd">
-                    快速导入可将免费版招标订阅内所设置的关键词及其排除词一并导入至“<span class="fastICName">未分类</span>”关键词分类内,无需再次手动输入，简化您的订阅过程。
-                    <p style="color:#888;">注：地区与行业分类以超级订阅设置内为准,不做导入。</p>
-                </div>
-                <div class="weui-dialog__ft">
-                    <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_default dialog__btn dialog__btn_cancel">取消</a>
-                    <a href="javascript:;"  style="color: #2ABED1" class="weui-dialog__btn weui-dialog__btn_primary dialog__btn dialog__btn_confirm">导入</a>
+    </van-dialog>
+    <van-popup
+        v-model="filter.pickerShow"
+        closeable
+        round
+        position="bottom"
+        close-icon="clear"
+        class="j-popup"
+        :style="{ height: '45%' }">
+        <div class="j-container">
+            <div class="popup-header header-title">关键词分类</div>
+            <div class="j-main">
+                <div class="keywords-group-list">
+                    <div class="keywords-group-item"
+                        @click="checkThisGroup"
+                        :class="{ active: !filter.groupName }">
+                        全部
+                    </div>
+                    <div class="keywords-group-item"
+                        v-for="(item, index) in groupNameList"
+                        :key="index"
+                        @click="checkThisGroup(item)"
+                        :class="{ active: item.name === filter.groupName }">
+                        ${ item.name }
+                    </div>
                 </div>
             </div>
+            <div class="j-button-group">
+                <button class="j-button-confirm" @click="toKeyManagePage">分类管理</button>
+            </div>
         </div>
-    </div>
+    </van-popup>
 </div>
-<script src='https://cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js'></script>
-<script src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/js/jquery.cookie.js?v={{Msg "seo" "version"}}'></script>
-<script src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/weui.min.js'></script>
-{{include "/common/js.html"}}
-<script src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/js/newKeyWord.js?v={{Msg "seo" "version"}}"></script>
+
+
+<script src=//cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js></script>
+<script src=//cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js></script>
+<script src=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/vant.min.js></script>
+<script src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/big-member/js/utils.js?v={{Msg "seo" "version"}}'></script>
 <script>
-    $(window).bind("pageshow", function (event) {
-        if (event.originalEvent.persisted) {
-            window.location.reload(true);
-        }
-    });
+    utils.iosBackRefresh()
 </script>
+<script src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/js/keyWord.js?v={{Msg "seo" "version"}}'></script>
+{{include "/common/js.html"}}
 {{include "/common/baiducc.html"}}
 </body>
 </html>

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

@@ -0,0 +1,157 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    {{include "/common/meta.html"}}
+    <title>关键词分类管理</title>
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/layout.css' />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/css/font.css?v={{Msg "seo" "version"}}' />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}' />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}' />
+    <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/index.css />
+    <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/icon/local.css />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/public_.css?v={{Msg "seo" "version"}}' />
+    <link rel="stylesheet" href='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/css/keyword-common.css?v={{Msg "seo" "version"}}' />
+    <style>
+        .m-header {
+            justify-content: flex-end;
+        }
+        .keywords-item .j-key-card {
+            flex-direction: row;
+            justify-content: space-between;
+        }
+        .j-key-card .j-key-card-left {
+            font-size: .28rem;
+            color: #171826;
+            line-height: .4rem;
+        }
+        .j-key-card .j-key-card-right {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            font-size: .24rem;
+            color: #5f5e64;
+            line-height: .36rem;
+        }
+        .j-key-card .fill-in-svg {
+            margin-left: .16rem;
+            width: .36rem;
+            height: .36rem;
+            transition: width 0.5s ease;
+        }
+        .j-key-card .fill-in-svg.w0 {
+            margin-left: 0;
+            width: 0;
+        }
+        .fill-in-svg > img {
+            display: block;
+            width: 100%;
+            height: 100%;
+        }
+        .keyword-list {
+            padding-top: 0;
+        }
+    </style>
+</head>
+
+<body>
+    <div class="app-layout-header jy-app-header">
+        <span class="app-back jyapp-icon jyapp-icon-zuojiantou"></span>
+        <span>关键词分类管理</span>
+        <span></span>
+    </div>
+
+    <div class="app-layout-content-b" v-cloak>
+        <div class="j-container">
+            <div class="m-header">
+                <div class="batch-delete h100" @click="batchDeleteStateChange">
+                    ${ batchDeleteState ? '取消' : '批量删除' }
+                </div>
+            </div>
+            <div class="j-main">
+                <div class="keyword-list" v-show="listShow">
+                    <!-- 分类名称卡片 -->
+                    <div
+                        class="keywords-item"
+                        v-for="(item,index) in groupNameList"
+                        :key="index">
+                        <div class="checkbox-container" :class="{ w0: !batchDeleteState }">
+                            <van-checkbox
+                                v-model="item.checked"
+                                checked-color="#2ABED1"
+                                :disabled="item.deleteDisabled"
+                                icon-size="18px">
+                            </van-checkbox>
+                        </div>
+                        <van-swipe-cell
+                            :name="index"
+                            :disabled="item.deleteDisabled || batchDeleteState"
+                            :before-close="beforeKeySwipeCellClose">
+                            <div class="j-key-card" @click="clickKeyCard(item, index)">
+                                <div class="j-key-card-left">${ item.name }</div>
+                                <div class="j-key-card-right">
+                                    <span class="text">${ item.count }组关键词</span>
+                                    <div class="fill-in-svg" :class="{ w0: batchDeleteState }">
+                                        <img src="/jyapp/vipsubscribe/image/icon-write.svg" alt="">
+                                    </div>
+                                </div>
+                            </div>
+                            <template #right>
+                                <div class="delete-button">删除</div>
+                            </template>
+                        </van-swipe-cell>
+                    </div>
+                </div>
+                <div class="key-empty" v-show="emptyShow">
+                    <div class="empty-img-container">
+                        <img class="empty-img" src="/jyapp/images/wxkeyset/nopush.png">
+                    </div>
+                    <div class="empty-text">暂无关键词分类</div>
+              </div>
+            </div>
+            <div class="j-footer">
+                <van-notice-bar
+                    v-if="batchDeleteState"
+                    class="footer-tip"
+                    color="#ff9f40"
+                    background="#fff4e8"
+                    :scrollable="false"
+                    :wrapable="true">
+                    注：关键词分类下不存在关键词组时才可删除，如需删除，需先删除该分类下的关键词组
+                </van-notice-bar>
+                <div class="j-button-group" v-if="batchDeleteState">
+                    <button class="j-button-confirm" @click="batchDelete" :disabled="this.selectedCount <= 0">
+                        <span class="info-text">删除</span>
+                        <span class="sub-text">（已选中${ selectedCount }项）</span>
+                    </button>
+                </div>
+                <div class="j-button-group" v-else>
+                    <button class="j-button-confirm" @click="addGroup">新建关键词分类</button>
+                </div>
+            </div>
+        </div>
+        <van-dialog
+            v-model="editGroupNameDialog.show"
+            class="group-name-edit"
+            title="关键词分类"
+            get-container="body"
+            confirm-button-color="#2ABED1"
+            @confirm="confirmEditGroupName"
+            show-cancel-button>
+            <div class="edit-container">
+                <input type="text" maxlength="20" v-model.trim="editGroupNameDialog.value" placeholder="输入关键词分类名称" onblur="window.scrollTo(0, 0)">
+            </div>
+        </van-dialog>
+    </div>
+    <script src=//cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js></script>
+    <script src=//cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js></script>
+    <script src=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/vant.min.js></script>
+    <script src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/big-member/js/utils.js?v={{Msg "seo" "version"}}'></script>
+    <script>
+        utils.iosBackRefresh()
+    </script>
+    <script src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/js/keyword-manage.js?v={{Msg "seo" "version"}}'></script>
+    {{include "/common/js.html"}}
+    {{include "/common/baiducc.html"}}
+</body>
+</html>

src/web/staticres/vipsubscribe/css/addKeyWord.css

@@ -1,401 +0,0 @@
-.add-key-word .input-box span {
-    width: 1.6rem;
-    min-width: 1.6rem;
-}
-
-.add-key-word .input-box input::placeholder {
-    color: #C0C4CC;
-}
-
-.add-key-word .input-box input {
-    width: 100%;
-    font-size: 0.32rem;
-    line-height: 1.5;
-    border: none;
-    color: #171826;
-    user-select: text;
-    -webkit-user-select:text;
-}
-
-.add-key-word .input-box {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: flex-start;
-    line-height: 3.6;
-    font-weight: 500;
-    font-size: 0.3rem;
-    color: #5F5E64;
-    padding: 0 0.32rem;
-    margin-top: 0.16rem;
-    background: #fff;
-    box-shadow: inset 16px 0px 0px #FFFFFF, inset 0px -0.5px 0px rgba(0, 0, 0, 0.05);
-}
-
-.add-key-word .add-box:active {
-    background-color: #ececec;
-}
-
-.add-key-word .add-box {
-    flex: 1;
-    font-weight: 500;
-    font-size: 0.3rem;
-    line-height: 1.08rem;
-    display: flex;
-    text-align: center;
-    align-items: center;
-    justify-content: center;
-    color: #171826;
-    background: #EDEFF2;
-    margin-right: 1px;
-}
-
-.add-key-word .add-box + .add-box {
-    margin-left: 1px;
-    margin-right: 0;
-}
-
-.add-key-word .fixed-tip-button {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-}
-
-.add-key-word .input-group .input-box span {
-    opacity: 0;
-}
-
-.add-key-word .input-group .input-box:first-child span {
-    opacity: 1;
-}
-
-.add-key-word .input-group + .input-group {
-    margin-top: 0.48rem;
-}
-
-
-.input-group .input-box {
-    margin-top: 0;
-    box-shadow: inset 0px -1px 1px -1px rgba(0, 0, 0, 0.05);
-    padding-right: 0;
-}
-
-.add-key-word .q-tip .call-dialog {
-    padding: 0.32rem;
-    display: inline-block;
-}
-
-.add-key-word .q-tip i {
-    font-size: 0.26rem;
-}
-
-.add-key-word .q-tip {
-    line-height: 0.4rem;
-    text-align: right;
-    font-weight: 500;
-    font-size: 0.26rem;
-    color: #2ABED1;
-}
-
-.jy-icon-add {
-}
-
-.jy-icon-add {
-    position: relative;
-    width: 0.28rem;
-    margin-right: 0.16rem;
-    height: 100%;
-}
-
-.jy-icon-add:before,
-.jy-icon-add:after {
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    content: '';
-    width: 0.26rem;
-    height: 0.04rem;
-    background-color: #5F5E64;
-    transform: translate(-50%, -50%);
-}
-
-.jy-icon-add:after {
-    transform: translate(-50%, -50%) rotate(90deg);
-}
-
-.dialog-container {
-    background: rgba(0, 0, 0, 0.5);
-    position: fixed;
-    width: 100%;
-    height: 100%;
-    height: 100vh;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    z-index: 999;
-}
-.z999 {
-    z-index: 999;
-}
-.dialog-container .problemPopContent {
-    width: 5.6rem;
-    min-height: 7.23rem;
-    display: inline-block;
-    background: #fff;
-    border-radius: 0.16rem;
-    position: relative;
-    padding: 0.58rem 0;
-}
-
-.dialog-container .problemPopContent h3 {
-    font-size: .34rem;
-    text-align: center;
-    padding-bottom: 0.2rem;
-}
-
-.dialog-container .problemPopContent ul {
-    padding: 0 .4rem;
-}
-
-.dialog-container .problemPopContent ul li {
-    margin-top: 0.16rem;
-}
-
-.dialog-container .problemPopContent ul li h4 {
-    font-size: .3rem;
-    line-height: 1.5;
-    color: #1d1d1d;
-}
-
-.dialog-container .problemPopContent ul li p {
-    font-size: .28rem;
-    color: #868686;
-    line-height: 1.4;
-}
-
-.knowBtn {
-    width: 100%;
-    background-color: #fff;
-    box-shadow: inset 0px 1px 1px -1px rgba(0, 0, 0, 0.1);
-    position: absolute;
-    bottom: 0;
-    height: 1rem;
-    font-weight: 500;
-    line-height: 1rem;
-    text-align: center;
-    font-size: .36rem;
-    color: #2ABED1;
-    border-radius: 0 0 8px 8px;
-}
-
-.addImg:active {
-    background-color: #ececec;
-}
-
-.addImg {
-    width: 0.4rem;
-    padding: 0 0.24rem;
-    margin-right: 0.08rem;
-    box-sizing: content-box;
-    display: inline-block;
-    background: url('/jyapp/vipsubscribe/image/delete.png?v=1430') center center no-repeat;
-    background-size: 0.4rem 0.4rem;
-    height: 1.08rem;
-}
-
-.sticky-box {
-    position: fixed;
-    top: 21.33333vw;
-    left: 0;
-    width: 100%;
-    background: #f5f4f9;
-    z-index: 2;
-}
-
-.fixed-bottom {
-    position: fixed;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    z-index: 2;
-    background: rgba(255, 255, 255, 0.96);
-    padding: 0.16rem 0.32rem 0.24rem;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-
-.fixed-bottom a:first-child {
-    margin-left: 0;
-    margin-right: 0.13rem;
-}
-
-.fixed-bottom a {
-    width: 100%;
-    height: 0.92rem;
-    line-height: 0.92rem;
-    border-radius: 0.16rem;
-    margin-left: 0.13rem;
-    font-weight: 500;
-    font-size: 0.36rem;
-    text-align: center;
-}
-
-.fixed-bottom .jy__btn_primary {
-    letter-spacing: 0.5em;
-}
-
-.fixed-bottom a + .jy__btn_primary {
-    letter-spacing: unset;
-}
-
-.jy__btn_primary {
-    background-color: #19b0c5;
-    color: #F7F9FA;
-}
-
-.jy__btn_primary:active {
-    background-color: #19b0c5;
-}
-
-.jy__btn_delete {
-    background-color: #EDEFF2;
-    color: #5F5E64;
-}
-
-.jy__btn_delete:active {
-    background-color: #dfe3e5;
-}
-
-.jy__btn_primary.disabled {
-    background-color: #87DFEA;
-}
-
-.jy__btn_primary.disabled:active {
-    background-color: #78cfda;
-}
-
-.add-key-word .content-box {
-    width: 100%;
-    left: 0;
-    right: 0;
-    top: 0;
-    bottom: 0;
-    padding-top: 2.20rem;
-    padding-bottom: 2.4rem;
-    z-index: 1;
-    overflow-y: scroll;
-    -webkit-overflow-scrolling: touch;
-    position: unset;
-}
-
-.select-input.left-run {
-    transform: translate3d(100%, 0, 0);
-}
-
-.select-input.right-run {
-    transform: translate3d(-100%, 0, 0);
-}
-
-.select-input {
-    position: relative;
-    transition: transform 0.3s ease-in-out;
-    width: 100%;
-}
-
-.select-input .input-box.right-box {
-    left: 100%;
-}
-
-.select-input .input-box {
-    margin-top: 0;
-    position: absolute;
-    width: 100%;
-    top: 0;
-    left: -100%;
-}
-
-.input-box .jy__btn_primary {
-    width: 0.96rem;
-    min-width: 0.96rem;
-    height: 0.52rem;
-    border-radius: 0.08rem;
-    font-weight: 500;
-    font-size: 0.26rem;
-    color: #FFFFFF;
-    line-height: 0.52rem;
-    text-align: center;
-    margin-left: 0.16rem;
-}
-
-.content-box.disabled input {
-    pointer-events: none;
-}
-
-.weui-dialog {
-    border-radius: 0.16rem;
-    left: 0.72rem;
-    right: 0.72rem;
-}
-
-.weui-dialog__hd {
-    color: #171826;
-    font-style: normal;
-    font-weight: bold;
-    padding: 0.48rem 0;
-    line-height: 0.52rem;
-}
-input.classify-keyword::-webkit-input-placeholder {
-    color: #C0C4CC;
-}
-.weui-dialog__bd {
-    font-weight: 500;
-    font-size: 0.3rem;
-    line-height: 0.44rem;
-    text-align: center;
-    color: #5F5E64;
-    padding-bottom: 0.47rem;
-}
-
-.weui-dialog__btn_default {
-    color: #171826;
-    font-weight: 500;
-    font-size: 0.36rem;
-}
-
-.weui-dialog__ft {
-    height: 0.92rem;
-    line-height: 0.92rem;
-}
-
-.weui-dialog .weui-dialog__ft .weui-dialog__btn_primary {
-    font-weight: 500;
-    font-size: 0.36rem;
-    color: #FB483D;
-}
-
-.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;
-}

src/web/staticres/vipsubscribe/css/addition_exclusive_word.css

@@ -1,351 +0,0 @@
-.exclusive-word,
-.addition-word {
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-/*  width: 100;*/
-  height: 100%;
-  overflow: hidden;
-}
-
-.exclusive-word .content,
-.addition-word .content {
-  flex: 1;
-  overflow-y: scroll;
-}
-
-.exclusive-word .title,
-.addition-word .title {
-  font-size: 0.26rem;
-  color: #888;
-  padding: 0.3rem;
-  line-height: 0.38rem;
-}
-
-.exclusive-word .enter .enterOne,
-.addition-word .enter .enterOne {
-  min-height: 47px;
-  width: 100%;
-  padding: 0.3rem;
-  font-size: 0.3rem;
-  background: #fff;
-}
-
-.exclusive-word .enter .btnChoose,
-.addition-word .enter .btnChoose {
-  border-top: 1px solid #e0e0e0;
-  overflow: hidden;
-  background: #fff;
-}
-
-.exclusive-word .enter .btnChoose button,
-.addition-word .enter .btnChoose button {
-  float: left;
-  height: 0.6rem;
-  font-size: 0.3rem;
-  width: 50%;
-  background: #fff;
-  margin: 0.15rem 0;
-  color: #1d1d1d;
-}
-
-.exclusive-word .enter .btnChoose button:first-child,
-.addition-word .enter .btnChoose button:first-child {
-  border-right: 1px solid #e0e0e0;
-}
-
-.exclusive-word .enter .btn,
-.addition-word .enter .btn {
-  margin-top: 0.16rem;
-}
-
-.exclusive-word .enter .btn button,
-.addition-word .enter .btn button {
-  width: 50%;
-  height: 0.94rem;
-  background: #2cb7ca;
-  color: #fff;
-  font-size: 0.36rem;
-  opacity: 0.5;
-}
-
-.exclusive-word .showKeyWord ul li,
-.addition-word .showKeyWord ul li {
-  margin-bottom: 0.16rem;
-  overflow: hidden;
-}
-
-.exclusive-word .showKeyWord ul li .one,
-.addition-word .showKeyWord ul li .one {
-  display: flex;
-  background: #fff;
-  line-height: 0.54rem;
-  padding: 0.2rem 0;
-}
-
-.exclusive-word .showKeyWord ul li .one div,
-.addition-word .showKeyWord ul li .one div {
-  flex: 1;
-}
-
-.exclusive-word .showKeyWord ul li .one div span,
-.addition-word .showKeyWord ul li .one div span {
-  display: flex;
-  padding: 0 0.3rem;
-}
-
-.exclusive-word .showKeyWord ul li .one div span strong,
-.addition-word .showKeyWord ul li .one div span strong {
-  font-size: 0.3rem;
-  color: #1d1d1d;
-  font-weight: normal;
-  display: block;
-  width: 1.3rem;
-}
-
-.exclusive-word .showKeyWord ul li .one div span p,
-.addition-word .showKeyWord ul li .one div span p {
-  flex: 1;
-  font-size: 0.3rem;
-  color: #686868;
-}
-
-.exclusive-word .showKeyWord ul li .one button,
-.addition-word .showKeyWord ul li .one button {
-  width: 1.96rem;
-  background: #fff;
-  color: #2cb7ca;
-  border-left: 1px solid #e0e0e0;
-  font-size: 0.3rem;
-  position: relative;
-  left: 0;
-}
-
-.exclusive-word .showKeyWord ul li .one button i,
-.addition-word .showKeyWord ul li .one button i {
-  font-size: 0.4rem;
-  padding-right: 0.1rem;
-}
-
-.exclusive-word .showKeyWord ul li .modify,
-.addition-word .showKeyWord ul li .modify {
-  display: none;
-  margin-top: 0.16rem;
-}
-
-.exclusive-word .showKeyWord ul li .modify textarea,
-.addition-word .showKeyWord ul li .modify textarea {
-  box-sizing: border-box;
-  min-height: 0.94rem;
-  resize: none;
-  width: 100%;
-  display: flex;
-  align-items: center;
-  padding: 0.3rem;
-  background: #fff;
-  outline: none;
-  font-size: 0.3rem;
-  color: #1d1d1d;
-}
-
-.exclusive-word .showKeyWord ul li .modify span,
-.addition-word .showKeyWord ul li .modify span {
-  width: 100%;
-  display: block;
-  line-height: 0.5rem;
-  padding: 0.2rem 0.3rem;
-  background: #fff;
-  outline: none;
-  font-size: 0.3rem;
-  color: #1d1d1d;
-  user-modify: read-write-plaintext-only;
-  -webkit-user-modify: read-write-plaintext-only;
-}
-
-.exclusive-word .showKeyWord ul li .modify button,
-.addition-word .showKeyWord ul li .modify button {
-  width: 50%;
-  height: 0.88rem;
-  float: left;
-  margin-top: 0.16rem;
-  font-size: 0.28rem;
-}
-
-.exclusive-word .showKeyWord ul li .modify button.addAdjunctWord, .exclusive-word .showKeyWord ul li .modify button.addExclusion,
-.addition-word .showKeyWord ul li .modify button.addAdjunctWord,
-.addition-word .showKeyWord ul li .modify button.addExclusion {
-  position: relative;
-  background: #fff;
-}
-
-.exclusive-word .showKeyWord ul li .modify button.addExclusion:before,
-.addition-word .showKeyWord ul li .modify button.addExclusion:before {
-  position: absolute;
-  content: "";
-  width: 1px;
-  height: 0.64rem;
-  background-color: #e0e0e0;
-  left: 0;
-  top: 0.13rem;
-}
-
-.exclusive-word .showKeyWord ul li .modify button.deleteKey,
-.addition-word .showKeyWord ul li .modify button.deleteKey {
-  color: #fff;
-  background: #fe737a;
-  font-size: 0.3rem;
-}
-
-.exclusive-word .showKeyWord ul li .modify button.ascertainKey,
-.addition-word .showKeyWord ul li .modify button.ascertainKey {
-  color: #fff;
-  background: #2cb7ca;
-  font-size: 0.3rem;
-}
-
-.exclusive-word .addKeyWord,
-.addition-word .addKeyWord {
-  padding-bottom: .2rem;
-  width: 100%;
-  text-align: center;
-}
-
-.exclusive-word .addKeyWord i,
-.addition-word .addKeyWord i {
-  margin-bottom: 0.4rem;
-  font-size: 1rem;
-  color: #2cb7ca;
-}
-
-.exclusive-word .addKeyWord p,
-.addition-word .addKeyWord p {
-  height: 0.56rem;
-  line-height: 0.56rem;
-  background-color: #fff;
-  font-size: 0.28rem;
-  color: #888;
-}
-
-.exclusive-word .problem,
-.addition-word .problem {
-  margin-top: 0.4rem;
-  font-size: 0.3rem;
-  color: #2cb7ca;
-  float: right;
-  margin-right: 0.3rem;
-}
-
-.exclusive-word .problem i,
-.addition-word .problem i {
-  margin-left: 0.06rem;
-}
-
-.exclusive-word .problemPop,
-.addition-word .problemPop {
-  background: rgba(0, 0, 0, 0.5);
-  position: fixed;
-  width: 100%;
-  height: 100%;
-  height: 100vh;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  display: none;
-  align-items: center;
-  justify-content: center;
-}
-
-.exclusive-word .problemPop .problemPopContent,
-.addition-word .problemPop .problemPopContent {
-  width: 5.6rem;
-  min-height: 7.23rem;
-  display: inline-block;
-  background: #fff;
-  border-radius: 4px;
-  position: relative;
-  padding: 0.58rem 0;
-}
-
-.exclusive-word .problemPop .problemPopContent h3,
-.addition-word .problemPop .problemPopContent h3 {
-  font-size: 0.34rem;
-  text-align: center;
-  padding-bottom: 0.2rem;
-}
-
-.exclusive-word .problemPop .problemPopContent ul,
-.addition-word .problemPop .problemPopContent ul {
-  padding: 0 0.4rem;
-}
-
-.exclusive-word .problemPop .problemPopContent ul li,
-.addition-word .problemPop .problemPopContent ul li {
-  margin-top: 0.16rem;
-}
-
-.exclusive-word .problemPop .problemPopContent ul li h4,
-.addition-word .problemPop .problemPopContent ul li h4 {
-  font-size: 0.3rem;
-  line-height: 1.5;
-  color: #1d1d1d;
-}
-
-.exclusive-word .problemPop .problemPopContent ul li p,
-.addition-word .problemPop .problemPopContent ul li p {
-  font-size: 0.28rem;
-  color: #868686;
-  line-height: 1.4;
-}
-
-.exclusive-word .problemPop .problemPopContent button,
-.addition-word .problemPop .problemPopContent button {
-  width: 100%;
-  background: #fff;
-  border-top: 1px solid #e0e0e0;
-  position: absolute;
-  bottom: 0;
-  height: 1rem;
-  font-size: 0.36rem;
-  color: #2cb7ca;
-}
-
-.custom-toast .weui-toast {
-  font-size: 0.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;
-}
-
-.weui-dialog .weui-dialog__ft .weui-dialog__btn_primary {
-  color: #2cb7ca;
-}
-
-.weui-dialog input {
-  caret-color: #2cb7ca;
-}
-.addKeyWord  i.icon-tianjia{
-	    position: fixed;
-    bottom: 0px;
-    left: 50%;
-    margin-left: -25px;
-    width: 50px;
-}
-.addkeyWord{
-	margin-bottom:.2rem;
-}

src/web/staticres/vipsubscribe/css/keyWord.css

@@ -1,705 +1,156 @@
-.keyWord {
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    width: 100%;
-    height: 100%;
-    overflow: hidden;
+.group-filter-container {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 100%;
+}
+.filter-text {
+  margin-right: .16rem;
+  font-size: .28rem;
+  color: #5f5e64;
+  line-height: .4rem;
+}
+.filter-button {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: .08rem .24rem;
+  font-size: .24rem;
+  color: #171826;
+  background-color: #fff;
+  border-radius: 50px;
+}
+.filter-button:active {
+  background-color: rgba(0,0,0,.02);
+}
+.filter-button .van-icon-play {
+  margin-left: .08rem;
+  transform: rotate(90deg);
+}
+
+.j-key-card {}
+.j-key-card-top {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+}
+.j-key-card-bottom {
+  
+  margin-top: .2rem;
+  color: #5f5e64;
+  line-height: .36rem;
+  font-size: .24rem;
+}
+.j-key-card-bottom.ls {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+}
+.j-key-card-bottom.ls .subinfo-text  {
+  flex: 1;
+}
+.j-key-card .k-c-t-c {
+  margin: 0 .2rem;
+  flex: 1;
+  font-size: .28rem;
+  font-weight: 500;
+  color: #171826;
+  line-height: .4rem;
+}
+.j-key-card .k-c-t-r {
+  line-height: .4rem;
+}
+
+
+/* popup */
+.j-popup .j-main {
+  padding-left: .32rem;
+}
+.j-popup .keywords-group-item {
+  padding: .24rem .32rem;
+  padding-left: 0;
+  font-size: .28rem;
+  color: #5f5e64;
+  line-height: .4rem;
+}
+.j-popup .keywords-group-item.active {
+  color: #2abed1;
+}
+.j-popup .keywords-group-item:not(:last-of-type) {
+  border-bottom: 1px solid rgba(0,0,0,.04);
+}
+
+/* empty */
+.key-empty .add-keyword-button {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: .28rem;
+  padding: .16rem .48rem;
+  width: 3.2rem;
+  height: 0.8rem;
+  font-size: .32rem;
+  line-height: .48rem;
+  border-radius: .08rem;
+  color: #fff;
+  background-color: #2cb7ca;
+}
+.key-empty .add-keyword-button[disabled] {
+  opacity: 0.5;
+}
+.key-empty .button-text {
+  margin-left: .08rem;
+}
+
+.keywords-count {
+  margin-top: .28rem;
+  font-size: .24rem;
+  color: #9b9ca3;
+  line-height: .36rem;
+}
+
+/* 快速导入 */
+.fast-import {
+  padding-top: .24rem;
+  padding-bottom: .24rem;
+  height: unset;
+  color: #fff;
+  font-size: .26rem;
+  background-color: #2abed1;
+}
+.fast-import .fast-import-text {
+  margin: 0 .24rem;
+  flex: 1;
+}
+.fast-import .van-icon-plus {
+  font-size: .36rem;
+  font-weight: 700;
+  transform: rotate(45deg);
 }
-html, body {
-    background: #f5f6f7;
+
+.fast-import .fast-import-button {
+  padding: .04rem .12rem;
+  border: 1px solid rgba(255, 255, 255, 0.5);
+  border-radius: 8px;
+}
+
+.fast-import-content {
+  font-size: .3rem;
+  color: #5f5e64;
+  line-height: .44rem;
 }
-
-.keyWord .add-keyword-container,
-.keyWord .all-classify-column {
-    display: flex;
-    flex: 1;
-    flex-direction: column;
-    justify-content: space-between;
-    overflow-y: scroll;
-}
-
-.keyWord .add-keyword-container .classify {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding: 0 .3rem;
-    height: 1.08rem;
-    background-color: #fff;
-}
-
-.keyWord .add-keyword-container .classify .classify-l {
-    font-size: .32rem;
-    color: #171826;
-    width: 2rem;
-    font-weight: 500;
-}
-
-.keyWord .add-keyword-container .classify .classify-r {
-    display: flex;
-    align-items: center;
-    justify-content: end;
-    height: 100%;
-    font-weight: 500;
-    color: #9B9CA3;
-    font-size: .28rem;
-}
-
-.keyWord .add-keyword-container .classify .classify-r .icon-arrow {
-    margin-left: .1rem;
-    line-height: 0.4rem;
-    color: #C0C4CC;
-    font-size: 0.28rem;
-}
-
-.keyWord .add-keyword-container .classify-tips {
-    padding: .16rem .32rem;
-    font-size: .24rem;
-    color: #9B9CA3;
-    line-height: .36rem;
-    font-weight: 500;
-}
-
-.keyWord .add-keyword-container .content {
-    flex: 1;
-    overflow-y: scroll;
-}
-
-.keyWord .add-keyword-container .content .enter .enterOne {
-    min-height: 47px;
-    width: 100%;
-    padding: 0.3rem;
-    font-size: .3rem;
-    background: #fff;
-}
-
-.keyWord .add-keyword-container .content .enter .btnChoose {
-    border-top: 1px solid #e0e0e0;
-    overflow: hidden;
-    background: #fff;
-}
-
-.keyWord .add-keyword-container .content .enter .btnChoose button {
-    float: left;
-    height: 0.6rem;
-    font-size: .3rem;
-    width: 50%;
-    background: #fff;
-    margin: 0.15rem 0;
-    color: #1D1D1D;
+.fast-import-tip {
+  margin-top: 0.4rem;
+  font-size: .24rem;
+  color: #888;
+  line-height: .44rem;
 }
 
-.keyWord .add-keyword-container .content .enter .btnChoose button:first-child {
-    border-right: 1px solid #e0e0e0;
-}
-
-.keyWord .add-keyword-container .content .enter .btn {
-    margin-top: .16rem;
-}
-
-.keyWord .add-keyword-container .content .enter .btn button {
-    width: 50%;
-    height: 0.94rem;
-    background: #2cb7ca;
-    color: #fff;
-    font-size: .36rem;
-    opacity: .5;
-}
-
-.keyWord .add-keyword-container .title {
-    font-size: .26rem;
-    color: #888;
-    padding: .3rem;
-    line-height: .38rem;
-}
-
-.keyWord .all-classify-column {
-    /*  border-top: 1px solid transparent;*/
-}
-
-.keyWord .all-classify-column .classify-list {
-    padding-bottom: 1.1rem;
-}
-
-.keyWord .all-classify-column .classify-list .classify-item {
-    /*display: flex;*/
-    align-items: center;
-    justify-content: space-between;
-    background-color: #fff;
-    box-shadow: inset 0 -0.5px 0 rgba(0, 0, 0, 0.05);
-    border-radius: 8px;
-    width: calc(100% - 0.48rem);
-    margin: .16rem auto 0;
-    height: 1.36rem;
-    border: none;
-    padding: 0.24rem 0.32rem;
-}
-
-
-.keyWord .all-classify-column .classify-list .classify-item .classify-item-l {
-    font-size: .32rem;
-    color: #1d1d1d;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    display: -webkit-inline-box;
-    -webkit-line-clamp: 1;
-    -webkit-box-orient: vertical;
-    width: 4.5rem;
-    margin-top: -0.05rem;
-}
-.classify .classify-detail{
-    text-overflow: ellipsis;
-    overflow: hidden;
-    display: -webkit-inline-box;
-    -webkit-line-clamp: 1;
-    -webkit-box-orient: vertical;
-    width: 4rem;
-    text-align:right;
-}
-
-.keyWord .all-classify-column .classify-list .classify-item .classify-item-r {
-    /*display: flex;*/
-    align-items: center;
-    justify-content: end;
-    /*height: 100%;*/
-    color: #888888;
-    font-size: .28rem;
-    /*new*/
-    float: right;
-}
-
-.keyWord .all-classify-column .classify-list .classify-item .classify-item-r .icon-arrow {
-    margin-left: .2rem;
-    font-size: .26rem;
-}
-
-.keyWord .delete-button {
-    font-weight: 500;
-    font-size: 0.32rem;
-    line-height: 1;
-    align-items: center;
-    color: #FFFFFF;
-    background: #FB483D;
-    border-radius: 0.16rem;
-    width: 1.76rem;
-    margin-top: .16rem;
-    margin-right: .16rem;
-    text-align: center;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-}
-
-.keyWord .showKeyWord ul li .one {
-    display: flex;
-    background: #fff;
-    line-height: .54rem;
-    margin: 0.16rem 0.24rem 0;
-    border-radius: 0.16rem;
-    padding: 0.24rem 0.32rem;
-    overflow: hidden;
-    max-width: calc(100% - 0.48rem);
-}
-
-.keyWord .showKeyWord ul li .one div {
-    flex: 1;
-}
-
-.keyWord .showKeyWord ul li .one div span {
-    display: flex;
-}
-
-.keyWord .showKeyWord ul li .one div span strong {
-    font-size: 0.3rem;
-    color: #1d1d1d;
-    font-weight: normal;
-    display: block;
-    margin-right: 0.24rem;
-}
-.keyWord .showKeyWord ul li .one div span p.key {
-    color: #171826;
-    font-size: 0.32rem;
-}
-.keyWord .showKeyWord ul li .one div span p {
-    flex: 1;
-    line-height: 0.60rem;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    display: -webkit-box;
-    -webkit-line-clamp: 1;
-    -webkit-box-orient: vertical;
-    color: #5F5E64;
-    font-weight: 500;
-    font-size: 0.26rem;
-}
-.keyWord .showKeyWord ul li .one div span.icon-arrow {
-    color: #C0C4CC;
-    font-size: 0.28rem;
-    line-height: 0.60rem;
-}
-.keyWord .showKeyWord ul li .one div span.keyWord-tags {
-    display: inline-block;
-}
-.keyWord-tags {
-    color: #05A6F3;
-    font-weight: 500;
-    font-size: 0.2rem;
-    line-height: 0.34rem;
-    padding: 0 0.08rem;
-    box-sizing: border-box;
-    text-align: center;
-    min-width: 0.76rem;
-    word-break: keep-all;
-    border: 0.5px solid #05A6F3;
-    border-radius: 0.08rem;
-}
-.keyWord-tags.exclude {
-    color: #FB483D;
-    border-color: #FB483D;
-}
-.keyWord .showKeyWord ul li .one div span.line-top-border {
-    margin-top: 0.04rem;
-    padding-top: 0.24rem;
-}
-.keyWord .showKeyWord ul li .one div span.line-top-border + .line-top-border {
-    margin-top: 0;
-    padding-top: 0;
-}
-.keyWord .showKeyWord ul li .one div span.line-top-border + .line-top-border:before {
-    content: none;
-}
-.keyWord .line-top-border {
-    position: relative;
-}
-.keyWord .line-top-border::before {
-    content: '';
-    position: absolute;
-    top: 0;
-    background: rgba(0, 0, 0, 0.05);
-    width: 100%;
-    height: 1px;
-    -webkit-transform: scaleY(0.5);
-    transform: scaleY(0.5);
-    -webkit-transform-origin: 0 0;
-    transform-origin: 0 0;
-    left: 0;
-}
-
-.keyWord .showKeyWord ul li .one button {
-    width: 1.96rem;
-    background: #fff;
-    color: #2cb7ca;
-    border-left: 1px solid #E0E0E0;
-    font-size: .3rem;
-    position: relative;
-    left: 0;
-}
-
-.keyWord .showKeyWord ul li .one button i {
-    font-size: .4rem;
-    padding-right: 0.1rem;
-}
-
-.keyWord .showKeyWord ul li .modify {
-    display: none;
-    margin-top: .16rem;
-}
-
-.keyWord .showKeyWord ul li .modify textarea {
-    box-sizing: border-box;
-    min-height: .94rem;
-    resize: none;
-    width: 100%;
-    display: flex;
-    align-items: center;
-    padding: .3rem;
-    background: #fff;
-    outline: none;
-    font-size: 0.3rem;
-    color: #1d1d1d;
-}
-
-.keyWord .showKeyWord ul li .modify span {
-    width: 100%;
-    display: block;
-    line-height: 0.5rem;
-    padding: 0.2rem .3rem;
-    background: #fff;
-    outline: none;
-    font-size: 0.3rem;
-    color: #1d1d1d;
-    user-modify: read-write-plaintext-only;
-    -webkit-user-modify: read-write-plaintext-only;
-}
-
-.keyWord .showKeyWord ul li .modify button {
-    width: 50%;
-    height: .88rem;
-    float: left;
-    margin-top: 0.16rem;
-    font-size: .28rem;
-}
-
-.keyWord .showKeyWord ul li .modify button.addAdjunctWord, .keyWord .showKeyWord ul li .modify button.addExclusion {
-    position: relative;
-    background: #fff;
-}
-
-.keyWord .showKeyWord ul li .modify button.addExclusion:before {
-    position: absolute;
-    content: '';
-    width: 1px;
-    height: .64rem;
-    background-color: #e0e0e0;
-    left: 0;
-    top: 0.13rem;
-}
-
-.keyWord .showKeyWord ul li .modify button.deleteKey {
-    color: #fff;
-    background: #FE737A;
-    font-size: .3rem;
-}
-
-.keyWord .showKeyWord ul li .modify button.ascertainKey {
-    color: #fff;
-    background: #2cb7ca;
-    font-size: .3rem;
-}
-.showKeyWord {
-    padding-bottom: 2.2rem;
-}
-
-.keyWord .addKeyWord {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    width: 100%;
-    text-align: center;
-    line-height: 1;
-    background: #fff;
-    position: fixed;
-    bottom: 0;
-    padding: 0.04rem 0;
-    z-index: 2;
-}
-
-.keyWord .addKeyWord i {
-    margin-bottom: .3rem;
-    font-size: 1rem;
-    color: #2cb7ca;
-}
-
-.keyWord .addKeyWord p {
-    width: 100%;
-    height: 0.4rem;
-    line-height: 0.4rem;
-    background-color: #fff;
-    color: #9B9CA3;
-    font-size: 0.24rem;
-    font-weight: 500;
-}
-
-.keyWord .problem {
-    margin-top: .4rem;
-    font-size: .3rem;
-    color: #2cb7ca;
-    float: right;
-    margin-right: 0.3rem;
-}
-
-.keyWord .problem i {
-    margin-left: .06rem;
-}
-
-.dialog-container {
-    background: rgba(0, 0, 0, 0.5);
-    position: fixed;
-    width: 100%;
-    height: 100%;
-    height: 100vh;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    display: none;
-    align-items: center;
-    justify-content: center;
-    z-index: 999;
-}
-.z999 {
-    z-index: 999;
-}
-.dialog-container .problemPopContent {
-    width: 5.6rem;
-    min-height: 7.23rem;
-    display: inline-block;
-    background: #fff;
-    border-radius: 4px;
-    position: relative;
-    padding: 0.58rem 0;
-}
-
-.dialog-container .problemPopContent h3 {
-    font-size: .34rem;
-    text-align: center;
-    padding-bottom: 0.2rem;
-}
-
-.dialog-container .problemPopContent ul {
-    padding: 0 .4rem;
-}
-
-.dialog-container .problemPopContent ul li {
-    margin-top: 0.16rem;
-}
-
-.dialog-container .problemPopContent ul li h4 {
-    font-size: .3rem;
-    line-height: 1.5;
-    color: #1d1d1d;
-}
-
-.dialog-container .problemPopContent ul li p {
-    font-size: .28rem;
-    color: #868686;
-    line-height: 1.4;
-}
-
-.dialog-container .problemPopContent button {
-    width: 100%;
-    background: #fff;
-    border-top: 1px solid #E0E0E0;
-    position: absolute;
-    bottom: 0;
-    height: 1rem;
-    font-size: .36rem;
-    color: #2cb7ca;
-}
-
-.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;
-}
-.weui-dialog {
-    border-radius: 0.16rem;
-    left: 0.72rem;
-    right: 0.72rem;
-}
-.weui-dialog__hd {
-    color: #171826;
-    font-style: normal;
-    font-weight: bold;
-    padding: 0.48rem 0;
-    line-height: 0.52rem;;
-}
-input.classify-keyword::-webkit-input-placeholder {
-    color: #C0C4CC;
-}
-.weui-dialog__bd {
-    font-weight: 500;
-    font-size: 0.3rem;
-    line-height: 0.44rem;
-    text-align: center;
-    color: #5F5E64;
-    padding-bottom: 0.47rem;
-}
-.weui-dialog__btn_default {
-    color: #171826;
-    font-weight: 500;
-    font-size: 0.36rem;
-}
-.weui-dialog__ft {
-    height: 0.92rem;
-    line-height: 0.92rem;
-    min-height: 0.92rem;
-}
-.weui-dialog .weui-dialog__ft .weui-dialog__btn_primary {
-    font-weight: 500;
-    font-size: 0.36rem;
-    color: #FB483D;
-}
-
-.weui-dialog input {
-    caret-color: #2cb7ca;
-}
-
-.classify-edit-pop .weui-dialog__bd input {
-    border: 1px solid rgba(0, 0, 0, 0.1);
-    box-sizing: border-box;
-    border-radius: 0.08rem;
-    font-weight: 500;
-    font-size: 0.3rem;
-    line-height: 0.32rem;
-    padding: 0.3rem 0.32rem;
-    color: #171826;
-    width: 100%;
-}
-
-.addKeyWord  i.icon-tianjia{
-    position: fixed;
-    bottom: .5rem;
-    bottom: calc(constant(safe-area-inset-bottom) + 0.5rem); /* iOS 11.0 */
-    bottom: calc(env(safe-area-inset-bottom) + 0.5rem); /* iOS 11.2 */
-    left: 50%;
-    margin-left: -25px;
-    width: 50px;
-}
-.enter.addkeyWord{
-    margin-top: 2rem;
-    margin-bottom: .2rem;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-}
-
-.enter.addkeyWord img {
-    width: 2rem;
-}
-.enter.addkeyWord img + span {
-    font-weight: 500;
-    font-size: 14px;
-    line-height: 20px;
-    color: #5F5E64;
-    margin-top: 0.77rem;
-    margin-bottom: 0.96rem;
-}
-.enter.addkeyWord .addButton {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: center;
-    padding: 0.16rem 0.48rem;
-    width: 3.04rem;
-    height: 0.8rem;
-    background: #2ABED1;
-    border-radius: 0.08rem;
-    font-weight: 500;
-    font-size: 0.32rem;
-    line-height: 0.48rem;
-    color: #F7F9FA;
-}
-.jy-icon-add {}
-.jy-icon-add {
-    position: relative;
-    width: 0.28rem;
-    margin-right: 0.16rem;
-    height: 100%;
-}
-
-.jy-icon-add:before,
-.jy-icon-add:after {
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    content: '';
-    width: 0.26rem;
-    height: 0.04rem;
-    background-color: #fff;
-    transform: translate(-50%, -50%);
-}
-
-.jy-icon-add:after {
-    transform: translate(-50%, -50%) rotate(90deg);
-}
-
-.ios-user-select {
-    -webkit-user-select: text;
-}
-.opacity6{
-    opacity: 0.6;
-}
-.keysexplain{
-    /* position: fixed; */
-    height: 0.4rem;
-    /* background: red; */
-    width: 100%;
-    font-size: .24rem;
-    line-height: 0.4rem;
-    font-weight: 500;
-    /* padding-top: .18rem; */
-    /* padding-left: .3rem; */
-    color: #9B9CA3;
-}
-.classifyKeysShow{
-    font-size: .25rem;
-    color: #686868;
-    margin-top: 0.1rem;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    display: -webkit-box;
-    -webkit-line-clamp: 1;
-    -webkit-box-orient: vertical;
-}
-.addClassify{
-    text-align: center;
-    color:#FFFFFF;
-    font-size: .36rem;
-    font-weight: 500;
-    background: #2ABED1;
-    border-radius: 0.16rem;
-    width: 6.86rem;
-    margin: 0.16rem 0 0.24rem 0;
-    line-height: 0.92rem;
-    height: 1rem;
-}
-.all-classify-column{
-    position: relative;
-    padding-bottom: 1rem;
-}
-.classify-fast{
-    height: 0.88rem;
-    background-color: #2ABED1;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    font-weight: 500;
-    font-size: 0.26rem;
-    padding: 0 0.32rem;
-    color: #FFFFFF;
-}
-.classify-fast span {
-    flex: 1;
-    width: 100%;
-}
-.classify-fast .weui-dialog__btn {
-    max-width: 1.44rem;
-    height: 0.64rem;
-    line-height: 0.64rem;
-    border: 1px solid rgba(255, 255, 255, 0.5);
-    box-sizing: border-box;
-    border-radius: 8px;
-    font-size: 0.26rem;
-    text-align: center;
-    color: #FFFFFF;
-}
-
-.classify-fast-pop .weui-dialog .weui-dialog__bd {
-    text-align: left;
-}
-.classify-fast-pop .weui-dialog .weui-dialog__bd p {
-    color: #9B9CA3;
-    font-weight: 500;
-    font-size: 0.26rem;
-    line-height: 0.4rem;
-    margin-top: 0.4rem;
+.dialog-upgrade .fast-import-tip {
+  display: flex;
+  align-items: flex-start;
+}
+.dialog-upgrade .tip-text {
+  margin-left: .16rem;
+  flex: 1;
 }

src/web/staticres/vipsubscribe/css/keyword-common.css

@@ -0,0 +1,290 @@
+/* 超级订阅关键词页面共用 */
+@keyframes rcmdRotateloading {
+  0% {
+    transform: rotateY(180deg) rotateZ(0);
+  }
+
+  100% {
+    transform: rotateY(180deg) rotateZ(1turn);
+  }
+}
+
+/* vant-reset */
+.van-dialog {
+  width: 6rem;
+  border-radius: .16rem;
+}
+.van-dialog__header {
+  font-weight: 700;
+  font-size: 18px;
+  line-height: 26px;
+  color: #171826;
+}
+.van-dialog__content {
+  padding: .16rem .6rem;
+}
+.van-dialog__message {
+  padding-left: 0;
+  padding-right: 0;
+  font-size: .3rem;
+  line-height: .44rem;
+  color: #5F5E64;
+}
+.van-dialog .van-button {
+  font-size: 18px;
+  line-height: 26px;
+}
+
+.van-dialog  .van-button--default {
+  color: #171826;
+}
+
+.van-toast {
+  max-width: 4.2rem;
+  line-height: 1.6;
+}
+
+/* vant-custom */
+.j-confirm-dialog {
+  border-radius: 8px;
+}
+.j-confirm-dialog .van-dialog__message {
+  font-size: .32rem;
+  color: #171826;
+  line-height: .48rem;
+  text-align: left;
+}
+.j-confirm-dialog.text-center .van-dialog__message {
+  text-align: center;
+}
+.j-confirm-dialog .van-button {
+  font-size: .36rem;
+  color: #171826;
+  line-height: .52rem;
+}
+
+/* 列表 */
+.keyword-list {
+  padding: .2rem 0;
+}
+.keywords-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.keywords-item:not(:last-of-type) {
+  margin-bottom: .16rem;
+}
+.keywords-item .checkbox-container {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  padding: .24rem 0;
+  width: .64rem;
+  transition: width .5s ease;
+}
+.keywords-item .checkbox-container.w0 {
+  width: 0;
+  padding: 0;
+}
+.keywords-item .van-swipe-cell {
+  flex: 1;
+}
+.keywords-item .j-key-card {
+  display: flex;
+  flex-direction: column;
+  margin: 0 0.24rem;
+  padding: 0.24rem 0.32rem;
+  max-width: calc(100% - 0.48rem);
+  overflow: hidden;
+  background-color: #fff;
+  border-radius: .16rem;
+  box-shadow: 0 8px 12px #ebedf0;
+}
+.keywords-item .delete-button {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-left: 2px;
+  margin-right: .24rem;
+  width: 1.76rem;
+  height: 100%;
+  font-weight: 500;
+  font-size: 0.32rem;
+  color: #FFFFFF;
+  background-color: #FB483D;
+  border-radius: 0.16rem;
+  box-shadow: 0 8px 12px #ebedf0;
+}
+.text-container {
+  white-space: pre-wrap;
+  word-break: break-all;
+}
+
+
+/* 修改分类名弹窗样式 */
+.group-name-edit .van-dialog__content {
+  padding: .48rem;
+}
+
+.group-name-edit .edit-container {
+  width: 100%;
+  font-size: 0.32rem;
+  line-height: 0.32rem;
+  padding: 0.24rem 0.3rem;
+  color: #171826;
+  border-radius: 0.08rem;
+  border: 1px solid rgba(0, 0, 0, 0.1);
+}
+.group-name-edit .edit-container input {
+  width: 100%;
+}
+
+/* tag公共样式 */
+.j-tag {
+  padding: .04rem .08rem;
+  font-size: .2rem;
+  line-height: .28rem;
+  border-radius: .08rem;
+  border: 1px solid transparent;
+}
+.tag-orange {
+  color: #ff9f40;
+  border-color: #ff9f40;
+}
+.tag-green {
+  color: #6ccf49;
+  border-color: #6ccf49;
+}
+
+
+/* 头部公共样式 */
+.m-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: .98rem;
+  padding: 0 .32rem;
+}
+
+/* 批量删除按钮 */
+.batch-delete {
+  padding: 0 .32rem;
+  color: #2abed1;
+  font-size: .28rem;
+}
+.batch-delete.h100 {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+}
+
+/* 关键词推荐卡片 */
+/* recommend-cards */
+.rec-cells {
+  padding: .32rem;
+  background-color: #fff;
+}
+.rec-cells .rec-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.rec-cells .rec-title {
+  font-size: .28rem;
+  color: #5f5e64;
+  line-height: .48rem;
+}
+.rec-cells .rec-change {
+  display: flex;
+  align-items: center;
+  color: #2abed1;
+}
+.rec-cells .rec-change:active {
+  opacity: 0.7;
+}
+.rec-cells .rec-change .text {
+  margin-left: .1rem;
+}
+.rec-cells .van-icon-replay {
+  font-size: .32rem;
+  transform: rotateY(180deg);
+}
+.rec-cells .rec-content {
+  margin-top: .24rem;
+}
+.rec-tags {
+  display: flex;
+  width: 100%;
+  flex-wrap: wrap;
+}
+.rec-tags .tag {
+  padding: .12rem .2rem;
+  margin: .08rem;
+  min-width: 30%;
+  font-size: .24rem;
+  line-height: .36rem;
+  color: #5F5E64;
+  background-color: #F5F6F7;
+  border-radius: .08rem;
+  white-space: nowrap;
+  word-break: break-all;
+  text-align: center;
+}
+.rec-change .van-icon-replay.active {
+  animation: rcmdRotateloading .5s linear infinite running;
+}
+
+/* popup */
+.j-popup .van-popup__close-icon {
+  top: .48rem;
+}
+.j-popup .popup-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 1.28rem;
+  padding: 0 .32rem;
+}
+.j-popup .header-title {
+  font-size: .4rem;
+  color: #171826;
+}
+
+/* 底部提示 */
+.footer-tip.center .van-notice-bar__wrap {
+  justify-content: center;
+}
+
+/* 底部按钮小字 */
+.j-button-confirm .sub-text {
+  font-size: .2rem;
+  margin-top: .04rem;
+}
+
+/* empty */
+.key-empty {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  width: 100%;
+}
+.key-empty .empty-img-container {
+  padding: .5rem;
+  width: 3.2rem;
+  height: 3.2rem;
+}
+.key-empty .empty-img {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+.key-empty .empty-text {
+  margin-top: .24rem;
+  font-size: .28rem;
+  color: #5f5e64;
+  line-height: .4rem;
+}

src/web/staticres/vipsubscribe/css/keyword-info.css

@@ -0,0 +1,95 @@
+/* 页面公共样式 */
+.card-radius {
+  border-radius: .16rem;
+  box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.05) inset, 16px 0px 0px 0px #ffffff inset; 
+}
+
+/* module公共样式 */
+[class^=module-]:last-of-type {
+  margin-bottom: .16rem;
+}
+[class^=module-]:not(:first-of-type) {
+  margin-top: .16rem;
+}
+[class^=module-].pd {
+  padding: 0 .32rem;
+}
+[class^=module-] .m-header {
+  padding: .2rem 0;
+  height: unset;
+}
+
+/* 自定义样式 */
+.batch-delete {
+  padding: 0;
+}
+.m-h-left {
+  color: #9b9ca3;
+}
+.match-way-list {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.match-way-item {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  padding: .2rem;
+  background-color: #fff;
+}
+.match-way-item:not(:last-of-type) {
+  margin-right: .22rem;
+}
+.match-way-item .m-w-i-title {
+  font-size: .28rem;
+  line-height: .4rem;
+  color: #171826;
+}
+.match-way-item .m-w-i-subinfo {
+  margin-top: .08rem;
+  font-size: .22rem;
+  line-height: .4rem;
+  color: #9b9ca3;
+  text-align: center;
+}
+.match-way-item.active .m-w-i-title {
+  color: #2abed1;
+}
+.match-way-item.active .m-w-i-subinfo {
+  color: #171826;
+}
+  
+.match-way-item.active::after {
+  content: '';
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  width: 0.28rem;
+  height: 0.28rem;
+  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAKySURBVHgB7Zg/aNRQHMd/eXfWP6i9omJBhBOXa0W4bK6ni6Murro76Cgu1kF0aysOjnXTyTopLkEcHM8TxIMOHghFQfBAaUtp8/P9Qt+Rpnm99y+XBO6zXJJ7gc83v+S9XwIwZsyY0jIbdB54UFIuBF/mEfFu6QLUX7drR2qVeUC8RfulChDJT7KAbzbFsdIEaLxt19nBSL4eP16KADJ5ovAB9pMnCh1g9n276VVZgAA12RgGBaURdG4OkycKWYGZoHPHQ1hQGVu4CkSrq6I8UagKkDwgzOmcU5gAojUATXIPkGwNdMk1QFproEtuAYYtUKrkEsCVPDHyAC7liZEGUGkNdBnZQqbaGugykgrotAa6ZF4B3dZAlwpkiElrILg2PQVL/nm4ceYE/N3ahu6/jdRxmd1Cpq0BQfKPZs4O9inApY9fU8dWwTGiNUDD1iApT1AAGU4DDFoDRKPWIE2eePb9l/QcZ7eQ7QIlk7//7Qe8+flHep6TAHnJE9azUFJedfYQ2MgTVgGoNWAT7BPfnBbHnl6sw8mJA3C8WoErpyZhdWNTGsJWntM3XshkrQGJxyFBEk3iQJ7oGVWAWgOG8JxvHkr+93tzK7rycZKVcCTPn2B8px1gpzV4IvufJElWFqJx9LAbeU6IuKg1C+m0BrKrnIaJPLHmhVPKFaDWgMvfUx0vq0QSU3l++yyttPxXQ1dim9ZgeUdMVgljeU4I+JB+961A7KvBVTBEVgkbeURY7F5uvqRtaQVcvruKStw+dxqO8Wn28cqquTyfOtdZOCf2Ux9i1y/eriB59MJWt+X3xLE9C1mR5T0vvB6XJ3ZVIIuvBi5Iu/KCQQWy+mpgCz2w617op8kTUQWy/GpgSB8xfIEMFmTiAs/mxdshfX6te9zjM78pPqyx7eVey++rnPgfnLxxiLvERTEAAAAASUVORK5CYII=) no-repeat;
+  background-size: contain;
+}
+
+.err-tip {
+  padding: .1rem .32rem;
+  font-size: .24rem;
+  color: #fb483d;
+  line-height: .36rem;
+}
+
+.key-textarea {
+  padding: .28rem;
+}
+.van-field__control {
+  font-size: .32rem;
+}
+
+.j-button-group.edit .j-button-cancel {
+  flex: 1;
+}
+.j-button-group.edit .j-button-confirm {
+  flex: 3;
+}

src/web/staticres/vipsubscribe/image/icon-write.svg

@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.9457 3.13785C14.2064 2.87757 14.2066 2.45511 13.9461 2.19459C13.6859 1.93441 13.2642 1.93421 13.0038 2.19414L6.86283 8.32335C6.60206 8.58363 6.60185 9.00609 6.86238 9.26661C7.12255 9.52679 7.54431 9.52699 7.80474 9.26706L13.9457 3.13785ZM4 1.99978H8.66667C9.03486 1.99978 9.33333 2.29825 9.33333 2.66644C9.33333 3.03463 9.03486 3.33311 8.66667 3.33311H4C3.63181 3.33311 3.33333 3.63159 3.33333 3.99978V11.9998C3.33333 12.368 3.63181 12.6664 4 12.6664H12C12.3682 12.6664 12.6667 12.368 12.6667 11.9998V7.33311C12.6667 6.96492 12.9651 6.66644 13.3333 6.66644C13.7015 6.66644 14 6.96492 14 7.33311V11.9998C14 13.1043 13.1046 13.9998 12 13.9998H4C2.89543 13.9998 2 13.1043 2 11.9998V3.99978C2 2.89521 2.89543 1.99978 4 1.99978Z" fill="#2ABED1"/>
+</svg>

src/web/staticres/vipsubscribe/js/addKeyWord.js

@@ -1,359 +0,0 @@
-/* 全局变量 */
-var SessionData = JSON.parse(sessionStorage.a_items || false);
-var SessionPageData = {
-    appendkey: [],
-    notkey: [],
-    key: ['']
-}
-try {
-    var tempData = SessionData[sessionStorage.classify_index]['a_key'][sessionStorage.kws_index]
-    if (tempData) {
-        SessionPageData = tempData
-    }
-} catch (e) {
-    SessionPageData = {
-        appendkey: [],
-        notkey: [],
-        key: ['']
-    }
-}
-var KeyData = {
-    includeKeys: [],
-    excludeKeys: [],
-    keyStr: ''
-}
-var beforeInput = {
-    status: null,
-    index: null,
-    include: '',
-    exclude: ''
-}
-/* 回显数据 */
-function echoPageData(data) {
-    KeyData = {
-        includeKeys: data.appendkey || [],
-        excludeKeys: data.notkey || [],
-        keyStr: data.key ? data.key.join(' ') : ''
-    }
-    $("#keyStr").val(KeyData.keyStr)
-    if (KeyData.keyStr !== '') {
-        $(".jy__btn_delete").show()
-        $(".submitButton").removeClass('disabled')
-    } else {
-        $(".jy__btn_delete").remove()
-    }
-    KeyData.excludeKeys.forEach(function (v) {
-        prependKeyDom(false, v)
-    })
-    KeyData.includeKeys.forEach(function (v) {
-        prependKeyDom(true, v)
-    })
-}
-
-/* 保存数据 */
-function savePageData(actionType) {
-    weui.loading()
-    //  SK：保存关键词； DK：删除关键词； SC：保存分类
-    var params = {
-        pageType: "keyWords",
-        classify_index: sessionStorage.classify_index,
-        classify_name: sessionStorage.classify_name,
-        kws_index: sessionStorage.kws_index,
-        kws_name: KeyData.keyStr,
-        actionType: actionType,
-        addition_kws: KeyData.includeKeys,
-        not_kws: KeyData.excludeKeys,
-        kwscount: sessionStorage.kws_count
-    }
-    if (actionType === 'DK') {
-        params.kws_name = SessionPageData.key.join(' ')
-    }
-    var result = false
-    $.ajax({
-        type: "POST",
-        url: "/subscribepay/afterPay/setUserInfo",
-        data: params,
-        dataType: "json",
-        async: false,
-        traditional: true,
-        success: function (r) {
-            result = r
-        }
-    })
-    if (result.flag) {
-        sessionStorage.setItem('addition_kws', JSON.stringify(KeyData.includeKeys))
-        sessionStorage.setItem('not_kws', JSON.stringify(KeyData.excludeKeys))
-    }
-    weui.loading().hide()
-    return result
-}
-
-/* 删除提示 */
-function deleteKeys() {
-    weui.confirm('删除后将无法恢复，确定删除？', {
-        title: '删除关键词',
-        isAndroid: false,
-        buttons: [{
-            label: '取消',
-            type: 'default',
-            onClick: function () {
-            }
-        }, {
-            label: '确定',
-            type: 'primary',
-            onClick: function () {
-                var temp = savePageData('DK')
-                if (temp.flag) {
-                    weui.toast('删除成功', {
-                        duration: 2000,
-                        className: 'custom-toast',
-                        callback: function () {
-                            window.history.go(-1)
-                        }
-                    });
-                } else {
-                    wToast('无法删除或已被删除')
-                }
-            }
-        }]
-    });
-}
-
-function openDialog(name, e) {
-    e && e.stopPropagation()
-    $("div[data-dialog='" + name + "']").toggle()
-}
-
-/* 附加词、排除词插入Dom */
-function prependKeyDom(status, value) {
-    var ac = (status ? '附加' : '排除') + '词'
-    var bc = '输入' + (status ? '' : '不') + '希望接收的关键词（选填）'
-    var inDom = $("#" + (status ? 'include' : 'exclude'))
-    var templateHtml = "<div class=\"input-box\"><span>" + ac + "</span><input readonly value=\"" + value + "\" type=\"text\" placeholder=\"" + bc + "\"/><i  class=\"addImg\"></i></div>";
-    var nextStatus = inDom.children(':last-child').children('input').length ? inDom.children(':last-child').children('input').val().trim().length > 0 : true
-    if (nextStatus) {
-        inDom.append(templateHtml)
-    }
-    // inDom.children(':last-child').children('input').focus()
-}
-
-/* 切换输入框 */
-function showInputBox(_ref) {
-    var _ref$status = _ref.status,
-        status = _ref$status === void 0 ? true : _ref$status,
-        _ref$value = _ref.value,
-        value = _ref$value === void 0 ? '' : _ref$value,
-        _ref$text = _ref.text,
-        text = _ref$text === void 0 ? '添加' : _ref$text,
-        _ref$index = _ref.index,
-        index = _ref$index === void 0 ? null : _ref$index;
-    beforeInput.status = status
-    beforeInput.index = index
-    $(".select-input").addClass((status ? 'left' : 'right') + '-run')
-    var tempIDom = $(".select-input .input-box" + (status ? ':first-child input' : '.right-box input'))
-    tempIDom.val(value).focus().next().text(text)
-    // ios部分机型不显示光标
-    var iosInfo = navigator.userAgent.toLowerCase();
-    var ver= iosInfo.match(/cpu iphone os (.*?) like mac os/);
-    try {
-        if(ver){
-            var tempV = ver[1].split('_')[0]
-            if (tempV >= 11 && tempV <= 12) {
-                setTimeout(function(){
-                    tempIDom.val(value + ' ').focus()
-                }, 300)
-                setTimeout(function(){
-                    tempIDom.val(value).focus()
-                }, 600)
-            }
-        }
-    }catch (e) {
-        console.log('no ios')
-    }
-}
-
-function addInput(status) {
-    showInputBox({
-        status: status,
-        value: beforeInput[status ? 'include' : 'exclude']
-    })
-}
-
-/* toast */
-function wToast (text) {
-    return weui.toast(text, {
-        duration: 2000,
-        className: 'custom-toast'
-    })
-}
-
-/* 改变按钮状态 */
-function changeInputStatus (status, dom) {
-    if (status) {
-        dom.addClass('error')
-    } else {
-        dom.removeClass('error')
-        $('.addButton').removeClass('disabled')
-    }
-}
-
-/* 初始化事件监听 */
-$(function () {
-    /* 获取窗口滚动条高度 */
-    function getScrollTop() {
-        var scrollTop = 0;
-        if (document.documentElement && document.documentElement.scrollTop) {
-            scrollTop = document.documentElement.scrollTop;
-        } else if (document.body) {
-            scrollTop = document.body.scrollTop;
-        }
-        return scrollTop;
-    };
-    $(".select-input input").on('blur', function () {
-        $(".fixed-bottom").show()
-    }).on('focus', function () {
-        $(".fixed-bottom").hide()
-    })
-
-    var oldScrollTop = getScrollTop() || 0
-    document.body.addEventListener('focusout', function () {
-        var ua = window.navigator.userAgent
-        if (ua.indexOf('iPhone') > 0 || ua.indexOf('iPad') > 0) {
-            document.body.scrollTop = oldScrollTop;
-            document.documentElement.scrollTop = oldScrollTop
-        }
-    })
-
-    // 输入框事件
-    $(".select-input .input-box").on('input', 'input', function () {
-        // $(this)[0].scrollIntoView({block: "center"})
-        var nowInput = $(this).val().trim()
-        var aDom = $(this).next()
-        var nowText = aDom.text()
-        if (nowText === '添加') {
-            beforeInput[beforeInput.status ? 'include' : 'exclude'] = nowInput
-        }
-        if (nowInput.length) {
-            aDom.removeClass('disabled')
-        } else {
-            aDom.addClass('disabled')
-        }
-    })
-    $(".select-input .input-box").on('blur', 'input', function () {
-        $(".add-key-word .content-box").removeClass('disabled')
-        $(this).parents('.select-input').removeClass('right-run').removeClass('left-run')
-    })
-    $(".select-input .input-box").on('focus', 'input', function () {
-        $(".add-key-word .content-box").addClass('disabled')
-    })
-    $("#keyStr").on('input', function (e) {
-        var nowInput = $(this).val().trim()
-        KeyData.keyStr = nowInput
-        if (nowInput.length) {
-            $('.submitButton').removeClass('disabled')
-        } else {
-            $('.submitButton').addClass('disabled')
-        }
-    })
-    // $("input").on('input', function () {
-    //     $(this).val($(this).val().slice(0, 20))
-    // })
-    $("input").attr('maxlength', '20')
-    $(".input-group").on('click', 'input', function (e) {
-        var nowType = $(this).parents('.input-group').attr('id') === 'include'
-        var nowInput = $(this).val().trim()
-        var nowIndex = $(this).parents('.input-box').index()
-        var nowInputStatus = $(".add-key-word .content-box").hasClass('disabled')
-        if (nowInputStatus) {
-            e.stopPropagation()
-        } else {
-            showInputBox({
-                status: nowType,
-                value: nowInput,
-                index: nowIndex,
-                text: '修改'
-            })
-        }
-    })
-    // $(".select-input .input-box").on('blur', 'input', function () {
-    //     var nowIndex = $(this).parents('.input-box').index()
-    //     var nowType = $(this).parents('.input-group').attr('id') === 'include'
-    //     var nowInput = $(this).val().trim()
-    //     var nowArr = KeyData[(nowType ? 'in' : 'ex') + 'cludeKeys']
-    //     if (nowInput.length) {
-    //         $(this).next().show()
-    //     } else {
-    //         $(this).next().hide()
-    //     }
-    //     if (nowArr.indexOf(nowInput) !== -1) {
-    //         $(this).css('color', '#fb483d')
-    //     } else {
-    //         $(this).css('color', '#171826')
-    //     }
-    //     nowArr.splice(nowIndex, 1, nowInput)
-    // })
-    // 按钮事件
-    // 按钮事件
-    $(".select-input .input-box a").on('click', function () {
-        $('.fixed-bottom').show()
-        setTimeout(function() {
-            $('.fixed-bottom').show()
-        }, 300)
-        // $(this)[0].scrollIntoView({block: "center"})
-        var nowInput = $(this).prev().val().trim()
-        var nowType = !$(this).parents('.input-box').hasClass('right-box')
-        var nowArr = KeyData[(nowType ? 'in' : 'ex') + 'cludeKeys']
-        var canPush = nowArr.indexOf(nowInput)
-        if (!nowInput.length) {
-            return
-        }
-        if (nowInput.length > 20) {
-            return wToast('每组'+(nowType ? '附加' : '排除')+'词不能超过20个字符')
-        }
-        if (canPush !== -1 && canPush !== beforeInput.index) {
-            return wToast('您设置的'+(nowType ? '附加' : '排除')+'词已存在，请调整后再添加。')
-        }
-        if (beforeInput.index !== null) {
-            $("#" + (nowType ? 'include' : 'exclude')).find('.input-box').eq(beforeInput.index).children('input').val(nowInput)
-            nowArr.splice(beforeInput.index, 1, nowInput)
-        } else {
-            prependKeyDom(nowType, nowInput)
-            nowArr.push(nowInput)
-        }
-        beforeInput.exclude = ''
-        beforeInput.include = ''
-    })
-    $(".submitButton").on('click', function () {
-        var canSub = $(this).hasClass('disabled')
-        if (!canSub) {
-            var kws_arr = JSON.parse(sessionStorage.getItem('kws_arr') || [])
-            if (kws_arr.indexOf(KeyData.keyStr) !== -1 && SessionPageData.key.join(' ') !== KeyData.keyStr) {
-                return wToast('您设置的关键词已存在，请调整后再添加。')
-            }
-            if (KeyData.keyStr.length > 20) {
-                return wToast('关键词不能超过20个字符')
-            }
-            var temp = savePageData('SK')
-            if (temp.flag) {
-                weui.toast('保存成功', {
-                    duration: 2000,
-                    className: 'custom-toast',
-                    callback: function () {
-                        window.history.go(-1)
-                    }
-                });
-            } else {
-                wToast('保存出错，稍后再试')
-            }
-
-        }
-    })
-    $(".input-group").on('click', '.addImg', function () {
-        var tempDom = $(this).parents('.input-box')
-        var nowType = $(this).parents('.input-group').attr('id') === 'include'
-        var nowArr = KeyData[(nowType ? 'in' : 'ex') + 'cludeKeys']
-        nowArr.splice(tempDom.index(), 1)
-        tempDom.remove()
-    })
-})
-echoPageData(SessionPageData)

src/web/staticres/vipsubscribe/js/additionWord.js

@@ -1,190 +0,0 @@
-$(function(){
-
-    $('.knowBtn').on('click',function(){
-        $(".problemPop").hide()
-    })
-    $(".problem").on('click',function(){
-        $(".problemPop").css("display",'flex');
-    })
-
-    function hasWords () {
-        var showKeyWordLength = $(".showKeyWord ul").find('li').length;
-        if(showKeyWordLength === 0){
-            $(".addkeyWord").show();
-            $('.addKeyWord').hide();
-        } else {
-            $(".addkeyWord").hide();
-            $('.addKeyWord').show();
-        }
-    }
-    hasWords()
-    
-    // 添加按钮
-    $(".addKeyWord i").on('click',function(){
-        $(".addkeyWord").show();
-        $(".addKeyWord").hide();
-        $(".addkeyWord input").focus();
-        $('.showKeyWord').find('.one').show();
-        $('.showKeyWord').find('.modify').hide();
-    })
-    // 输入框自适应高度
-    $('textarea').each(function(i,dom){
-        // console.log(i,dom)
-        dom.style.height = dom.scrollHeight +'px';
-    })
-    $("textarea").on("input", function() {
-        this.style.height = 'auto';
-        this.style.height = this.scrollHeight + "px";
-    })
-    // 添加keyWords检查输入框内是否有文字，如果有才能点击添加按钮
-    $('.addkeyWord input.enterOne').on('input', function() {
-        var buttonDOM = $(this).siblings().find('button')[1]
-        if ($.trim($(this).val()).length >= 1) {
-            buttonDOM.style.opacity = 1
-            buttonDOM.removeAttribute("disabled")
-        } else {
-            buttonDOM.style.opacity = .5
-            buttonDOM.setAttribute("disabled", true)
-        }
-    })
-    
-    // 添加 按钮的点击事件
-    $('.addkeyWord .btn button:nth-child(2)').on('click', function(){
-        var timestamp = new Date().getTime();//动态生成不同的id，因为id唯一不能重复，所以 用时间戳 代替  防止重复
-        var keyWord = $.trim($('.addkeyWord input.enterOne').val()).replace(/\s+/g,' ');
-		if(keyWord==""&&keyWord.length==0){
-            weui.toast('附加词不能为空', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-			return
-		}
-		_addindex = 0;
-		if($(".showKeyWord li").length>0){
-        	_addindex =  Number($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex")) + Number(1);
-		}
-		if(addkws_arr[keyWord]!=undefined){
-            weui.toast('您设置的附加词已存在，请调整后再添加。', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-			return
-		}
-        //保存新附加词
-        _addkws = keyWord;
-        saveSession("",_addindex);
-        var html = '<li>'
-            +'<div class="one">'
-            +' <div>'
-            +'<span>'
-            +'<p class="key">'+ keyWord+'</p>'
-            +'</span>'
-            +'</div>'
-            +'<button class="editKeyWord" dataindex="'+_addindex+'"><i class="iconfont icon-xiugai"></i> 修改</button>'
-            +'</div>'
-            +'<div class="modify">'
-            +'<textarea  name=""  rows="1"  placeholder="" maxlength="20">'+keyWord+'</textarea>'
-            +'<button class="deleteKey">删除</button>'
-            +'<button class="ascertainKey">确定</button>'
-            +'</div>'
-            +'</li>'
-
-
-        $('.showKeyWord > ul').prepend(html)
-        // 隐藏
-        $(".addkeyWord").hide();
-        $('.showKeyWord').show();
-        $('.addKeyWord').show();
-        $('.enter.addkeyWord > input').val('')
-        var buttonDOM = $('.enter.addkeyWord .btn button')[1]
-        buttonDOM.style.opacity = .5
-        buttonDOM.setAttribute("disabled", true)
-
-    })
-
-    // 编辑
-    $(".showKeyWord").on('click', '.editKeyWord',function(e){
-        _addindex = Number($(this).attr("dataindex"));
-        $('.enter.addkeyWord').hide()
-        $('.addKeyWord').hide()
-
-        var oSpan = $(this).parent().siblings().children('textarea');
-        var val = $(oSpan).val()
-        $(this).parent().siblings().show().parents('li').siblings().children('.modify').hide().siblings('.one').show()
-        $(oSpan).val('').focus().val(val) 
-        $(this).parent().hide()
-        $(this).parent().siblings().css('display','block')
-    })
-
-    // 编辑 删除
-    $('.showKeyWord').on('click', '.deleteKey', function(e) {
-        var jQueryDOM = $(this).parents('li');
-        _addkws = $.trim($(this).siblings('textarea').val());
-		var _index =  $('.showKeyWord li').length - $(this).parent().parent("li").index() -1;
-        weui.confirm('确定要删除附加词？', {
-            buttons: [{
-                label: '取消',
-                type: 'default',
-                onClick: function () { console.log('不删了') }
-            }, {
-                label: '确定',
-                type: 'primary',
-                onClick: function () {
-                    jQueryDOM.remove();
-                    hasWords();
-                    saveSession("D",_addindex,_index);
-                }
-            }]
-        });
-    })
-    // 编辑 确定
-    $('.showKeyWord').on('click', '.ascertainKey', function(e) {
-        var keyWord = $.trim($(this).siblings('textarea').val());
-		var _index =  $('.showKeyWord li').length - $(this).parent().parent("li").index() -1;
-		if(keyWord.length==0){
-            weui.toast('附加词不能为空', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-		}else if(keyWord.length > 20){
-            weui.toast('每组附加词不能超过20字', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-        }else{
-			if(addkws_arr[keyWord]!=undefined&&addkws_arr[keyWord]!=_addindex){
-	            weui.toast('您设置的附加词已存在，请调整后再添加。', {
-	                duration: 2000,
-	                className: 'custom-toast',
-	                callback: function () { console.log('close') }
-	            });
-				return
-			}
-        	$('.addKeyWord').show()
-            _addkws = keyWord;
-            saveSession("",_addindex,_index);
-            $(this).parent().siblings().find('.key').text(keyWord)
-            $(this).parent().hide().siblings().show()
-        }
-    })
-
-    
-    //防止键盘把当前输入框给挡住
-    var u = navigator.userAgent;
-	var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
-	var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
-	if(isAndroid){
-		//防止键盘把当前输入框给挡住
-	    window.addEventListener('resize', function () {
-	    　　	if (document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA') {
-	        　　		window.setTimeout(function () {
-	　　　　　　　　　	document.activeElement.scrollIntoViewIfNeeded();
-	            }, 0);
-	        }
-	    })
-	}
-})

src/web/staticres/vipsubscribe/js/exclusiveWord.js

@@ -1,204 +0,0 @@
-$(function(){
-
-    $('.knowBtn').on('click',function(){
-        $(".problemPop").hide()
-    })
-    $(".problem").on('click',function(){
-        $(".problemPop").css("display",'flex');
-    })
-
-    function hasWords () {
-        var showKeyWordLength = $(".showKeyWord ul").find('li').length;
-        if(showKeyWordLength === 0){
-            $(".addkeyWord").show();
-            $('.addKeyWord').hide();
-        } else {
-            $(".addkeyWord").hide();
-            $('.addKeyWord').show();
-        }
-    }
-    hasWords()
-    
-    // 添加按钮
-    $(".addKeyWord i").on('click',function(){
-        $(".addkeyWord").show()
-        $(".addKeyWord").hide();
-        $(".addkeyWord input").focus()
-        $('.showKeyWord').find('.one').show()
-        $('.showKeyWord').find('.modify').hide()
-    })
-
-    // 添加keyWords检查输入框内是否有文字，如果有才能点击添加按钮
-    $('.addkeyWord input.enterOne').on('input', function() {
-        if ($(this).val().length >= 100) {
-            var s = $(this).val().slice(0,100)
-            $(this).val(s)
-
-            weui.toast('排除词不能超过100字', {
-                duration: 2000,
-                className: 'text-overflow100',
-                callback: function(){ console.log('close') }
-            });
-            return
-        }
-
-        var buttonDOM = $(this).siblings().find('button')[1]
-        if ($.trim($(this).val()).length >= 1) {
-            buttonDOM.style.opacity = 1
-            buttonDOM.removeAttribute("disabled")
-        } else {
-            buttonDOM.style.opacity = .5
-            buttonDOM.setAttribute("disabled", true)
-        }
-    })
-    // 输入框自适应高度
-    $('textarea').each(function(i,dom){
-        // console.log(i,dom)
-        dom.style.height = dom.scrollHeight +'px';
-    })
-    $("textarea").on("input", function() {
-        this.style.height = 'auto';
-        this.style.height = this.scrollHeight + "px";
-    })
-    // 添加 按钮的点击事件
-   
-    $('.addkeyWord .btn button:nth-child(2)').on('click', function(){
-        var keyWord = $.trim($('.addkeyWord input.enterOne').val()).replace(/\s+/g,' ');
-		if (keyWord==""){
-            weui.toast('排除词不能为空', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-			return
-		}
-		_notindex = 0;
-		if($(".showKeyWord li").length>0){
-        	_notindex = Number($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex")) + Number(1);
-		}
-        //保存新附加词
-        _notkws = keyWord;
-		if(notkws_arr[keyWord]!=undefined){
-            weui.toast('您设置的附加词已存在，请调整后再添加。', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-			return
-		}
-        saveSession("",_notindex);
-        /*var html = `<li>
-                        <div class="one">
-                            <div>
-                                <span>
-                                    <p class="key">${ keyWord }</p>
-                                </span>
-                            </div>
-                            <button class="editKeyWord" dataindex="`+_notindex+`"><i class="iconfont icon-xiugai"></i> 修改</button>
-                        </div>
-                        <div class="modify">
-                            <textarea  name=""  rows="1"  placeholder="">${ keyWord}</textarea>
-                            <button class="deleteKey">删除</button>
-                            <button class="ascertainKey">确定</button>
-                        </div>
-                    </li>`
-        */            
-        var html = "<li><div class=\"one\"><div><span><p class=\"key\">".concat(keyWord, "</p>  </span> </div> <button class=\"editKeyWord\" dataindex=\"") + _notindex + "\"><i class=\"iconfont icon-xiugai\"></i> 修改</button></div><div class=\"modify\"> <textarea  name=\"\"  rows=\"1\"  placeholder=\"\">".concat(keyWord, "</textarea> <button class=\"deleteKey\">删除</button> <button class=\"ascertainKey\">确定</button></div>  </li>");            
-        $('.showKeyWord > ul').prepend(html)
-        
-        // 隐藏
-        $(".addkeyWord").hide();
-        $('.showKeyWord').show();
-        $('.addKeyWord').show();
-        $('.enter.addkeyWord > input').val('')
-        var buttonDOM = $('.enter.addkeyWord .btn button')[1]
-        buttonDOM.style.opacity = .5
-        buttonDOM.setAttribute("disabled", true)
-
-    })
-
-    // 编辑
-    $(".showKeyWord").on('click', '.editKeyWord', function(e){
-        _notindex = Number($(this).attr("dataindex"));
-        $('.enter.addkeyWord').hide()
-        $('.addKeyWord').hide()
-
-        var oSpan = $(this).parent().siblings().children('textarea');
-        var val = $(oSpan).val()
-        $(this).parent().hide()
-        $(this).parent().siblings().show().parents('li').siblings().children('.modify').hide().siblings('.one').show()
-        $(oSpan).val('').focus().val(val) 
-    })
-
-    // 编辑 删除
-    $('.showKeyWord').on('click', '.deleteKey', function(e) {
-        var jQueryDOM = $(this).parents('li');
-        _notkws = $.trim($(this).siblings('textarea').val());
-		var _index =  $('.showKeyWord li').length - $(this).parent().parent("li").index() -1;
-        weui.confirm('确定要删除排除词？', {
-            buttons: [{
-                label: '取消',
-                type: 'default',
-                onClick: function () { console.log('不删了') }
-            }, {
-                label: '确定',
-                type: 'primary',
-                onClick: function () {
-                    jQueryDOM.remove()
-                    hasWords()
-                    saveSession("D",_notindex,_index);
-                }
-            }]
-        });
-        console.log('删除排除词:',$(this).parent().find('span').text())
-    })
-    // 编辑 确定
-    $('.showKeyWord').on('click', '.ascertainKey', function(e) {
-        var $this = $(this);
-        var keyWord = $.trim($(this).siblings('textarea').val());
-		var _index =  $('.showKeyWord li').length - $(this).parent().parent("li").index() -1;
-		if(keyWord.length ==0){
-            weui.toast('排除词不能为空', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-        }else if(keyWord.length > 20){
-            weui.toast('每组排除词不能超过20字', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-        }else{
-			if(notkws_arr[keyWord]!=undefined&&notkws_arr[keyWord]!=_notindex){
-	            weui.toast('您设置的排除词已存在，请调整后再添加。', {
-	                duration: 2000,
-	                className: 'custom-toast',
-	                callback: function () { console.log('close') }
-	            });
-				return
-			}
-            $this.parent().siblings().find('.key').text(keyWord);
-            $this.parent().hide().siblings().show();
-            $('.addKeyWord').show();
-            _notkws = keyWord;
-            saveSession("",_notindex,_index);
-        }
-    })
-
-    
-    //防止键盘把当前输入框给挡住
-    var u = navigator.userAgent;
-	var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
-	var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
-	if(isAndroid){
-		//防止键盘把当前输入框给挡住
-	    window.addEventListener('resize', function () {
-	    　　	if (document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA') {
-	        　　		window.setTimeout(function () {
-	　　　　　　　　　	document.activeElement.scrollIntoViewIfNeeded();
-	            }, 0);
-	        }
-	    })
-	}
-})

src/web/staticres/vipsubscribe/js/keyWord.js

@@ -1,418 +1,407 @@
+var vm = new Vue({
+  delimiters: ['${', '}'],
+  el: '#app',
+  data: {
+    conf: {
+      keywordMax: 300
+    },
+    batchDeleteState: false, // 是否在批量删除状态
+    userData: {}, // getUserInfo接口用户原始数据
+    keywordsGroupList: [], // 所有关键词列表
+    groupNameList: [], // 关键词分类名称列表
+    // 当前信息
+    filter: {
+      loaded: false, // 是否请求加载完成
+      pickerShow: false, //picker是否显示
+      groupName: '', // 为空表示全部
+      allKeywordsList: [],  // 筛选前的数组
+      keywordsList: [], // 筛选后的数组
+    },
+    dialog: {
+      fastImport: false, // 快速导入弹框
+      upgrade: false // 关键词升级提示弹框
+    },
+    tip: {
+      fastImport: true
+    }
+  },
+  computed: {
+    fastImportTipShow: function () {
+      return this.filter.allKeywordsList.length === 0 && this.filter.loaded && this.tip.fastImport
+    },
+    listShow: function () {
+      return this.filter.keywordsList.length !== 0 && this.filter.loaded
+    },
+    emptyShow: function () {
+      return this.filter.keywordsList.length === 0 && this.filter.loaded
+    },
+    selectedCount: function () {
+      var selectedArr = this.getSelectedArr()
+      return selectedArr.length
+    }
+  },
+  created: function () {
+    this.getKeywordsGroupList(true)
+  },
+  mounted: function () {},
+  methods: {
+    showLoading: function () {
+      return this.$toast.loading({
+        duration: 0,
+        forbidClick: true,
+        message: 'loading...',
+      })
+    },
+    showToast: function (message) {
+      return this.$toast({
+        duration: 1500,
+        forbidClick: true,
+        message: message,
+      })
+    },
+    showDialog: function (conf) {
+      var defaultConf = {
+        title: '提示',
+        message: 'message',
+        className: 'j-confirm-dialog',
+        showConfirmButton: true,
+        showCancelButton: true,
+        confirmButtonColor: '#2abed1'
+      }
+      if (conf) {
+        Object.assign(defaultConf, conf)
+      }
+      return this.$dialog.confirm(defaultConf)
+    },
+    // 对象转form
+    qsStringify: function (t) {
+      var arr = []
+      for (var k in t) {
+        arr.push(`${k}=${t[k]}`)
+      }
+      return arr.join('&')
+    },
+    getKeywordsGroupList: function (needLoading) {
+      var _this = this
+      if (needLoading)  {
+        var loading = this.showLoading()
+      }
+      $.ajax({
+        type: 'POST',
+        url: '/subscribepay/afterPay/getUserInfo?t=' + Date.now(),
+        success: function (res) {
+          if (needLoading) {
+            loading && loading.clear()
+          }
+          if (res && res.userData) {
+            _this.userData = res.userData
+            if (res.userData && res.userData.o_vipjy) {
+              // 整理数据
+              var groupList = _this.addInfoToKeyItem(res.userData.o_vipjy.a_items)
+              var groupNameList = _this.getGroupNameList(groupList)
+              _this.keywordsGroupList = groupList
+              _this.groupNameList = groupNameList
+              _this.doFilter(_this.filter.groupName)
+              _this.filter.allKeywordsList = _this.filterKeywordsList()
+            }
+          }
+        },
+        error: function () {
+          if (needLoading) {
+            loading && loading.clear()
+          }
+        },
+        complete: function () {
+          _this.filter.loaded = true
+        }
+      })
+    },
+    // 向关键词中添加一些信息
+    addInfoToKeyItem: function (groupList) {
+      if (!Array.isArray(groupList)) return []
 
-var reloadFunc = function(){
-    
-    //去空格方法
-    // String.prototype.trim = function () {
-    //     return this.replace(/(^\s*)|(\s*$)/g, ' ');
-    // }
-
-    // 疑问解答相关操作
-    $('.knowBtn').on('click', function () {
-        $(".problemPop").hide()
-    })
-    $(".problem").on('click', function () {
-        $(".problemPop").css("display", 'flex');
-    })
-
-    $(".enterOne").focus(function () {
-        $(".btnChoose").show();
-    })
+      groupList.forEach(function (keywordsList, index) {
+        if (Array.isArray(keywordsList.a_key)) {
+          keywordsList.a_key.forEach(function (keyword, iindex) {
+            // 添加一些其他信息
+            keyword.groupName = keywordsList.s_item // 分类名
+            keyword.groupIndex = index // 该关键词所在分类 在分类列表中的索引
+            keyword.keyIndex = iindex // 该关键词在其所在分类中的索引
+          })
+        }
+      })
 
-    // 输入框自适应高度
-    $('textarea').each(function(i,dom){
-        dom.style.height = dom.scrollHeight +'px';
-    })
-    $("textarea").on("input", function() {
-        this.style.height = 'auto';
-        this.style.height = this.scrollHeight + "px";
-    })
+      return groupList
+    },
+    getGroupNameList: function (keywordsGroupList) {
+      var groupNameList = []
+      if (!Array.isArray(keywordsGroupList)) return groupNameList
+      keywordsGroupList.forEach(function (item, index) {
+        var count = Array.isArray(item.a_key) ? item.a_key.length : 0
+        groupNameList.push({
+          name: item.s_item, // 分类名
+          count: count // 分类下有多少个关键词
+        })
+      })
+      return groupNameList
+    },
+    calcKeyInfo: function (item) {
+      // 匹配方式 item.matchway 0/null精准 1模糊
+      var key = item.key
+      var notkey = []
+      if (Array.isArray(item.appendkey)) {
+        key = key.concat(item.appendkey)
+      }
+      if (Array.isArray(item.notkey)) {
+        notkey = item.notkey
+      }
 
-    // 添加keyWords检查输入框内是否有文字，如果有才能点击添加按钮
-    $('.content .addkeyWord input.enterOne').on('input', function () {
-        var buttonDOM = $(this).siblings()[1].children[1]
-        if ($.trim($(this).val()).length >= 1) {
-            buttonDOM.style.opacity = 1
-            buttonDOM.removeAttribute("disabled")
+      return {
+        key: key.join(' '),
+        notkey: notkey.join(' '),
+        matchWay: item.matchway == 1 ? '模糊' : '精准',
+        matchWayClass: item.matchway == 1 ? 'tag-orange' : 'tag-green'
+      }
+    },
+    showFilterPicker: function (f) {
+      this.filter.pickerShow = f
+    },
+    checkThisGroup: function (item) {
+      var groupName = ''
+      if (item) {
+        groupName = item.name
+      } else {
+        groupName = ''
+      }
+      this.doFilter(groupName)
+      this.showFilterPicker(false)
+    },
+    doFilter: function (groupName) {
+      this.filter.groupName = groupName
+      var rList = this.filterKeywordsList(groupName)
+      this.filter.keywordsList = rList
+    },
+    // 筛选分类列表
+    filterKeywordsList: function (filterName) {
+      var list = []
+      // 筛选关键词
+      this.keywordsGroupList.forEach(function (keywordsList) {
+        if (Array.isArray(keywordsList.a_key)) {
+          keywordsList.a_key.forEach(function (keyword) {
+            // 筛选全部(筛选词为空)，需要把关键词所属分类信息记录
+            if (!filterName) {
+              list.push(keyword)
+            } else {
+              if (filterName === keywordsList.s_item) {
+                list.push(keyword)
+              }
+            }
+          })
+        }
+      })
+      // 给新的list添加checked
+      list = JSON.parse(JSON.stringify(list))
+      list.forEach(function (item) {
+        item.checked = false
+        item.calcInfo = this.calcKeyInfo(item)
+      }.bind(this))
+      return list
+    },
+    clickKeyCard: function (item) {
+      if (this.batchDeleteState) {
+        // 执行点击选中逻辑
+        // 如果关键词组下有关键词，则不能点击
+        item.checked = !item.checked
+      } else {
+        // type: edit编辑、add新增
+        // gIndex: groupIndex 该关键词所在分类 在分类列表中的索引
+        // kIndex: keyIndex 该关键词在其所在分类中的索引
+        location.href = `/front/vipsubscribe/toSetInfoPage?type=edit&gIndex=${item.groupIndex}&kIndex=${item.keyIndex}`
+      }
+    },
+    batchDeleteStateChange: function () {
+      this.batchDeleteState = !this.batchDeleteState
+    },
+    batchDelete: function () {
+      var _this = this
+      if (this.selectedCount <= 0) return
+      this.showDialog({
+        title: '',
+        message: '确定删除所选' + this.selectedCount + '个关键词吗？',
+        className: 'j-confirm-dialog text-center',
+      }).then(function () {
+        console.log('确认批量删除关键词')
+        _this.batchDeleteConfirmed()
+      })
+      .catch(function() {
+        console.log('取消批量删除关键词')
+      })
+    },
+    getSelectedArr: function () {
+      var selectedArr = []
+      this.filter.keywordsList.forEach(function (item) {
+        if (item.checked) {
+          selectedArr.push(item)
+        }
+      })
+      return selectedArr
+    },
+    getDeleteKey: function () {
+      var deleteKeyArr = {}
+      var deleteKey = {}
+      var selectedArr = this.getSelectedArr()
+      selectedArr.forEach(function (item) {
+        var groupIndex = item.groupIndex
+        var keyIndex = item.keyIndex
+        if (deleteKeyArr[groupIndex]) {
+          deleteKeyArr[groupIndex].push(keyIndex)
         } else {
-            buttonDOM.style.opacity = .5
-            buttonDOM.setAttribute("disabled", true)
+          deleteKeyArr[groupIndex] = [keyIndex]
         }
-    })
-
-    // 添加 确认按钮的点击事件
-    $('.content .addkeyWord .btn button:nth-child(2)').on('click', function () {
-		setTimeout(function(){
-	        var keyWord = $.trim($('.addkeyWord input.enterOne').val());
-			if(keyWord==""){
-				return
-			}
-			if(kws_arr[keyWord]!=undefined){
-	            weui.toast('您设置的关键词已存在，请调整后再添加。', {
-	                duration: 2000,
-	                className: 'custom-toast',
-	                callback: function () { console.log('close') }
-	            });
-				return
-			}
-	        if(kws_name.length > 20){
-	            weui.toast('关键词不能超过20字', {
-	                duration: 2000,
-	                className: 'custom-toast',
-	                callback: function () { console.log('close') }
-	            });
-	        }
-	        kws_name = keyWord;
-			kws_index = $(".showKeyWord li").length;
-	        if(kws_index==0){
-	            //分类首次添加关键词需重新获取分类索引
-	            classify_index = a_items.length;
-	        }
-			var _index = 0;
-			if($(".showKeyWord li").length>0){
-	        	_index =  Number($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex")) + Number(1);
-			}
-	        classify_name = $.trim($('.classify-r .classify-detail').text());
-	        //保存关键词
-	        kws_count = parseInt(kws_count) + 1;
-	        if(kws_count>300){
-	            weui.toast('您设置的关键词已超出最高上限，请调整后再添加。', {
-	                duration: 2000,
-	                className: 'custom-toast',
-	                callback: function () { console.log('close') }
-	            });
-	        }else if (saveData("SK")){
-	            // 设置状态 首次添加关键词
-	            if(a_items.length==0){
-	                setEmptyHistory();
-	            }
-	            //
-	            doSessionData("",_index);
-	            $(".add-keyword-container .addNewKeyword i").show();
-	            //点击保存关键词，查看缓存中存的附加词 和排除词。
-	            $(".kws_count").text(kws_count);
-	            var html = "<li><div class=\"one\"><div><span><strong> 关键词：</strong><p class=\"key\">"+keyWord+"</p></span>"
-	                if (addition_kws.length>0){
-	                    html +='<span>'
-	                                +'<strong> 附加词：</strong>'
-	                                +'<p class="addition" addArr=\''+addition_kws+'\'>'+addition_kws.join(" ")+'</p>'
-	                                +'</span>'
-	                }
-	                if (not_kws.length>0){
-	                    html +='<span>'
-	                                +'<strong> 排除词：</strong>'
-	                                +'<p class="notkey" notArr=\''+not_kws+'\'>'+not_kws.join(" ")+'</p>'
-	                                +'</span>'
-	                }
-	                html +="</div>"
-	                        +"<button class=\"editKeyWord\" onClick=\"editKeyWord(this)\"  dataIndex="+_index+"><i class=\"iconfont icon-xiugai\"></i> 修改</button>"
-	                        +"</div>"
-	                        +"<div class=\"modify\">"
-	                        +"<textarea  name=\"\"  rows=\"1\"  placeholder=\"\" maxlength=\"20\">"+keyWord+"</textarea>"
-	            if (addition_kws.length>0){
-	                html +="<button class=\"addAdjunctWord\" onClick=\"toappendkey(this)\">编辑 附加词<i>("+addition_kws.length+")</i></button>"
-	            }else{
-	                html +="<button class=\"addAdjunctWord\" onClick=\"toappendkey(this)\">添加 附加词</button>"
-	            }
-	            if (not_kws.length>0){
-	                html +="<button class=\"addExclusion\" onClick=\"tonotkey(this)\">编辑 排除词<i>("+not_kws.length+")</i></button>"
-	            }else{
-	                html +="<button class=\"addExclusion\" onClick=\"tonotkey(this)\">添加 排除词</button>"
-	            }
-	                html +="<button class=\"deleteKey\" onClick=\"deleteKey(this)\">删除</button><button class=\"ascertainKey\" dataIndex="+_index+" onclick=\"saveK(this)\">确定</button></div></li>"
-	            $('.showKeyWord > ul').prepend(html);
-	            // 添加完成隐藏输入框
-	            $(".enter.addkeyWord").hide();
-	            // 还原状态
-	            $('.enter.addkeyWord > input').val('')
-	            //把kws_name,kws_index,addition_kws,not_kws初始化
-	            kws_index = 0;
-	            kws_name = "";
-	            addition_kws = [];
-	            not_kws = [];
-				//
-	            var buttonDOM = $('.enter.addkeyWord .btn button')[1]
-	            buttonDOM.style.opacity = .5
-	            buttonDOM.setAttribute("disabled", true)
-	            //保存关键词 查看关键词数量 未分类 超过20 100提示
-	            if(classify_name.indexOf("未分类")>-1){
-	                if((kws_tips==1&&$(".showKeyWord li").length>=20)||(kws_tips==20&&$(".showKeyWord li").length>=100)){
-	                    //未分类 20个关键词提示，100个关键词提示
-	                    showMeg();
-	                    var param = {};
-	                    param.classify_index = classify_index;
-	                    if(kws_tips==1){
-	                        param.kws_tips = 20;
-	                    }else if(kws_tips==20){
-	                        param.kws_tips = 100;
-	                    }
-	                    $.post("/subscribepay/afterPay/updateUserTips",param,function(r){
-	                        if(r.flag){
-	                            kws_tips = param.kws_tips;
-	                            $(".classify").attr("tips",kws_tips);
-	                        }
-	                    })
-	                }
-	            }
-	        }
-		},150)
-    })
-//    // 编辑
-//    $(".showKeyWord").on('click', '.editKeyWord', function (e) {
-//        kws_name = $.trim($(this).parent().find('.key').text());
-//        //当前关键词数组的位置 是数组的总长度-当前所在的位置-1 数组正序索引
-//        kws_index = $('.showKeyWord li').length - $(this).parent().parent("li").index() -1;
-//        if($(this).prev('div').find(".addition").text()!=""){
-//			addition_kws = $(this).prev('div').find(".addition").attr("addArr").split(",")
-//        }else{
-//            addition_kws = []
-//        }
-//        if ($(this).prev('div').find(".notkey").text()!=""){
-//            not_kws = $(this).prev('div').find(".notkey").attr("notArr").split(",")
-//        }else{
-//            not_kws = []
-//        }
-//        $('.enter.addkeyWord').hide()
-//        var oSpan = $(this).parent().siblings().children('textarea');
-//        var val =  $.trim($(oSpan).val());
-//        $(this).parent().hide()
-//        $(this).parent().siblings().show().parent().siblings().children('.modify').hide().siblings('.one').show()
-//        $(oSpan).val('').focus().val(val) 
-//        $(".add-keyword-container .addNewKeyword i").hide()
-//    })
+      })
 
-//    // 编辑删除
-//    $('.showKeyWord').on('click', '.deleteKey', function (e) {
-//        var delFlag = false;
-//		var _index = Number($(this).next(".ascertainKey").attr("dataindex"));
-//        var jQueryDOM = $(this).parents('li')
-//        weui.confirm('确定要删除关键词？', {
-//            buttons: [{
-//                label: '取消',
-//                type: 'default',
-//                onClick: function () { console.log('不删了') }
-//            }, {
-//                label: '确定',
-//                type: 'primary',
-//                onClick: function () {
-//                    if (delFlag) {
-//                        return
-//                    }
-//                    delFlag = true;
-//                    if(saveData('DK')){
-//                        kws_count -= 1;
-//                        $(".kws_count").text(kws_count);
-//                        jQueryDOM.remove();
-//						if($(".showKeyWord ul").find('li').length==0){
-//			                $(".enter.addkeyWord").find(".btnChoose button").eq(0).html('添加 附加词');
-//			                $(".enter.addkeyWord").find(".btnChoose button").eq(1).html('添加 排除词');
-//			                $(".enter.addkeyWord").find("input").val("");
-//						}else{
-//							$(".add-keyword-container .addNewKeyword i").show();
-//						}
-//                        hasWords();
-//                        doSessionData('DK',_index);
-//			            //把kws_name,kws_index,addition_kws,not_kws初始化
-//			            kws_index = 0;
-//			            kws_name = "";
-//			            addition_kws = [];
-//			            not_kws = [];
-//                    }else{
-//			            weui.toast('无法删除', {
-//			                duration: 2000,
-//			                className: 'custom-toast',
-//			                callback: function () { console.log('close') }
-//			            });
-//                    }
-//                }
-//            }]
-//        });
-//        console.log('删除关键词:', $(this).parent().find('textarea').val())
-
-//    })
-    // 编辑确定
-    // $('.showKeyWord').on('click', '.ascertainKey', function (e) {
-    //     var $this = $(this)
-    //     var keyWord = $(this).siblings('textarea').val()
-    //     if(keyWord.length > 20){
-    //         weui.toast('关键词不能超过20字', {
-    //             duration: 2000,
-    //             className: 'custom-toast',
-    //             callback: function () { console.log('close') }
-    //         });
-    //     }else{
-    //         $this.parent().siblings().find('.key').text(keyWord)
-    //         $this.parent().hide().siblings().show()
-    //         $('.addKeyWord').show()
-    //     }
-    // })
-    
-    //防止键盘把当前输入框给挡住
-    var u = navigator.userAgent;
-	var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
-	var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
-	if(isAndroid){
-		//防止键盘把当前输入框给挡住
-	    window.addEventListener('resize', function () {
-	    　　	if (document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA') {
-	        　　		window.setTimeout(function () {
-	　　　　　　　　　	document.activeElement.scrollIntoViewIfNeeded();
-	            }, 0);
-	        }
-	    })
-	}
-	(/iphone|ipod|ipad/i.test(navigator.appVersion)) && document.addEventListener('blur', function(e) {
-	    // 这里加了个类型判断，因为a等元素也会触发blur事件
-	    ['input', 'textarea'].includes(e.target.localName) && document.body.scrollIntoView(false)
-	}, true)
-
-    // 显示关键词分类弹框
-    $('.classify-r').on('click', function(){
-		modalOne();
-    })
-    // 显示快速导入弹框
-    $('.classify-fast').on('click', function(){
-		modalTwo();
-    })
-    // 关键词分类 - 去设置按钮点击事件
-    $('.classify-fast-pop .dialog__btn_confirm').on('click', function() {
-		$.ajax({
-            type: "POST",
-            url: "/subscribepay/afterPay/fastImport",
-            data: {c_index:classify_index,k_index:$(".showKeyWord li").length,c_name:$(".classify-detail").text()},
-            dataType: "json",
-            async: false,
-            traditional: true,
-            success: function(r){
-				$('.classify-fast-pop').hide();
-                if(r.flagInt==1){
-					sessionStorage.fastimport = r.flagInt;
-					$(".classify-fast").hide();
-					var kwcount = r.kwMap.length;
-					var newCount = parseInt($(".addNewKeyword .kws_count").text())+parseInt(kwcount);
-					$(".kws_count").text(newCount);
-					weui.toast('成功导入'+kwcount+'个关键词', {
-		                duration: 2000,
-		                className: 'custom-toast',
-		                callback: function () { console.log('close') }
-		            });
-					//if($(".classify .classify-detail").text()=="未分类"){
-					var _keyArr = r.kwMap;
-					var p = $(".showKeyWord li").length;
-					if($(".showKeyWord li").length==0){
-                    	var classifyArr = {"s_item":"未分类","a_key":[]}
-                        a_items.push(classifyArr);
-					}else{
-						a_items[classify_index]["s_item"]="未分类";
-					}
-	                for (var i = 0; i< _keyArr.length; i++) {
-						a_items[classify_index]["a_key"].push(_keyArr[i]);
-						kws_arr[_keyArr[i]["key"].join(" ")] = p+"-"+classify_index
-           				var kwsHtml = '';
-	                    var nk_showClass = 'hide';//是否显示排除词个数
-	                    var nk_remark = '添加';
-	                    var notkeylth = 0;
-	                    kwsHtml +='<li>'
-	                    kwsHtml +='<div class="one" style="">'
-	                    kwsHtml +='<div>'
-	                                +'<span><strong> 关键词：</strong>'
-	                                +'<p class="key">'+_keyArr[i]["key"].join(" ")+'</p></span>'
-	                    if (_keyArr[i]["notkey"]!=undefined&&_keyArr[i]["notkey"].length>0){
-	                        nk_showClass = "";
-	                        nk_remark = '编辑';
-	                        notkeylth = _keyArr[i]["notkey"].length;
-	                        kwsHtml +='<span>'
-	                                    +'<strong> 排除词：</strong>'
-	                                    +'<p class="notkey" notArr=\''+_keyArr[i]["notkey"]+'\'>'+_keyArr[i]["notkey"].join(" ")+'</p>'
-	                                    +'</span>'
-	                    }
-	                    kwsHtml +='</div>'
-	                                +'<button class="editKeyWord" dataIndex="'+p+'"><i class="iconfont icon-xiugai"></i> 修改</button>'
-	                                +'</div>'
-	                     
-	                    if(modifyFlag&&i==kws_index){
-	                        kwsHtml +='<div class="modify" style="display:block;">'
-	                        if(not_kws.length>0){
-	                            notkeylth = not_kws.length;
-	                        }
-	                    }else{
-	                        kwsHtml +='<div class="modify" style="display: none;">'
-	                    }
-	                    kwsHtml +='<textarea name="" rows="1" placeholder="" maxlength="20">'+_keyArr[i]["key"].join(" ")+'</textarea>'
-	                                +'<button class="addAdjunctWord" onclick="toappendkey(this)">添加 附加词 <i class="appendkey hide">(0)</i></button>'
-	                                +'<button class="addExclusion" onclick="tonotkey(this)">'+nk_remark+' 排除词 <i class="notkey '+nk_showClass+'">('+notkeylth+')</i></button>'
-	                                +'<button class="deleteKey" onClick="deleteKey(this)">删除</button>'
-	                                +'<button class="ascertainKey" dataIndex="'+p+'" onclick="saveK(this)">确定</button>'
-	                                +'</div>'
-	                                +'</li>'
-						$(kwsHtml).prependTo(".showKeyWord ul");
-						p = parseInt(p) + 1;
-	                }
-					//}
-				}else{
-					weui.toast('导入失败', {
-		                duration: 2000,
-		                className: 'custom-toast',
-		                callback: function () { console.log('close') }
-		            });
-				}
-            }
-        });
-    })
-    // 关键词分类 - 取消按钮点击事件
-    $('.classify-fast-pop .dialog__btn_cancel').on('click', function() {
-        $('.classify-fast-pop').hide();
-    })
-    //
+      for (var key in deleteKeyArr) {
+        if (Array.isArray(deleteKeyArr[key])) {
+          deleteKey[key] = deleteKeyArr[key].join(',')
+        }
+      }
+      return deleteKey
+    },
+    batchDeleteConfirmed: function () {
+      var deleteKey = this.getDeleteKey()
+      var loading = this.showLoading()
+      var _this = this
+      $.ajax({
+        url: '/subscribepay/afterPay/setUserInfo',
+        type: 'POST',
+        data: {
+          pageType: 'keyWords',
+          actionType: 'DK',
+          delete_key: JSON.stringify(deleteKey)
+        },
+        success: function (res) {
+          loading && loading.clear()
+          if (res.flag) {
+            _this.showToast('删除成功')
+            _this.getKeywordsGroupList()
+            _this.batchDeleteState = false
+          } else {
+            _this.showToast(res.msg ? res.msg : '删除失败' )
+          }
+        },
+        error: function () {
+          loading && loading.clear()
+        }
+      })
+    },
+    beforeKeySwipeCellClose: function (e) {
+      // position 为关闭时点击的位置
+      // instance 为对应的 SwipeCell 实例
+      var position = e.position
+      var instance = e.instance
+      var index = e.name
 
-    $('.classify-edit-pop .classify-keyword').bind('input propertychange', function() {
-        var s = $('input.classify-keyword').val()
-        // 去空格
-        s = s.trim()
-        if (s.length === 0) {
-            $('.weui-dialog__ft .dialog__btn_confirm').addClass("opacity6");
-            return
+      switch (position) {
+        case 'left': {
+          break
+        }
+        case 'cell': {
+          instance.close()
+          break
         }
-        $('.weui-dialog__ft .dialog__btn_confirm').removeClass("opacity6");
-    })
-    // 关键词分类 - 确定按钮点击事件
-    $('.classify-edit-pop .dialog__btn_confirm').on('click', function() {
-        classify_name = $.trim($('input.classify-keyword').val());
-        // 去空格
-        classify_name = classify_name.trim();
-        if (classify_name.length === 0) {
-            return
+        case 'outside': {
+          instance.close()
+          break
         }
-        //分类名称是否已存在
-        if($.inArray(classify_name, classify_arr)>-1){
-            weui.toast('此分类名称已存在', {
-                duration: 2000,
-                className: 'custom-toast',
-                callback: function () { console.log('close') }
-            });
-            return
+        case 'right': {
+          this.delThisKey(index, instance)
+          break
         }
-		if(classify_name.length > 20){
-			classify_name = classify_name.substring(0,20);
-		}
-        $(this).removeClass("opacity6");
-        $('.classify-r .classify-detail').text(classify_name);
-        // 关闭弹框后要重置input内容
-        $('.classify-edit-pop').hide();
-        $('input.classify-keyword').val('');
-        if($(".showKeyWord li").length>0){
-			kws_name = classify_name;
-            saveData('SC')
-			kws_name = "";
-            a_items[classify_index]["s_item"] = classify_name;
-			setTimeout(function(){
-				doSessionData();
-			},300)
+        default: {
+          break
         }
-    })
+      }
+    },
+    /**
+     * 删除单个关键词
+     * @param {number} index 当前关键词在列表中的index
+     * @param {Object} instance SwipeCell的实例
+     */
+    delThisKey: function (index, instance) {
+      var _this = this
+      // 需要找到当前关键词组的item
+      var key = this.filter.keywordsList[index]
+      this.showDialog({
+        title: '',
+        message: '确定删除当前关键词？',
+        confirmButtonText: '删除',
+        className: 'j-confirm-dialog text-center'
+      }).then(function () {
+        // 点击确定，将当前关键词在批量选选择中，选中
+        key.checked = true
+        _this.batchDeleteConfirmed()
+      }).catch(function () {
+        console.log('取消删除关键词')
+      })
+    },
+    // 根据分类名，得到分类索引
+    getGroupIndexWithGroupName: function (gn) {
+      var groupIndex = -1
+      this.keywordsGroupList.forEach(function(item, index) {
+        console.log(item)
+        if (gn === item.s_item) {
+          groupIndex = index
+        }
+      })
+      return groupIndex
+    },
+    addKeyWord: function () {
+      var query = {
+        type: 'add'
+      }
+      // 新增，往哪个分组下新增（默认往未分组下新增）
+      var groupIndex = this.getGroupIndexWithGroupName(this.filter.groupName)
+      if (groupIndex != -1) {
+        query.gIndex = groupIndex
+      }
 
-    // 关键词分类 - 取消按钮点击事件
-    $('.classify-edit-pop .dialog__btn_cancel').on('click', function() {
-        $('.classify-edit-pop').hide()
-        $('input.classify-keyword').val('')
-    })
-}
+      var queryString = this.qsStringify(query)
+      location.href = '/front/vipsubscribe/toSetInfoPage' + '?' + queryString
+    },
+    toKeyManagePage: function () {
+      location.href = '/front/vipsubscribe/toSetManagePage'
+    },
+    fastImportDialogShow: function () {
+      this.dialog.fastImport = true
+    },
+    fastImport: function () {
+      var _this = this
+      var loading = this.showLoading()
+      $.ajax({
+        type: 'POST',
+        url: '/subscribepay/afterPay/fastImport',
+        data: {
+          c_index: _this.keywordsGroupList.length,
+          c_name: '未分类'
+        },
+        success: function (r) {
+          loading && loading.clear()
+          if (r.flagInt == 1) {
+            _this.showToast('成功导入' + r.kwMap.length + '个关键词')
+            _this.getKeywordsGroupList()
+          } else {
+            _this.showToast('导入失败')
+          }
+          try {
+            JyObj.checkLab(); //刷新搜索首页和订阅首页
+            sessionStorage.reloadHomePage = true;
+            sessionStorage.reloadSubPage = true;
+          } catch (e) {}
+        },
+        error: function () {
+          loading && loading.clear()
+        }
+      })
+    }
+  }
+})

src/web/staticres/vipsubscribe/js/keyword-info.js

@@ -0,0 +1,612 @@
+var vm = new Vue({
+  delimiters: ['${', '}'],
+  el: '#app',
+  data: {
+    conf: {
+      keywordMax: 300
+    },
+    userData: {}, // getUserInfo接口用户原始数据
+    keywordsGroupList: [], // 所有关键词列表
+    groupNameList: [], // 关键词分类名称列表
+    allKeywordsList: [], // 所有关键词列表
+    matchWayList: [
+      {
+        title: '模糊匹配',
+        subInfo: '任意1个关键词匹配成功即推送',
+        value: 1
+      },
+      {
+        title: '精准匹配',
+        subInfo: '同时包含所有关键词才推送',
+        value: 0
+      }
+    ],
+    // 当前页面信息
+    pInfo: {
+      editType: '', // 当前页面状态(add新增关键词，edit修改关键词)
+      gIndex: '', // gIndex: groupIndex 该关键词所在分类 在分类列表中的索引
+      kIndex: '', // kIndex: keyIndex 该关键词在其所在分类中的索引
+      pushCount: 0
+    },
+    // 当前关键词信息
+    keyInfo: {
+      key: '',
+      matchWay: 1, // 0精准/1模糊->新增默认为：模糊1
+      notKey: ''
+    },
+    showNotKeyModule: false,
+    // 关键词刷新状态保存(类似前端分页)
+    recListState: {
+      loading: false, // 是否刷新中?
+      loaded: false, // 请求是否完成
+      pageNum: 1,
+      pageSize: 6,
+      total: 0, // 一共多少条数据
+      list: [],
+      listAll: [] // 后端返回的全部推荐关键词
+    },
+  },
+  computed: {
+    tooLittleTipShow: function () {
+      return this.pInfo.pushCount < 30
+    }
+  },
+  created: function () {
+    // 获取url参数
+    var type = utils.getParam('type')
+    var gIndex = utils.getParam('gIndex')
+    var kIndex = utils.getParam('kIndex')
+    this.pInfo.editType = type ? type : 'add'
+    if (gIndex !== '' && gIndex !== undefined && gIndex !== null) {
+      this.pInfo.gIndex = gIndex
+    }
+    if (kIndex !== '' && kIndex !== undefined && kIndex !== null) {
+      this.pInfo.kIndex = kIndex
+    }
+
+    this.getKeywordsGroupList({
+      needLoading: true,
+      callback: function () {
+        this.getKeyRecommend()
+        if (this.pInfo.editType === 'edit') {
+          this.getPushCount()
+        }
+      }.bind(this)
+    })
+  },
+  mounted: function () {},
+  methods: {
+    showLoading: function () {
+      return this.$toast.loading({
+        duration: 0,
+        forbidClick: true,
+        message: 'loading...',
+      })
+    },
+    showToast: function (message) {
+      return this.$toast({
+        duration: 1500,
+        forbidClick: true,
+        message: message,
+      })
+    },
+    showDialog: function (conf) {
+      var defaultConf = {
+        title: '提示',
+        message: 'message',
+        className: 'j-confirm-dialog',
+        showConfirmButton: true,
+        showCancelButton: true,
+        confirmButtonColor: '#2abed1'
+      }
+      if (conf) {
+        Object.assign(defaultConf, conf)
+      }
+      return this.$dialog.confirm(defaultConf)
+    },
+    getPushCount: function () {
+      var groupInfo = {
+        name: '',
+        kIndex: -1
+      }
+      if (this.pInfo.editType === 'add') {
+        
+      } else if (this.pInfo.editType === 'edit') {
+        groupInfo.name = this.keywordsGroupList[this.pInfo.gIndex].s_item
+        groupInfo.kIndex = this.pInfo.kIndex
+      } else {
+        return
+      }
+
+      this.getPushCountConfirmed(groupInfo)
+    },
+    getPushCountConfirmed: function (groupInfo) {
+      var _this = this
+      // 全部关键词-推送结果预览总数参数：item值为空 index值为-1
+      // 某个关键词组-推送结果预览总数参数：item值不为空 index值大于等于0
+      $.ajax({
+        url: '/subscribepay/afterPay/getPushCount',
+        type: 'POST',
+        data: {
+          item: groupInfo.name, // 关键词组所在分类名称
+          index: groupInfo.kIndex // 关键词组所在分类下的索引位置
+        },
+        success: function (res) {
+          if (res && res.count) {
+            _this.pInfo.pushCount = res.count
+          }
+        }
+      })
+    },
+    getKeywordsGroupList: function (options) {
+      var defaultOptions = {
+        async: true,
+        needLoading: false,
+        callback: ''
+      }
+      if (options) {
+        Object.assign(defaultOptions, options)
+      }
+      var _this = this
+      if (defaultOptions.needLoading) {
+        var loading = this.showLoading()
+      }
+      $.ajax({
+        type: 'POST',
+        url: '/subscribepay/afterPay/getUserInfo?t=' + Date.now(),
+        async: defaultOptions.async,
+        success: function (res) {
+          if (defaultOptions.needLoading) {
+            loading && loading.clear()
+          }
+          if (res && res.userData) {
+            _this.userData = res.userData
+            if (res.userData && res.userData.o_vipjy) {
+              // 整理数据
+              var groupList = _this.addInfoToKeyItem(res.userData.o_vipjy.a_items)
+              var groupNameList = _this.getGroupNameList(groupList)
+              _this.keywordsGroupList = groupList
+              _this.groupNameList = groupNameList
+              _this.allKeywordsList = _this.filterKeywordsList()
+              if (_this.pInfo.editType === 'edit') {
+                _this.getKeyInfoFromIndex()
+              }
+              defaultOptions.callback && defaultOptions.callback()
+            }
+          }
+        },
+        error: function () {
+          if (defaultOptions.needLoading) {
+            loading && loading.clear()
+          }
+        }
+      })
+    },
+    // 向关键词中添加一些信息
+    addInfoToKeyItem: function (groupList) {
+      if (!Array.isArray(groupList)) return []
+
+      groupList.forEach(function (keywordsList, index) {
+        if (Array.isArray(keywordsList.a_key)) {
+          keywordsList.a_key.forEach(function (keyword, iindex) {
+            // 添加一些其他信息
+            keyword.groupName = keywordsList.s_item // 分类名
+            keyword.groupIndex = index // 该关键词所在分类 在分类列表中的索引
+            keyword.keyIndex = iindex // 该关键词在其所在分类中的索引
+          })
+        }
+      })
+
+      return groupList
+    },
+    getGroupNameList: function (keywordsGroupList) {
+      var groupNameList = []
+      if (!Array.isArray(keywordsGroupList)) return groupNameList
+      keywordsGroupList.forEach(function (item, index) {
+        var count = Array.isArray(item.a_key) ? item.a_key.length : 0
+        groupNameList.push({
+          name: item.s_item, // 分类名
+          checked: false,
+          count: count // 分类下有多少个关键词
+        })
+      })
+      return groupNameList
+    },
+    calcKeyInfo: function (item) {
+      // 匹配方式 item.matchWay 0/null精准 1模糊
+      var key = item.key
+      var notkey = []
+      if (Array.isArray(item.appendkey)) {
+        key = key.concat(item.appendkey)
+      }
+      if (Array.isArray(item.notkey)) {
+        notkey = item.notkey
+      }
+
+      return {
+        key: key.join(' '),
+        notkey: notkey.join(' '),
+        matchWay: item.matchway == 1 ? '模糊' : '精准',
+        matchWayClass: item.matchway == 1 ? 'tag-orange' : 'tag-green'
+      }
+    },
+    getKeyInfoFromIndex: function () {
+      // 关键词所在分类
+      var keyList = this.keywordsGroupList[this.pInfo.gIndex]
+      var keyMap = keyList.a_key[this.pInfo.kIndex]
+      var keyArr = keyMap.key
+      if (Array.isArray(keyMap.appendkey)) {
+        keyArr = keyArr.concat(keyMap.appendkey)
+      }
+      var notKeyArr = Array.isArray(keyMap.notkey) ? keyMap.notkey : []
+      var matchWay = keyMap.matchway == 1 ? 1 : 0
+
+      this.keyInfo.key = keyArr.join(' ')
+      this.keyInfo.notKey = notKeyArr.join(' ')
+      this.keyInfo.matchWay = matchWay
+
+      if (this.keyInfo.notKey) {
+        this.showNotKeyModule = true
+      }
+    },
+    // 筛选关键词分组（传空则取所有关键词平铺到一个数组中）
+    filterKeywordsList: function (filterName) {
+      var list = []
+      // 筛选关键词
+      this.keywordsGroupList.forEach(function (keywordsList) {
+        if (Array.isArray(keywordsList.a_key)) {
+          keywordsList.a_key.forEach(function (keyword) {
+            // 筛选全部(筛选词为空)，需要把关键词所属分类信息记录
+            if (!filterName) {
+              list.push(keyword)
+            } else {
+              if (filterName === keywordsList.s_item) {
+                list.push(keyword)
+              }
+            }
+          })
+        }
+      })
+      // 给新的list添加checked
+      list = JSON.parse(JSON.stringify(list))
+      list.forEach(function (item) {
+        item.checked = false
+        item.calcInfo = this.calcKeyInfo(item)
+      }.bind(this))
+      return list
+    },
+    // 通过分类名获得分类信息
+    getGroupInfo: function (groupName) {
+      if (!groupName) return
+      // 筛选关键词
+      var groupInfo = {}
+      this.keywordsGroupList.some(function (keywordsList, index) {
+        if (groupName === keywordsList.s_item) {
+          groupInfo.name = keywordsList.s_item
+          groupInfo.gIndex = index
+          groupInfo.keyCount = Array.isArray(keywordsList.a_key) ? keywordsList.a_key.length : 0
+          return true
+        }
+      })
+      return groupInfo
+    },
+    getPageKeyInfoFromGroupList: function () {},
+    delThisKey: function () {
+      var _this = this
+      this.showDialog({
+        title: '',
+        message: '确定删除当前关键词？',
+        confirmButtonText: '删除',
+        className: 'j-confirm-dialog text-center'
+      }).then(function () {
+        _this.delThisKeyConfirmed()
+      }).catch(function () {
+        console.log('取消删除关键词')
+      })
+    },
+    delThisKeyConfirmed: function () {
+      var loading = this.showLoading()
+      var _this = this
+      var deleteKey = {
+        [this.pInfo.gIndex]: this.pInfo.kIndex
+      }
+      $.ajax({
+        url: '/subscribepay/afterPay/setUserInfo',
+        type: 'POST',
+        data: {
+          pageType: 'keyWords',
+          actionType: 'DK',
+          delete_key: JSON.stringify(deleteKey)
+        },
+        success: function (res) {
+          loading && loading.clear()
+          if (res.flag) {
+            _this.showToast('删除成功')
+            setTimeout(function () {
+              history.back()
+            }, 1500)
+          } else {
+            _this.showToast(res.msg ? res.msg : '删除失败' )
+          }
+        },
+        error: function () {
+          loading && loading.clear()
+        }
+      })
+    },
+    getGKIndex: function () {
+      var editType = this.pInfo.editType
+      var editIndex = {
+        gIndex: '',
+        kIndex: '',
+        name: '',
+      }
+      if (editType === 'add') {
+        // 获取索引
+        // 1. 判断url中是否传索引，如果传了，就直接用。否则取未分类索引
+        // 2. 如果未分类索引也没取到，则创建未分类
+        if (this.pInfo.gIndex !== null && this.pInfo.gIndex !== undefined && this.pInfo.gIndex !== '') {
+          // url中取到索引，可以直接用
+          editIndex.gIndex = this.pInfo.gIndex
+          editIndex.kIndex = this.keywordsGroupList[this.pInfo.gIndex].a_key.length
+          editIndex.name = this.keywordsGroupList[this.pInfo.gIndex].s_item
+        } else {
+          // 没取到传入的索引，则取未分类的索引
+          var groupInfo = this.getGroupInfo('未分类')
+          if (!groupInfo) {
+            // 没找到未分类，创建未分类，并获取其信息
+            groupInfo = this.createGroupAndGetInfo()
+          }
+          editIndex.gIndex = groupInfo.gIndex
+          editIndex.kIndex = groupInfo.keyCount
+          editIndex.name = groupInfo.name
+        }
+        return editIndex
+      } else if (editType === 'edit') {
+        editIndex.gIndex = this.pInfo.gIndex
+        editIndex.kIndex = this.pInfo.kIndex
+        editIndex.name = this.keywordsGroupList[this.pInfo.gIndex].s_item
+        return editIndex
+      } else {
+        return {}
+      }
+    },
+    // 创建分类
+    createGroup: function () {
+      var _this = this
+      var groupName = '未分类'
+      $.ajax({
+        type: 'POST',
+        url: '/subscribepay/afterPay/setUserInfo',
+        async: false,
+        data: {
+          pageType: 'keyWords',
+          actionType: 'SC',
+          classify_name: groupName
+        },
+        success: function (res) {
+          if (res.flag) {
+            _this.getKeywordsGroupList({
+              needLoading: false,
+              async: false
+            })
+          } else {
+            loading && loading.clear()
+            _this.showToast(res.msg ? res.msg : '新建分类失败' )
+          }
+        },
+        error: function () {
+          loading && loading.clear()
+        }
+      })
+    },
+    createGroupAndGetInfo: function () {
+      // 创建一个未分类
+      this.createGroup()
+      return this.getGroupInfo('未分类')
+    },
+    getNotKeyArr: function () {
+      var notKey = this.keyInfo.notKey.trim()
+      if (!notKey) return []
+      return notKey.split(/\s+/)
+    },
+    saveKeyWord: function () {
+      var _this = this
+      if (!this.keyInfo.key) {
+        return this.showDialog({
+          title: '',
+          message: '关键词不能为空',
+          className: 'j-confirm-dialog text-center',
+          showConfirmButton: true,
+          showCancelButton: false,
+          confirmButtonText: '我知道了'
+        })
+      }
+      
+      // 整理数据
+      //  SK：保存关键词； DK：删除关键词； SC：保存分类
+      var groupInfo = this.getGKIndex()
+      var params = {
+        pageType: 'keyWords',
+        actionType: 'SK',
+        match_way: this.keyInfo.matchWay,
+        kws_name: this.keyInfo.key.trim(),
+        not_kws: this.getNotKeyArr(),
+        kwscount: this.allKeywordsList.length,
+        classify_index: groupInfo.gIndex,
+        classify_name: groupInfo.name,
+        kws_index: groupInfo.kIndex,
+      }
+
+      var loading = this.showLoading()
+
+      $.ajax({
+        url: '/subscribepay/afterPay/setUserInfo',
+        type: 'POST',
+        traditional: true,
+        data: params,
+        success: function (res) {
+          loading && loading.clear()
+          if (res.flag) {
+            _this.showToast('保存成功')
+            setTimeout(function () {
+              // history.back()
+            }, 1500)
+          } else {
+            if (res.msg.indexOf('存在') !== -1) {
+              _this.showDialog({
+                title: '',
+                message: '该组关键词已存在，请勿重复添加',
+                className: 'j-confirm-dialog text-center',
+                showConfirmButton: true,
+                showCancelButton: false,
+                confirmButtonText: '我知道了'
+              })
+            } else {
+              _this.showToast(res.msg ? res.msg : '保存失败')
+            }
+          }
+        },
+        error: function () {
+          loading && loading.clear()
+        }
+      })
+    },
+    // 获取关键词推荐
+    getKeyRecommend: function () {
+      var _this = this
+      var keysArr = []
+      var filterArr = [] // 当前分类key数组
+      // 1. 如果传了gIndex则取gIndex分类中的关键词
+      // 2. 没传gIndex则取【未分类】中的关键词，没有【未分类】，则不发送请求
+      if (this.pInfo.gIndex !== null && this.pInfo.gIndex !== undefined && this.pInfo.gIndex !== '') {
+        // url中取到索引，可以直接用
+        filterArr = this.keywordsGroupList[this.pInfo.gIndex].a_key
+      } else {
+        filterArr = this.filterKeywordsList('未分类')
+      }
+
+      filterArr.forEach(function (item) {
+        if (item.key) {
+          if (item.key instanceof Array) {
+            keysArr.push(item.key.join('+'))
+          } else {
+            keysArr.push(item.key)
+          }
+        }
+      })
+
+      if (keysArr.length === 0) return
+
+      var fetchData = {
+        count: 20,
+        value: utils.unique(keysArr).join(' ')
+      }
+      $.ajax({
+        url: '/member/getRecomKWs',
+        type: 'POST',
+        data: fetchData,
+        success: function (r) {
+          if (r && r instanceof Array && r.length !== 0) {
+            _this.loadKeyRecommend(r)
+          }
+        }
+      })
+    },
+    loadKeyRecommend: function (list) {
+      var afterFilterArr = this.filterKeyRecommend(list)
+      this.recommendTags = afterFilterArr.slice(0, this.conf.recommendTagsCount)
+
+      this.recListState.listAll = afterFilterArr
+      this.recListState.count = afterFilterArr.length
+      this.nextPageRec()
+    },
+    // 过滤后端返回的推荐数组
+    filterKeyRecommend: function (list) {
+      var arr = utils.bSort(list, 'sim')
+      // 排序后
+      var afterSort = arr.reverse()
+      var afterTile = []
+
+      // 已订阅关键词数组
+      var allKeyArr = []
+      var allKeyArrLower = []
+
+      // 已订阅关键词的整理 -----
+      // 将所有关键词整理到一个数组中
+      this.allKeywordsList.forEach(function (item) {
+        if (item.key instanceof Array) {
+          allKeyArr = allKeyArr.concat(item.key)
+        } else {
+          allKeyArr.push(item.key)
+        }
+      })
+      // 数组中英文转小写
+      allKeyArr.forEach(function (item) {
+        allKeyArrLower.push(item.toLowerCase())
+      })
+
+      // 推荐数组整理
+      // 平铺，将数组中的对象去掉，使用字符串平铺内容
+      afterSort.forEach(function (item) {
+        afterTile.push(item.word.toLowerCase())
+      })
+      // 去重1，当前数组中的内容去重，不精确大小写
+      var afterTileLength = afterTile.length
+      for (var i = afterTileLength - 1; i >= 0; i--) {
+        var aIndex = afterTile.indexOf(afterTile[i].toLowerCase())
+        if (aIndex !== i) {
+          afterTile.splice(i, 1)
+        }
+      }
+
+      // 去重2，找到已经订阅过的，进行删除
+      afterTileLength = afterTile.length
+      for (var j = afterTileLength - 1; j >= 0; j--) {
+        var aIndex = allKeyArrLower.indexOf(afterTile[j])
+        if (aIndex !== -1) {
+          afterTile.splice(j, 1)
+        }
+      }
+
+      return afterTile
+    },
+    getRecListTags: function () {
+      var listAll = this.recListState.listAll
+      this.recListState.total = listAll.length
+
+      var startIndex = ((this.recListState.pageNum - 1) * this.recListState.pageSize)
+      var endIndex = (this.recListState.pageNum * this.recListState.pageSize)
+
+      return listAll.slice(startIndex, endIndex)
+    },
+    nextPageRec: function () {
+      if (this.recListState.loading) return
+      this.recListState.loading = true
+      this.recListState.list = this.getRecListTags()
+
+      setTimeout(function () {
+        this.recListState.loading = false
+      }.bind(this), 500)
+
+      // 最后一页，则重置页码
+      if (this.recListState.pageNum * this.recListState.pageSize >= this.recListState.total) {
+        this.recListState.pageNum = 1
+      } else {
+        this.recListState.pageNum++
+      }
+
+      return this.recListState.list
+    },
+    clickTag: function (item) {
+      var key = this.keyInfo.key
+      if (key) {
+        var keyArr = this.keyInfo.key.split(/\s+/)
+        keyArr.push(item)
+        this.keyInfo.key = utils.unique(keyArr).join(' ')
+      } else {
+        this.keyInfo.key = item
+      }
+    }
+  }
+})

src/web/staticres/vipsubscribe/js/keyword-manage.js

@@ -0,0 +1,359 @@
+var vm = new Vue({
+  delimiters: ['${', '}'],
+  el: '#app',
+  data: {
+    batchDeleteState: false, // 是否在批量删除状态
+    userData: {}, // getUserInfo接口用户原始数据
+    groupNameList: [],
+    listState: {
+      loaded: false
+    },
+    // 修改关键词组名称弹窗显示
+    editGroupNameDialog: {
+      show: false,
+      type: '', // 状态：add/edit
+      value: ''
+    },
+  },
+  computed: {
+    listShow: function () {
+      return this.groupNameList.length !== 0 && this.listState.loaded
+    },
+    emptyShow: function () {
+      return this.groupNameList.length === 0 && this.listState.loaded
+    },
+    selectedCount: function () {
+      var selectedArr = this.getSelectArr()
+      return selectedArr.length
+    }
+  },
+  watch: {
+    'editGroupNameDialog.value': {
+      handler: function (newVal, oldVal) {
+        this.$nextTick(function () {
+          $('.group-name-edit .van-dialog__confirm').prop('disabled', !newVal)
+        })
+      }
+    }
+  },
+  created: function () {
+    this.getKeywordsGroupList(true)
+  },
+  mounted: function () {},
+  methods: {
+    showLoading: function () {
+      return this.$toast.loading({
+        duration: 0,
+        forbidClick: true,
+        message: 'loading...',
+      })
+    },
+    showToast: function (message) {
+      return this.$toast({
+        duration: 1500,
+        forbidClick: true,
+        message: message,
+      })
+    },
+    showDialog: function (conf) {
+      var defaultConf = {
+        title: '提示',
+        message: 'message',
+        className: 'j-confirm-dialog',
+        showConfirmButton: true,
+        showCancelButton: true,
+        confirmButtonColor: '#2abed1'
+      }
+      if (conf) {
+        Object.assign(defaultConf, conf)
+      }
+      return this.$dialog.confirm(defaultConf)
+    },
+    getKeywordsGroupList: function (needLoading) {
+      var _this = this
+      if (needLoading) {
+        var loading = this.showLoading()
+      }
+      $.ajax({
+        type: 'POST',
+        url: '/subscribepay/afterPay/getUserInfo?t=' + Date.now(),
+        success: function (res) {
+          if (needLoading) {
+            loading && loading.clear()
+          }
+          if (res && res.userData) {
+            _this.userData = res.userData
+            if (res.userData && res.userData.o_vipjy) {
+              // 整理数据
+              var list = _this.getGroupNameList(res.userData.o_vipjy.a_items)
+              if (Array.isArray(list)) {
+                _this.groupNameList = list
+              }
+            }
+          }
+        },
+        error: function () {
+          if (needLoading) {
+            loading && loading.clear()
+          }
+        },
+        complete: function () {
+          _this.listState.loaded = true
+        }
+      })
+    },
+    getGroupNameList: function (keywordsGroupList) {
+      if (!Array.isArray(keywordsGroupList)) return
+      var groupNameList = []
+      keywordsGroupList.forEach(function (item, index) {
+        var count = Array.isArray(item.a_key) ? item.a_key.length : 0
+        groupNameList.push({
+          name: item.s_item, // 分类名
+          checked: false,
+          deleteDisabled: count > 0, // 该分类是否能被删除
+          count: count // 分类下有多少个关键词
+        })
+      })
+      return groupNameList
+    },
+    // 通过已有分类得到一个未分类名
+    getNewClassName: function () {
+      var conf = {
+        defaultT: '未分类',
+        reg: /^未分类(\d*)$/,
+        // 未分类名称数组
+        unclassified: [],
+        // 未分类名称数字数组
+        unclassifiedNum: [],
+        sortedArr: []
+      }
+
+      this.groupNameList.forEach(function (item) {
+        if (conf.reg.test(item.name)) {
+          var num = item.name.replace(new RegExp(conf.defaultT, 'g'), '')
+          num = parseInt(num)
+          if (isNaN(num)) {
+            num = 0
+          }
+          conf.unclassifiedNum.push(num)
+          conf.unclassified.push(item.name)
+        }
+      })
+
+      // 得到分类名
+      if (conf.unclassifiedNum.length === 0) {
+        return '未分类'
+      } else {
+        conf.sortedArr = conf.unclassifiedNum.sort(function (a, b) {
+          return b - a
+        })
+
+        return conf.defaultT + (conf.sortedArr[0] + 1)
+      }
+    },
+    getSelectArr: function () {
+      var selectedArr = []
+      this.groupNameList.forEach(function (item) {
+        if (!item.deleteDisabled && item.checked) {
+          selectedArr.push(item)
+        }
+      })
+      return selectedArr
+    },
+    getSelectIndexArr: function () {
+      var selectedIndexArr = []
+      this.groupNameList.forEach(function (item, index) {
+        if (!item.deleteDisabled && item.checked) {
+          selectedIndexArr.push(index)
+        }
+      })
+      return selectedIndexArr
+    },
+    batchDeleteStateChange: function () {
+      this.batchDeleteState = !this.batchDeleteState
+    },
+    batchDelete: function () {
+      var _this = this
+      if (this.selectedCount <= 0) return
+      this.showDialog({
+        title: '',
+        message: '确定删除所选关键词分类吗？',
+        className: 'j-confirm-dialog text-center',
+      }).then(function () {
+        console.log('确认批量删除分类')
+        _this.batchDeleteConfirmed()
+      })
+      .catch(function() {
+        console.log('取消批量删除分类')
+      })
+    },
+    batchDeleteConfirmed: function () {
+      var selectedIndexArr = this.getSelectIndexArr()
+      var loading = this.showLoading()
+      var _this = this
+      $.ajax({
+        url: '/subscribepay/afterPay/setUserInfo',
+        type: 'POST',
+        data: {
+          pageType: 'keyWords',
+          actionType: 'DC',
+          classify_index: selectedIndexArr.join(',')
+        },
+        success: function (res) {
+          loading && loading.clear()
+          if (res.flag) {
+            _this.showToast('删除成功')
+            _this.getKeywordsGroupList()
+            _this.batchDeleteState = false
+          } else {
+            _this.showToast(res.msg ? res.msg : '删除失败' )
+          }
+        },
+        error: function () {
+          loading && loading.clear()
+        }
+      })
+    },
+    clickKeyCard: function (item, index) {
+      if (this.batchDeleteState) {
+        // 执行点击选中逻辑
+        // 如果关键词组下有关键词，则不能点击
+        if (!item.deleteDisabled) {
+          item.checked = !item.checked
+        }
+      } else {
+        // 显示修改关键词组名弹框
+        this.editGroupName('edit', item, index)
+      }
+    },
+    beforeKeySwipeCellClose: function (e) {
+      // position 为关闭时点击的位置
+      // instance 为对应的 SwipeCell 实例
+      var position = e.position
+      var instance = e.instance
+      var index = e.name
+
+      switch (position) {
+        case 'left': {
+          break
+        }
+        case 'cell': {
+          instance.close()
+          break
+        }
+        case 'outside': {
+          instance.close()
+          break
+        }
+        case 'right': {
+          this.delThisKey(index, instance)
+          break
+        }
+        default: {
+          break
+        }
+      }
+    },
+    /**
+     * 删除单个分类
+     * @param {number} index 当前关键词在当前分组的index
+     * @param {Object} instance SwipeCell的实例
+     */
+    delThisKey: function (index, instance) {
+      var _this = this
+      // 需要找到当前分类的item
+      var group = this.groupNameList[index]
+      this.showDialog({
+        title: '',
+        message: '确定删除当前分类？',
+        confirmButtonText: '删除',
+        className: 'j-confirm-dialog text-center'
+      }).then(function () {
+        // 点击确定，将当前关键词在批量选选择中，选中
+        group.checked = true
+        _this.batchDeleteConfirmed()
+        console.log('确定删除分类')
+      }).catch(function () {
+        console.log('取消删除分类')
+      })
+    },
+    getAllGroupName: function () {
+      var arr = []
+      this.groupNameList.forEach(function (item) {
+        if (item.name) {
+          arr.push(item.name)
+        }
+      })
+      return arr
+    },
+    addGroup: function () {
+      this.editGroupName('add')
+    },
+    // 编辑或者添加分类名
+    editGroupName: function (editType, item, index) {
+      this.editGroupNameDialog.type = editType
+      this.editGroupNameDialog.show = true
+      if (editType === 'edit') {
+        this.editGroupNameDialog.value = item.name
+        this.editGroupNameDialog.gIndex = index
+      } else if (editType === 'add') {
+        this.editGroupNameDialog.value = ''
+      }
+      this.$nextTick(function () {
+        $('.group-name-edit .van-dialog__confirm').prop('disabled', !this.editGroupNameDialog.value)
+      })
+    },
+    confirmEditGroupName: function () {
+      // 关键词分类名判重
+      var classNameArr = this.getAllGroupName()
+      if (classNameArr.indexOf(this.editGroupNameDialog.value) === -1) {
+        // 分类名不重复，新建分类
+        this.saveGroupEdit(this.editGroupNameDialog.type)
+      } else {
+        this.showToast('分类名不能重复')
+      }
+    },
+    saveGroupEdit: function (type) {
+      var _this = this
+      var data = {}
+      var toastType = ''
+      if (type === 'add') {
+        toastType = '新建'
+        data = {
+          pageType: 'keyWords',
+          actionType: 'SC',
+          classify_name: this.editGroupNameDialog.value
+        }
+      } else if (type === 'edit') {
+        toastType = '修改'
+        data = {
+          pageType: 'keyWords',
+          actionType: 'SC',
+          classify_index: this.editGroupNameDialog.gIndex,
+          classify_name: this.editGroupNameDialog.value
+        }
+      } else {
+        return
+      }
+      var loading = this.showLoading()
+      $.ajax({
+        type: 'POST',
+        url: '/subscribepay/afterPay/setUserInfo',
+        data: data,
+        success: function (res) {
+          loading && loading.clear()
+          if (res.flag) {
+            _this.showToast(toastType + '分类成功')
+            _this.getKeywordsGroupList()
+            _this.batchDeleteState = false
+          } else {
+            _this.showToast(res.msg ? res.msg : toastType + '失败')
+          }
+        },
+        error: function () {
+          loading && loading.clear()
+        }
+      })
+    }
+  }
+})

src/web/staticres/vipsubscribe/js/newKeyWord.js

@@ -1,643 +0,0 @@
-"use strict";
-
-var PageData = {
-    a_items: [],
-    data: null,
-    keysArr: [],
-    classArr: [],
-    classIndex: 0,
-    keyIndex: 0
-};
-
-function wToast(text) {
-    return weui.toast(text, {
-        duration: 2000,
-        className: 'custom-toast'
-    });
-} // 获取数据
-
-
-function getPageData() {
-    var loading = weui.loading();
-    $.post("/subscribepay/afterPay/getUserInfo", {}, function (_ref) {
-        var userData = _ref.userData;
-        PageData.data = userData;
-
-        if (userData) {
-            if (userData.o_vipjy && userData.o_vipjy.a_items && userData.o_vipjy.a_items.length) {
-                var a_items = userData.o_vipjy.a_items;
-                PageData.a_items = a_items;
-                drawDom(PageData.a_items);
-            } else {
-                if (history.state && history.state.className) {
-                    checkPageStatus()
-                } else {
-                    $(".addClassify").click();
-                }
-            }
-
-            loading.hide();
-        } else {
-            loading.hide();
-        }
-    });
-} // 保存数据
-
-
-function setPageData(actionType) {
-    var loading = weui.loading();
-    var ClassData = PageData.a_items[PageData.classIndex];
-    var ajaxResult = null;
-    var param = {};
-    param.pageType = "keyWords";
-    param.classify_index = PageData.classIndex;
-    param.classify_name = ClassData.s_item;
-    param.kws_index = PageData.keyIndex;
-    param.kws_name = ClassData.a_key.length ? ClassData.a_key[PageData.keyIndex].key.join(' ') : null;
-    param.actionType = actionType;
-    param.addition_kws = ClassData.a_key.length ? ClassData.a_key[PageData.keyIndex].appendkey : null;
-    param.not_kws = ClassData.a_key.length ? ClassData.a_key[PageData.keyIndex].notkey : null;
-    param.kwscount = ClassData.keys.length;
-    $.ajax({
-        type: "POST",
-        url: "/subscribepay/afterPay/setUserInfo",
-        data: param,
-        dataType: "json",
-        async: false,
-        traditional: true,
-        success: function success(r) {
-            ajaxResult = r;
-
-            if (r.flag) {
-                console.log("保存成功");
-
-                try {
-                    JyObj.checkLab(); //刷新搜索首页和订阅首页
-
-                    sessionStorage.reloadHomePage = true;
-                    sessionStorage.reloadSubPage = true;
-                    setTimeout(function () {
-                        //ios 从我的菜单进入 保存关键词 底部导航会显示
-                        JyObj.hiddenBottom("0");
-                    }, 300);
-                } catch (e) {}
-            }
-        }
-    });
-
-    if (actionType === 'DK' && ajaxResult.flag) {
-        ClassData.a_key.splice(param.kws_index, 1);
-        ClassData.keys.splice(param.kws_index, 1);
-        PageData.keysArr.splice(PageData.keysArr.indexOf(param.kws_name), 1);
-        drawKwsCount(PageData.keysArr.length);
-
-        if (ClassData.keys.length === 0) {
-            $(".enter.addkeyWord").show();
-            $(".classify-item[data-c='" + PageData.classIndex + "']").remove();
-            var nowI = PageData.classArr.indexOf(PageData.a_items[PageData.classIndex].s_item)
-            PageData.classArr.splice(nowI, 1);
-            PageData.classIndex = PageData.classArr.length
-            var nowArr = PageData.a_items.splice(nowI, 1)[0];
-            PageData.a_items.push(nowArr)
-            PageData.classArr.push(nowArr.s_item)
-            $(".add-keyword-container .addNewKeyword .jy-icon-add-box").hide();
-        } else {
-            upDrawClassPage();
-        }
-        drawDom(PageData.a_items)
-    }
-
-    loading.hide();
-    return ajaxResult.flag;
-} // 处理页面切换
-
-
-function checkPageStatus() {
-    sessionStorage.removeItem('sub_vip_state')
-    if (history.state && history.state.className.toString()) {
-        var nowClassIndex = PageData.classArr.indexOf(history.state.className)
-        if (nowClassIndex === -1) {
-            PageData.a_items.push({
-                a_key: [],
-                keys: [],
-                s_item: history.state.className,
-                tip: true
-            })
-            nowClassIndex = PageData.a_items.length - 1
-        }
-        PageData.classIndex = nowClassIndex
-        PageData.a_items[nowClassIndex].tip = true
-        toggleSection(false);
-    } else {
-        if (!PageData.a_items.length || !PageData.classArr.length) {
-            return history.go(-1)
-        }
-        var tempAItems = PageData.a_items.filter(function (v) {
-            return v.keys.length;
-        });
-
-        if (tempAItems.length !== PageData.a_items.length) {
-            PageData.a_items = tempAItems;
-            drawDom(PageData.a_items);
-        }
-
-        toggleSection(true);
-    }
-} // 切换
-
-
-function toggleSection(type) {
-    var tempDomList = $(".keyWord .all-classify-column");
-    var tempDomKey = $(".keyWord .add-keyword-container");
-
-    if (type) {
-        $(".classify-edit-pop").hide();
-        tempDomList.show();
-        tempDomKey.hide();
-        document.title = '关键词分类';
-    } else {
-        tempDomKey.show();
-        tempDomList.hide();
-        upDrawClassPage();
-        document.title = '关键词';
-    }
-
-    $(".app-layout-header span:eq(1)").text(document.title);
-} //保存缓存
-
-
-function setSesstion() {
-    sessionStorage.classify_name = PageData.a_items[PageData.classIndex].s_item; //当前分类
-
-    sessionStorage.kws_index = PageData.keyIndex; //当前关键词索引
-
-    sessionStorage.classify_index = PageData.classIndex; //当前分类索引
-
-    sessionStorage.a_items = JSON.stringify(PageData.a_items); //当前数据
-
-    sessionStorage.kws_arr = JSON.stringify(PageData.keysArr); //当前所有关键词排
-
-    sessionStorage.kws_count = PageData.keysArr.length; //关键词个数
-} // 编辑删除
-
-
-function deleteKey(th) {
-    var jQueryDOM = $(th).parents('li.delete-box');
-    var liIndex = Number(jQueryDOM.index());
-    PageData.keyIndex = jQueryDOM.attr('data-k');
-    var deleteStaus = false
-    weui.confirm('删除后将无法恢复，确定删除？', {
-        title: '删除关键词',
-        isAndroid: false,
-        buttons: [{
-            label: '取消',
-            type: 'default',
-            onClick: function onClick() {
-                deleteSwiper.length ? deleteSwiper[liIndex].slideTo(0) : deleteSwiper.slideTo(0);
-            }
-        }, {
-            label: '确定',
-            type: 'primary',
-            onClick: function onClick() {
-                if (deleteStaus) {
-                    return
-                }
-                weui.loading()
-                if (setPageData('DK')) {
-                    jQueryDOM.remove();
-                } else {
-                    wToast('无法删除或已被删除');
-                }
-                deleteStaus = true
-            }
-        }]
-    });
-}
-/* swiper */
-
-
-function initSwiper() {
-    console.log('swiper');
-
-    if (window.deleteSwiper) {
-        if (window.deleteSwiper.length) {
-            window.deleteSwiper.forEach(function (e) {
-                try {
-                    e.destroy();
-                } catch (err) {
-                    e = null;
-                }
-            });
-        } else {
-            try {
-                window.deleteSwiper.destroy();
-            } catch (e) {
-                window.deleteSwiper = null;
-            }
-        }
-
-        window.deleteSwiper = null;
-    }
-
-    window.deleteSwiper = new Swiper('.delete-box', {
-        slidesPerView: 'auto',
-        initialSlide: 0,
-        resistanceRatio: 0,
-        slideToClickedSlide: true,
-        on: {
-            init: function init() {
-                var aEl = $(this.$wrapperEl).find(".one");
-                var bEl = $(this.$wrapperEl).find(".delete-button");
-                var aH = aEl[0] && aEl[0].offsetHeight;
-                aH && $(bEl).height(aH);
-            },
-            tap: function tap(event) {
-                var canDelete = event.target.className.indexOf('delete-button') !== -1;
-                var cI = $(this.$el).attr('data-c');
-                var kI = $(this.$el).attr('data-k');
-                PageData.keyIndex = kI;
-
-                if (!canDelete) {
-                    console.log(cI, kI);
-                    setSesstion();
-                    window.location.href = '/front/vipsubscribe/toSetaddKeyPage';
-                }
-            },
-            touchStart: function touchStart(event) {
-                var nowIndex = $(this.$wrapperEl).parents('li').index('.showKeyWord ul li');
-
-                if (deleteSwiper.length) {
-                    deleteSwiper.forEach(function (e, i) {
-                        var canDelete = e.getTranslate() !== 0;
-
-                        if (canDelete && i !== nowIndex) {
-                            e.slideTo(0);
-                        }
-                    });
-                }
-            }
-        }
-    });
-} // 渲染
-
-
-function drawKeyDom(index, data) {
-    console.log(index, data);
-    var keyStr = data.key.join(' ');
-    var appendkeyStr = data.appendkey ? data.appendkey.join('、') : '';
-    var notkeyStr = data.notkey ? data.notkey.join('、') : '';
-    var tempDom = $(".delete-box[data-c='" + PageData.classIndex + "'][data-k='" + index + "']"); // 待优化
-
-    if (false && tempDom.hasClass('delete-box')) {
-        // 更新
-        tempDom.find('p.key').text(keyStr);
-        var tempA = tempDom.find('p.addition').text(appendkeyStr).parent();
-        appendkeyStr.length ? tempA.show() : tempA.hide();
-        var tempB = tempDom.find('p.notkey').text(notkeyStr).parent();
-        notkeyStr.length ? tempB.show() : tempB.hide();
-    } else {
-        // 新增
-        var tempHTML = "\n        <li class=\"delete-box swiper-container\" data-c=\"" + PageData.classIndex + "\" data-k=\"" + index + "\">\n            <div class=\"swiper-wrapper\">\n                <div class=\"one swiper-slide\">\n                    <div>\n                        <span>\n                            <p class=\"key\">" + keyStr + "</p>\n                            <span class=\"iconfont icon-arrow\"></span>\n                        </span>\n                        <span class=\"line-top-border\" " + (appendkeyStr.length ? '' : 'style="display: none"') + ">\n                            <strong> <span class=\"keyWord-tags\">\u9644\u52A0\u8BCD</span></strong>\n                            <p class=\"addition\">" + appendkeyStr + "</p>\n                        </span>\n                        <span class=\"line-top-border\" " + (notkeyStr.length ? '' : 'style="display: none"') + ">\n                            <strong> <span class=\"keyWord-tags exclude\">\u6392\u9664\u8BCD</span></strong>\n                            <p class=\"notkey\">" + notkeyStr + "</p>\n                        </span>\n                    </div>\n                </div>\n                <div class=\"swiper-slide delete-button\" onclick=\"deleteKey(this)\" style=\"height: 128px;\">\u5220\u9664</div>\n            </div>\n        </li>\n        ";
-        $('.showKeyWord ul').append(tempHTML);
-    }
-} //强制弹出 提示信息
-
-
-function showMeg() {
-    // 如果是苹果手机，打开时候要设置top
-    var agent = navigator.userAgent.toLowerCase();
-    var dialog = $('.classify-show-pop .weui-dialog');
-
-    if (/iphone|ipod|ipad|ios/.test(agent)) {
-        dialog.css({
-            'top': '30%'
-        });
-    } else {
-        dialog.css({
-            'top': '50%'
-        });
-    }
-
-    $('.classify-show-pop').show();
-}
-
-function upDrawClassPage() {
-    var ClassPageData = PageData.a_items[PageData.classIndex];
-    $(".classify .classify-detail").text(ClassPageData.s_item);
-    $(".delete-box:not([data-c='" + PageData.classIndex + "'])").remove();
-    $('.showKeyWord ul').html('');
-    if (sessionStorage.fastimport != 1 && PageData.data && PageData.data.i_vip_fastimport == 0  && PageData.data.ordinarykc > 0) {
-        $(".classify-fast").show();
-    } else {
-        $(".classify-fast").hide();
-    }
-
-    if (ClassPageData.a_key && ClassPageData.a_key.length) {
-        // 旧有模式
-        // 判断是否需要提示分类
-        if (ClassPageData.i_tips !== 1 && !ClassPageData.tip) {
-            if (ClassPageData.s_item.indexOf('未分类') !== -1) {
-                showMeg();
-            }
-            var param = {};
-            param.classify_index = PageData.classIndex;
-            param.kws_tips = 1;
-            $.post("/subscribepay/afterPay/updateUserTips", param, function (r) {
-                if (r.flag) {
-                    ClassPageData.i_tips = 1;
-                }
-            });
-        }
-
-        $(".enter.addkeyWord").hide();
-        $(".add-keyword-container .addNewKeyword .jy-icon-add-box").show();
-        ClassPageData.a_key.forEach(function (v, i) {
-            drawKeyDom(i, v);
-        });
-        initSwiper();
-    } else {
-        // 新增模式
-        if (!ClassPageData.tip) {
-            modalOne();
-        }
-        $(".enter.addkeyWord").show();
-        $(".add-keyword-container .addNewKeyword .jy-icon-add-box").hide();
-    }
-}
-
-function drawKwsCount(count) {
-    $(".kws_count").text(count);
-}
-
-function drawDom(a_items) {
-    var allHTML = '';
-    var keysArr = [];
-    var classArr = [];
-    a_items.forEach(function (data, i) {
-        data.keys = data.a_key.map(function (v) {
-            return v.key.join(' ');
-        });
-        keysArr = keysArr.concat(data.keys);
-        classArr.push(data.s_item);
-        var tempHTML = "\n            <li class=\"classify-item\" data-c=\"" + i + "\">\n                <div>\n                    <span class=\"classify-item-l\">" + data.s_item + "</span>\n                    <span class=\"classify-item-r\">\n                        <span class=\"classify-item-detail\">" + data.keys.length + "\u4E2A\u5173\u952E\u8BCD</span>\n                        <span class=\"iconfont icon-arrow\"></span>\n                    </span>\n                </div>\n                <div class=\"classifyKeysShow\">" + data.keys.join('、') + "</div>\n            </li>";
-        allHTML += tempHTML;
-    });
-    PageData.keysArr = keysArr;
-    PageData.classArr = classArr;
-    drawKwsCount(PageData.keysArr.length);
-    $(".keyWord .all-classify-column ul.classify-list").html(allHTML);
-    checkPageStatus();
-    return allHTML;
-} //
-
-
-function modalOne() {
-    // 如果是苹果手机，打开时候要设置top
-    var agent = navigator.userAgent.toLowerCase();
-    var dialog = $('.classify-edit-pop .weui-dialog');
-
-    if (/iphone|ipod|ipad|ios/.test(agent)) {
-        dialog.css({
-            'top': '30%'
-        });
-    } else {
-        dialog.css({
-            'top': '50%'
-        });
-    }
-
-    $('.classify-edit-pop').show();
-    var currentClassifyName = $(".classify").find('.classify-detail').text();
-
-    if (currentClassifyName.indexOf("未分类") > -1) {
-        currentClassifyName = "";
-    }
-
-    $('input.classify-keyword').val(currentClassifyName).focus();
-} //
-
-
-function modalTwo() {
-    $(".fastICName").text($(".classify-detail").text()); // 如果是苹果手机，打开时候要设置top
-
-    var agent = navigator.userAgent.toLowerCase();
-    var dialog = $('.classify-fast-pop .weui-dialog');
-
-    if (/iphone|ipod|ipad|ios/.test(agent)) {
-        dialog.css({
-            'top': '40%'
-        });
-    } else {
-        dialog.css({
-            'top': '50%'
-        });
-    }
-
-    $('.classify-fast-pop').show();
-} // 显示关键词分类弹框
-
-
-$('.classify-r').on('click', function () {
-    modalOne();
-}); // 显示快速导入弹框
-
-$('.classify-fast').on('click', 'i', function () {
-    sessionStorage.fastimport = 1;
-    $('.classify-fast').hide();
-});
-$('.classify-fast').on('click', 'a', function () {
-    modalTwo();
-});
-$('.classify-edit-pop .classify-keyword').bind('input propertychange', function () {
-    var s = $('input.classify-keyword').val(); // 去空格
-
-    s = s.trim().slice(0, 20);
-
-    if (s.length === 0) {
-        $('.weui-dialog__ft .dialog__btn_confirm').addClass("opacity6");
-        return;
-    }
-
-    $('.weui-dialog__ft .dialog__btn_confirm').removeClass("opacity6");
-}); // 关键词分类 - 确定按钮点击事件
-
-$('.classify-edit-pop .dialog__btn_confirm').on('click', function () {
-    var classify_name = $.trim($('input.classify-keyword').val()); // 去空格
-
-    classify_name = classify_name.trim();
-
-    if (classify_name.length === 0) {
-        return;
-    } //分类名称是否已存在
-
-
-    if (PageData.classArr.indexOf(classify_name) !== -1) {
-        return wToast('此分类名称已存在');
-    }
-
-    if (classify_name.length > 20) {
-        return wToast('分类名称最大长度为20个字符');
-    }
-
-    $(this).removeClass("opacity6"); // 关闭弹框后要重置input内容
-
-    $('.classify-edit-pop').hide();
-    $('input.classify-keyword').val('');
-    PageData.keyIndex = 0;
-    var tempName = PageData.a_items[PageData.classIndex].s_item;
-    PageData.a_items[PageData.classIndex].s_item = classify_name; // 新增分类时不提交
-
-    if (PageData.classArr.length === PageData.classIndex || !PageData.a_items[PageData.classIndex].a_key.length) {
-        $(".classify-item[data-c='" + PageData.classIndex + "'] .classify-item-l").text(classify_name);
-        $('.classify-r .classify-detail').text(classify_name);
-        PageData.classArr.splice(PageData.classArr.indexOf(tempName), 1, classify_name);
-        history.replaceState({
-            classIndex: PageData.classIndex,
-            className: classify_name
-        }, "classPage", location.pathname);
-        return;
-    }
-
-    if (setPageData('SC')) {
-        $(".classify-item[data-c='" + PageData.classIndex + "'] .classify-item-l").text(classify_name);
-        $('.classify-r .classify-detail').text(classify_name);
-        PageData.classArr.splice(PageData.classArr.indexOf(tempName), 1, classify_name);
-        history.replaceState({
-            classIndex: PageData.classIndex,
-            className: classify_name
-        }, "classPage", location.pathname);
-        wToast('关键词分类添加成功');
-    } else {
-        PageData.a_items[PageData.classIndex].s_item = tempName;
-    }
-}); // 关键词分类 - 取消按钮点击事件
-
-$('.classify-edit-pop .dialog__btn_cancel').unbind('click').on('click', function () {
-    setTimeout(function () {
-        $('.classify-edit-pop').hide();
-        $('input.classify-keyword').val('');
-    }, 300);
-    return true;
-});
-
-var missingNumber = function missingNumber(nums) {
-    nums = nums.sort(function (a, b) {
-        return a - b;
-    });
-
-    for (var i = 0, n; i < nums.length; i++) {
-        if (nums[i] + 1 != nums[i + 1]) {
-            n = nums[i] + 1;
-            break;
-        }
-    }
-
-    return nums[0] != 0 ? 0 : n;
-};
-
-function getMaxClassName() {
-    var defalutT = '未分类';
-    var tempArr = PageData.classArr.filter(function (v) {
-        return /^未分类(\d+)$/.test(v) || v === defalutT;
-    }).map(function (v) {
-        return +v.replace(defalutT, '') + 0;
-    });
-
-    if (tempArr.length) {
-        return defalutT + (missingNumber(tempArr) > 0 ? missingNumber(tempArr) : '');
-    }
-
-    return defalutT;
-} // 添加关键词
-
-
-function addNewKeys() {
-    if (PageData.keysArr.length >= 300) {
-        return wToast('最多添加300组关键词');
-    }
-
-    PageData.keyIndex = PageData.a_items[PageData.classIndex].keys.length;
-    setSesstion();
-    window.location.href = '/front/vipsubscribe/toSetaddKeyPage';
-}
-
-$(function () {
-    getPageData();
-    $(window).off('popstate', checkPageStatus);
-    $(window).on('popstate', checkPageStatus); // 新增分类
-
-    $(".addClassify").on('click', function () {
-        PageData.classIndex = PageData.classArr.length;
-        PageData.a_items[PageData.classIndex] = {
-            a_key: [],
-            keys: [],
-            s_item: getMaxClassName()
-        };
-        toggleSection(false);
-        history.pushState({
-            classIndex: PageData.classIndex,
-            className: getMaxClassName()
-        }, "classPage", location.pathname);
-    }); // 提示分类弹窗
-
-    $('.classify-show-pop .dialog__btn_confirm').on('click', function () {
-        $('.classify-show-pop').hide();
-        modalOne();
-    });
-    $('.classify-show-pop .dialog__btn_cancel').on('click', function () {
-        $('.classify-show-pop').hide();
-    }); // 快速导入
-    // 关键词分类 - 去设置按钮点击事件
-
-    $('.classify-fast-pop .dialog__btn_confirm').on('click', function () {
-        var loading = weui.loading();
-        $.ajax({
-            type: "POST",
-            url: "/subscribepay/afterPay/fastImport",
-            data: {
-                c_index: PageData.classIndex,
-                k_index: PageData.keysArr.length,
-                c_name: $(".classify-detail").text()
-            },
-            dataType: "json",
-            async: false,
-            traditional: true,
-            success: function success(r) {
-                $('.classify-fast-pop').hide();
-
-                if (r.flagInt == 1) {
-                    $(".classify-fast").hide();
-                    wToast('成功导入' + r.kwMap.length + '个关键词');
-                    getPageData();
-                } else {
-                    wToast('导入失败');
-                }
-
-                try {
-                    JyObj.checkLab(); //刷新搜索首页和订阅首页
-
-                    sessionStorage.reloadHomePage = true;
-                    sessionStorage.reloadSubPage = true;
-                } catch (e) {}
-            }
-        });
-        loading.hide();
-    }); // 关键词分类 - 取消按钮点击事件
-
-    $('.classify-fast-pop .dialog__btn_cancel').on('click', function () {
-        $('.classify-fast-pop').hide();
-    }); // 新增关键词
-
-    $(".addButton").on('click', addNewKeys);
-    $(".addNewKeyword .jy-icon-add-box").on('click', addNewKeys); // 分类点击事件
-
-    $(".keyWord .all-classify-column ul.classify-list").on('click', 'li', function (e) {
-        var index = $(this).index();
-        PageData.classIndex = index;
-        toggleSection(false);
-        history.pushState({
-            classIndex: PageData.classIndex,
-            className: PageData.a_items[PageData.classIndex].s_item
-        }, "classPage", location.pathname);
-    });
-});

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

@@ -1,101 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport"
-          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
-    <meta http-equiv="X-UA-Compatible" content="ie=edge">
-    <meta name="viewport"
-          content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,viewport-fit=cover" />
-    <meta name="apple-mobile-web-app-capable" content="yes">
-    <meta name="apple-mobile-web-app-status-bar-style" content="black">
-    <title>关键词</title>
-    <script src='{{Msg "seo" "cdn"}}/vipsubscribe/js/rem.js?v={{Msg "seo" "version"}}'></script>
-    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}'>
-    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}'>
-    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/weui.min.css?v={{Msg "seo" "version"}}'>
-    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/addKeyWord.css?v={{Msg "seo" "version"}}'>
-    <style>
-        .addImg {
-            background-image: url('{{Msg "seo" "cdn"}}/vipsubscribe/image/delete.png?v={{Msg "seo" "version"}}');
-        }
-    </style>
-</head>
-
-<body>
-<div class="app-layout-content-b add-key-word">
-    <div class="sticky-box" style="top: 0">
-        <div class="input-box">
-            <span>关键词</span>
-            <input id="keyStr" type="text" placeholder="请输入关键词">
-        </div>
-        <div class="select-input">
-            <div class="input-box">
-                <span>附加词</span>
-                <input type="text" placeholder="请输入附加词">
-                <a href="javascript:;" disabled="true" class="weui-dialog__btn jy__btn_primary disabled">添加</a>
-            </div>
-            <div class="input-box right-box">
-                <span>排除词</span>
-                <input type="text" placeholder="请输入排除词">
-                <a href="javascript:;" disabled="true" class="weui-dialog__btn jy__btn_primary disabled">添加</a>
-            </div>
-            <div class="fixed-tip-button">
-                <div class="add-box" onclick="addInput(true)">
-                    <span class="jy-icon-add"></span>
-                    <span>添加附加词</span>
-                </div>
-                <div class="add-box" onclick="addInput(false)">
-                    <span class="jy-icon-add"></span>
-                    <span>添加排除词</span>
-                </div>
-            </div>
-        </div>
-    </div>
-    <div class="content-box">
-        <div class="q-tip">
-            <div class="call-dialog" onclick="openDialog('help')">
-                <i class="iconfont icon-wenhao"></i>&nbsp;疑问解答
-            </div>
-        </div>
-        <div class="input-group" id="include"></div>
-        <div class="input-group" id="exclude"></div>
-    </div>
-    <!--submit-->
-    <div class="fixed-bottom safe-area-inset-bottom">
-        <a href="javascript:;" onclick="deleteKeys()" style="display: none" class="weui-dialog__btn jy__btn_delete">删除 </a>
-        <a href="javascript:;" disabled="true" class="weui-dialog__btn jy__btn_primary submitButton disabled">确认</a>
-    </div>
-    <!--dialog-->
-    <div class="problemPop dialog-container" data-dialog="help" onclick="openDialog('help')" style="display: none;">
-        <div class="problemPopContent" onclick="event.stopPropagation()">
-            <h3>疑问解答</h3>
-            <ul>
-                <li>
-                    <p>例：某公司主营业务为软件系统开发</p>
-                </li>
-                <li>
-                    <h4>关键词:</h4>
-                    <p>目标信息中的关键性词语，如“软件系统”</p>
-                </li>
-                <li>
-                    <h4>附加词:</h4>
-                    <p>与关键词形成一体/组合，便于查找准确信息，如“开发”</p>
-                </li>
-                <li>
-                    <h4>排除词:</h4>
-                    <p>与关键词互斥，可排除一部分非目标信息，如“运维”</p>
-                </li>
-            </ul>
-            <a href="javascript:;" class="weui-dialog__btn knowBtn" onclick="openDialog('help', event)">我知道了</a>
-        </div>
-    </div>
-</div>
-<script src='https://cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js'></script>
-<script src='{{Msg "seo" "cdn"}}/vipsubscribe/js/weui.min.js?v={{Msg "seo" "version"}}'></script>
-{{include "/common/weixin.html"}}
-<script src='{{Msg "seo" "cdn"}}/vipsubscribe/js/addKeyWord.js?v={{Msg "seo" "version"}}'></script>
-{{include "/common/baiducc.html"}}
-</body>
-</html>

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

@@ -1,164 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport"
-        content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
-    <meta http-equiv="X-UA-Compatible" content="ie=edge">
-    <title>附加词</title>
-    <script src="{{Msg "seo" "cdn"}}/vipsubscribe/js/rem.js?v={{Msg "seo" "version"}}"></script>
-    <link rel="stylesheet" href="{{Msg "seo" "cdn"}}/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}">
-    <link rel="stylesheet" href="{{Msg "seo" "cdn"}}/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}">
-    <link rel="stylesheet" href="{{Msg "seo" "cdn"}}/vipsubscribe/css/weui.min.css?v={{Msg "seo" "version"}}">
-    <link rel="stylesheet" href="{{Msg "seo" "cdn"}}/vipsubscribe/css/addition_exclusive_word.css?v={{Msg "seo" "version"}}">
-</head>
-
-<body>
-
-    <div class="addition-word">
-        <section class="content">
-            <p class="title">示例：开发（附加词）</p>
-            <!-- 添加附加词 -->
-            <div class="enter addkeyWord" style="display: none;">
-                <input type="text" class="enterOne" maxlength="20" placeholder="请输入附加词" />
-                <div class="btn">
-                    <button onclick="Cancel()" style="width:49%;background:#fff;color:#2cb7ca;opacity: 1;">取消</button>
-                    <button disabled>确认</button>
-                </div>
-            </div>
-
-            <!-- 添加附加词显示列表 -->
-            <div class="showKeyWord" style="display: none;">
-                <ul>
-
-                </ul>
-            </div>
-            <div class="problem">
-                疑问解答 <i class="iconfont icon-wenhao"></i>
-            </div>
-        </section>
-        <div class="addKeyWord" style="display:none;">
-            <i class="iconfont icon-tianjia"></i>
-        </div>
-        <!-- 疑难问题弹窗 -->
-        <div class="problemPop">
-            <div class="problemPopContent">
-                <h3>疑问解答</h3>
-                <ul>
-                    <li>
-                        <p>例：某公司主营业务为软件系统开发</p>
-                    </li>
-                    <li>
-                        <h4>关键词:</h4>
-                        <p>目标信息中的关键性词语，如“软件系统”</p>
-                    </li>
-                    <li>
-                        <h4>附加词:</h4>
-                        <p>与关键词形成一体/组合，便于查找准确信息，如“开发”</p>
-                    </li>
-                    <li>
-                        <h4>排除词:</h4>
-                        <p>与关键词互斥，可排除一部分非目标信息，如“运维”</p>
-                    </li>
-                </ul>
-                <button class="knowBtn">我知道了</button>
-            </div>
-        </div>
-    </div>
-    <script src="https://cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js"></script>
-    <script src="{{Msg "seo" "cdn"}}/vipsubscribe/js/weui.min.js?v={{Msg "seo" "version"}}"></script>
-    <script src="{{Msg "seo" "cdn"}}/vipsubscribe/js/additionWord.js?v={{Msg "seo" "version"}}"></script>
-	{{include "/common/weixin.html"}}
-	<script src="{{Msg "seo" "cdn"}}/wxswordfish/share.js?v={{Msg "seo" "version"}}"></script>
-    <script>
-		initShare({{.T.signature}},{{.T.openid}},2,"jy_extend",{{.T.nickname}},{{.T.avatar}});
-        var addition_kws = []//附加词
-        var _addkws = "";
-        var _addindex = -1;
-		var addkws_arr = {}
-        $(function() {
-			(/iphone|ipod|ipad/i.test(navigator.appVersion)) && document.addEventListener('blur', function(e) {
-				// 这里加了个类型判断，因为a等元素也会触发blur事件
-				['input', 'textarea'].includes(e.target.localName) && document.body.scrollIntoView(true)
-			}, true)
-            if(sessionStorage&&sessionStorage.addition_kws!=undefined){
-                addition_kws = JSON.parse(sessionStorage.addition_kws);
-                appendHtml(addition_kws);
-            }else{
-                $(".enter.addkeyWord").show();
-                $(".showKeyWord").hide();
-            }
-        })
-		//
-		function Cancel(){
-			if($(".showKeyWord li").length==0){
-				window.history.go(-1)
-			}else{
-				$(".content .addkeyWord").hide();
-        		$(".addKeyWord").show();
-			}
-		}
-        //
-        function appendHtml(data){
-            if (data.length>0){
-				$('.addKeyWord').show();
-                var additionHtml = '';
-                for (var i = data.length - 1; i >= 0; i--) {
-					addkws_arr[data[i]]=i
-                    additionHtml +='<li>'
-                                    +'<div class="one">'
-                                    +'<div>'
-                                    +'<span>'
-                                    +'<p class="key">'+data[i]+'</p>'
-                                    +'</span>'
-                                    +'</div>'
-                                    +'<button class="editKeyWord" dataIndex="'+i+'"><i class="iconfont icon-xiugai"></i> 修改</button>'
-                                    +'</div>'
-                                    +'<div class="modify">'
-                                    +'<textarea  name=""  rows="1"  placeholder="" maxlength="20" >'+data[i]+'</textarea>'
-                                    +'<button class="deleteKey">删除</button>'
-                                    +'<button class="ascertainKey">确定</button>'
-                                    +'</div>'
-                                    +'</li>'
-                }
-                $(".showKeyWord ul").html(additionHtml);
-                $(".enter.addkeyWord").hide();
-                $(".showKeyWord").show();
-            }else{
-                $(".enter.addkeyWord").show();
-                $(".showKeyWord").hide();
-            }
-        }
-        //
-        function saveSession(t,i,index){
-            if (_addkws!=""){
-                if(t!="D"){
-                    if($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex")!=undefined&&i <= Number($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex"))){
-						for (var n in addkws_arr){
-							if(addkws_arr[n]==i){
-                                delete addkws_arr[n];
-							}
-						}
-						addkws_arr[_addkws] = i;
-                        addition_kws[index] = _addkws
-                    }else{
-						addkws_arr[_addkws] = i;
-                        addition_kws.push(_addkws)
-                    }
-                }else{
-					for (var n in addkws_arr){
-						if(addkws_arr[n]==i){
-                            delete addkws_arr[n];
-						}
-					}
-                    addition_kws.splice(index,1);
-                }
-                sessionStorage.addition_kws = JSON.stringify(addition_kws)
-           }
-        }
-    </script>
-	{{include "/common/baiducc.html"}}
-</body>
-
-</html>

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

@@ -1,164 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport"
-        content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
-    <meta http-equiv="X-UA-Compatible" content="ie=edge">
-    <title>排除词</title>
-    <script src="{{Msg "seo" "cdn"}}/vipsubscribe/js/rem.js?v={{Msg "seo" "version"}}"></script>
-    <link rel="stylesheet" href="{{Msg "seo" "cdn"}}/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}">
-    <link rel="stylesheet" href="{{Msg "seo" "cdn"}}/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}">
-    <link rel="stylesheet" href="{{Msg "seo" "cdn"}}/vipsubscribe/css/weui.min.css?v={{Msg "seo" "version"}}">
-    <link rel="stylesheet" href="{{Msg "seo" "cdn"}}/vipsubscribe/css/addition_exclusive_word.css?v={{Msg "seo" "version"}}">
-</head>
-
-<body>
-
-    <div class="exclusive-word">
-        <section class="content">
-            <p class="title">示例：运维（排除词）</p>
-            <!-- 添加排除词 -->
-            <div class="enter addkeyWord">
-                <input type="text" class="enterOne" maxlength="20" placeholder="请输入排除词" />
-                <div class="btn">
-				    <button onclick="Cancel()" style="width:49%;background:#fff;color:#2cb7ca;opacity: 1;">取消</button>
-                    <button disabled>确认</button>
-                </div>
-            </div>
-            <!-- 添加排除词显示列表 -->
-            <div class="showKeyWord">
-                <ul>
-
-                </ul>
-            </div>
-            <div class="problem">
-                疑问解答 <i class="iconfont icon-wenhao"></i>
-            </div>
-        </section>
-        <div class="addKeyWord" style="display:none;">
-            <i class="iconfont icon-tianjia"></i>
-        </div>
-        <!-- 疑难问题弹窗 -->
-        <div class="problemPop">
-            <div class="problemPopContent">
-                <h3>疑问解答</h3>
-                <ul>
-                    <li>
-                        <p>例：某公司主营业务为软件系统开发</p>
-                    </li>
-                    <li>
-                        <h4>关键词:</h4>
-                        <p>目标信息中的关键性词语，如“软件系统”</p>
-                    </li>
-                    <li>
-                        <h4>附加词:</h4>
-                        <p>与关键词形成一体/组合，便于查找准确信息，如“开发”</p>
-                    </li>
-                    <li>
-                        <h4>排除词:</h4>
-                        <p>与关键词互斥，可排除一部分非目标信息，如“运维”</p>
-                    </li>
-                </ul>
-                <button class="knowBtn">我知道了</button>
-            </div>
-        </div>
-    </div>
-    <script src="https://cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js"></script>
-    <script src="{{Msg "seo" "cdn"}}/vipsubscribe/js/weui.min.js?v={{Msg "seo" "version"}}"></script>
-    <script src="{{Msg "seo" "cdn"}}/vipsubscribe/js/exclusiveWord.js?v={{Msg "seo" "version"}}"></script>
-	{{include "/common/weixin.html"}}
-	<script src="{{Msg "seo" "cdn"}}/wxswordfish/share.js?v={{Msg "seo" "version"}}"></script>
-    <script>
-		initShare({{.T.signature}},{{.T.openid}},2,"jy_extend",{{.T.nickname}},{{.T.avatar}});
-        var not_kws = []//排除词
-        var _notkws = "";
-        var _notindex = -1;
-		var notkws_arr = {}
-        $(function() {
-			(/iphone|ipod|ipad/i.test(navigator.appVersion)) && document.addEventListener('blur', function(e) {
-				// 这里加了个类型判断，因为a等元素也会触发blur事件
-				['input', 'textarea'].includes(e.target.localName) && document.body.scrollIntoView(true)
-			}, true)
-            if(sessionStorage&&sessionStorage.not_kws!=undefined){
-                not_kws = JSON.parse(sessionStorage.not_kws);
-                appendHtml(not_kws);
-            }else{
-                $(".enter.addkeyWord").show();
-                $(".showKeyWord").hide();
-            }
-        })
-		//
-		function Cancel(){
-			if($(".showKeyWord li").length==0){
-				window.history.go(-1)
-			}else{
-				$(".content .addkeyWord").hide();
-        		$(".addKeyWord").show();
-			}
-		}
-        //
-        function appendHtml(data){
-            if (data.length>0){
-				$('.addKeyWord').show();
-                var additionHtml = '';
-                for (var i = data.length - 1; i >= 0; i--) {
-					notkws_arr[data[i]]=i
-                    additionHtml +='<li>'
-                                    +'<div class="one">'
-                                    +'<div>'
-                                    +'<span>'
-                                    +'<p class="key">'+data[i]+'</p>'
-                                    +'</span>'
-                                    +'</div>'
-                                    +'<button class="editKeyWord" dataIndex="'+i+'"><i class="iconfont icon-xiugai"></i> 修改</button>'
-                                    +'</div>'
-                                    +'<div class="modify">'
-                                    +'<textarea  name=""  rows="1"  placeholder="" maxlength="20" >'+data[i]+'</textarea>'
-                                    +'<button class="deleteKey">删除</button>'
-                                    +'<button class="ascertainKey">确定</button>'
-                                    +'</div>'
-                                    +'</li>'
-                }
-                $(".showKeyWord ul").html(additionHtml);
-                $(".enter.addkeyWord").hide();
-                $(".showKeyWord").show();
-            }else{
-                $(".enter.addkeyWord").show();
-                $(".showKeyWord").hide();
-            }
-        }
-        //
-        function saveSession(t,i,index){
-            if (_notkws!=""){
-                if(t!="D"){
-                    if($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex")!=undefined&&i <= Number($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex"))){
-						for (var n in notkws_arr){
-							if(notkws_arr[n]==i){
-                                delete notkws_arr[n];
-							}
-						}
-						notkws_arr[_notkws] = i;
-                        not_kws[index] = _notkws
-                    }else{
-						notkws_arr[_notkws] = i;
-                        not_kws.push(_notkws)
-                    }
-                }else{
-					for (var n in notkws_arr){
-						console.log(n,i)
-						if(notkws_arr[n]==i){
-                            delete notkws_arr[n];
-						}
-					}
-                    not_kws.splice(index,1)
-                }
-                sessionStorage.not_kws = JSON.stringify(not_kws)
-           }
-        }
-    </script>
-	{{include "/common/baiducc.html"}}
-</body>
-
-</html>

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

@@ -0,0 +1,132 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport"
+        content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>订阅关键词</title>
+    <script src='{{Msg "seo" "cdn"}}/vipsubscribe/js/rem.js?v={{Msg "seo" "version"}}'></script>
+    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}'>
+    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}'>
+    <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/index.css />
+    <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/icon/local.css />
+    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/public.css?v={{Msg "seo" "version"}}'>
+    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/keyword-common.css?v={{Msg "seo" "version"}}'>
+    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/keyword-info.css?v={{Msg "seo" "version"}}'>
+    <style>
+        #app {
+            height: 100%;
+        }
+    </style>
+</head>
+
+<body>
+    <div id="app" v-cloak>
+        <div class="j-container">
+            <div class="j-main">
+                <div class="module-key pd">
+                    <div class="m-header">
+                        <div class="m-h-left batch-delete">关键词</div>
+                        <div class="m-h-right batch-delete" v-show="!showNotKeyModule" @click="showNotKeyModule=true">+ 添加排除词</div>
+                    </div>
+                    <van-field
+                        class="card-radius key-textarea"
+                        v-model.trim="keyInfo.key"
+                        rows="3"
+                        maxlength="200"
+                        autosize
+                        type="textarea"
+                        placeholder="请输入关键词，多个关键词用空格隔开，例如：税务局 软件"
+                    ></van-field>
+                </div>
+                <div class="module-rec pd">
+                    <div class="rec-cells card-radius" v-show="recListState.listAll.length">
+                        <div class="rec-header">
+                            <div class="rec-title">相似订阅条件推荐</div>
+                            <div class="rec-change" @click="nextPageRec">
+                                <van-icon :class="recListState.loading ? 'active' : ''" name="replay"></van-icon>
+                                <span class="text">换一批</span>
+                            </div>
+                        </div>
+                        <div class="rec-content">
+                            <div class="rec-tags">
+                                <div class="tag" v-for="(item,index) in recListState.list" :key="index" v-text="item" @click="clickTag(item)">筛选</div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="module-match-way pd">
+                    <div class="m-header">
+                        <div class="m-h-left batch-delete">匹配模式</div>
+                        <div></div>
+                    </div>
+                    <div class="match-way-list">
+                        <div
+                            class="match-way-item card-radius"
+                            :class="{ active: item.value == keyInfo.matchWay }"
+                            v-for="(item,index) in matchWayList"
+                            @click="keyInfo.matchWay = item.value"
+                            :key="index">
+                            <div class="m-w-i-title">${ item.title }</div>
+                            <div class="m-w-i-subinfo">${ item.subInfo }</div>
+                        </div>
+                    </div>
+                </div>
+                <div class="module-not-key pd" v-show="showNotKeyModule">
+                    <div class="m-header">
+                        <div class="m-h-left batch-delete">排除词</div>
+                        <div></div>
+                    </div>
+                    <van-field
+                        class="card-radius key-textarea"
+                        v-model.trim="keyInfo.notKey"
+                        rows="3"
+                        maxlength="200"
+                        autosize
+                        type="textarea"
+                        placeholder="请输入排除词，多个关键词用空格隔开，例如：税务局 软件"
+                    ></van-field>
+                    <div class="err-tip">不希望接收，与关键词互斥</div>
+                </div>
+            </div>
+            <div class="j-footer">
+                <van-notice-bar
+                    v-show="tooLittleTipShow"
+                    class="footer-tip center"
+                    color="#ff9f40"
+                    background="#fff4e8"
+                    :scrollable="false"
+                    :wrapable="true">
+                    当前匹配信息过少，请适当修改关键词
+                </van-notice-bar>
+                <div class="j-button-group add" v-if="pInfo.editType === 'add'">
+                    <button class="j-button-confirm" @click="saveKeyWord" :disabled="!keyInfo.key">
+                        <span class="info-text">确认</span>
+                        <span class="sub-text" v-if="false">（近3个月内共匹${ pInfo.pushCount }条信息）</span>
+                    </button>
+                </div>
+                <div class="j-button-group edit" v-if="pInfo.editType === 'edit'">
+                    <button class="j-button-cancel" @click="delThisKey">删除</button>
+                    <button class="j-button-confirm" @click="saveKeyWord">
+                        <span class="info-text">确认</span>
+                        <span class="sub-text">（近3个月内共匹配${ pInfo.pushCount }条信息）</span>
+                    </button>
+                </div>
+            </div>
+        </div>
+    </div>
+    <script src=//cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js></script>
+    <script src=//cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js></script>
+    <script src=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/vant.min.js></script>
+    <script src='{{Msg "seo" "cdn"}}/big-member/js/utils.js?v={{Msg "seo" "version"}}'></script>
+    <script>
+        utils.iosBackRefresh()
+    </script>
+	{{include "/common/weixin.html"}}
+    <script src='{{Msg "seo" "cdn"}}/vipsubscribe/js/keyword-info.js?v={{Msg "seo" "version"}}'></script>
+	{{include "/common/baiducc.html"}}
+</body>
+
+</html>

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

@@ -10,200 +10,189 @@
     <script src='{{Msg "seo" "cdn"}}/vipsubscribe/js/rem.js?v={{Msg "seo" "version"}}'></script>
     <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}'>
     <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}'>
-    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/weui.min.css?v={{Msg "seo" "version"}}'>
+    <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/index.css />
+    <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/icon/local.css />
+    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/public.css?v={{Msg "seo" "version"}}'>
+    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/keyword-common.css?v={{Msg "seo" "version"}}'>
     <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/keyWord.css?v={{Msg "seo" "version"}}'>
-    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/swiper/swiper.min.css?v={{Msg "seo" "version"}}'>
-    <script src='{{Msg "seo" "cdn"}}/swiper/swiper.min.js?v={{Msg "seo" "version"}}'></script>
     <style>
-        .keyWord .all-classify-column .classify-list .classify-item > div:first-of-type  {
-            line-height: 1;
-            padding: 0.04rem 0;
-        }
-        .keyWord .all-classify-column .classify-list .classify-item .classify-item-l {
-            color: #171826;
-            font-weight: 500;
-        }
-        .keyWord .all-classify-column .classify-list .classify-item .classify-item-r {
-            color: #9B9CA3;
-        }
-        .keyWord .all-classify-column .classify-list .classify-item .classify-item-r .icon-arrow {
-            color: #C0C4CC;
-        }
-        .classifyKeysShow {
-            color: #5F5E64;
-        }
-    </style>
-    <style>
-        /* 新添加 icon */
-        .jy-icon-add-box {
-            position: fixed;
-            bottom: .5rem;
-            margin-bottom: .3rem;
-            background: #2cb7ca;
-            width: 56px;
-            height: 56px;
-            border-radius: 50%;
-            text-align: center;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-        }
-        .jy-icon-add-box .jy-icon-add {
-            margin-right: 0;
-        }
-        .jy-icon-add-box .jy-icon-add:before, .jy-icon-add-box .jy-icon-add:after {
-            width: 0.36rem;
+        #app {
+            height: 100%;
         }
     </style>
 </head>
 
 <body>
-<div class="keyWord" style="min-height: 100vh;">
-    <section class="add-keyword-container" style="display: none;">
-        <div>
-            <p class="classify-fast" style="display:none;">
-                <i class="jy-icon-add" style="transform: rotate(45deg);"></i>
-                <span>导入免费订阅中的关键词及排除词</span>
-                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary">快速导入</a>
-            </p>
-            <div class="classify">
-                <span class="classify-l">关键词分类</span>
-                <span class="classify-r">
-                        <span class="classify-detail">未分类</span>
-                        <span class="iconfont icon-arrow"></span>
-                    </span>
-            </div>
-            <p class="classify-tips">
-                关键词分类便于对同类别关键词做整合管理
-            </p>
+<div id="app" v-cloak>
+    <div class="j-container">
+        <div class="m-header fast-import" v-if="fastImportTipShow">
+            <van-icon name="plus" style="transform: rotate(45deg);" @click="tip.fastImport = false"></van-icon>
+            <div class="fast-import-text" style="flex: 1;">导入免费订阅中的关键词及排除词</div>
+            <div class="fast-import-button" @click="fastImportDialogShow">快速导入</div>
         </div>
-        <section class="content">
-            <!-- 添加关键词 -->
-            <div class="enter addkeyWord" style="display: none;">
-                <img alt="暂无关键词" src='{{Msg "seo" "cdn"}}/vipsubscribe/image/nothing.png?v={{Msg "seo" "version"}}'>
-                <span>暂无关键词</span>
-                <div class="addButton">
-                    <span class="jy-icon-add"></span>
-                    <span>添加关键词</span>
+        <div class="m-header">
+            <div class="group-filter-container">
+                <div class="filter-text">关键词组分类</div>
+                <div class="filter-button" @click="showFilterPicker(true)">
+                    <span>${ filter.groupName ? filter.groupName : '全部' }</span>
+                    <van-icon name="play"></van-icon>
                 </div>
             </div>
-
-            <!-- 添加关键词显示列表 -->
-            <div class="showKeyWord">
-                <ul>
-                </ul>
+            <div class="batch-delete h100" v-show="listShow" @click="batchDeleteStateChange">
+                ${ batchDeleteState ? '取消' : '批量删除' }
             </div>
-        </section>
-
-        <div class="addKeyWord addNewKeyword">
-            <div class="jy-icon-add-box" style="display: none;">
-                <span class="jy-icon-add"></span>
-            </div>
-            <p> 关键词添加数量：<em style="color: #2cb7ca;" class="kws_count">0 </em>&nbsp;/ 300</p>
-        </div>
-    </section>
-    <section class="all-classify-column" style="display: none;">
-        <ul class="classify-list">
-
-        </ul>
-
-        <div class="addKeyWord addNewKeyword">
-            <div class="keysexplain"><p> 关键词添加数量：<em style="color: #2cb7ca;" class="kws_count">0 </em>&nbsp;/ 300</p></div>
-            <div class="addClassify">新增关键词分类</div>
-        </div>
-    </section>
-
-    <!-- 疑难问题弹窗 -->
-    <div class="problemPop dialog-container">
-        <div class="problemPopContent">
-            <h3>疑问解答</h3>
-            <ul>
-                <li>
-                    <p>例：某公司主营业务为软件系统开发</p>
-                </li>
-                <li>
-                    <h4>关键词:</h4>
-                    <p>目标信息中的关键性词语，如“软件系统”</p>
-                </li>
-                <li>
-                    <h4>附加词:</h4>
-                    <p>与关键词形成一体/组合，便于查找准确信息，如“开发”</p>
-                </li>
-                <li>
-                    <h4>排除词:</h4>
-                    <p>与关键词互斥，可排除一部分非目标信息，如“运维”</p>
-                </li>
-            </ul>
-            <button class="knowBtn">我知道了</button>
         </div>
-    </div>
-    <!-- 关键词分类弹框 -->
-    <div class="classify-edit-pop dialog-container">
-        <div class="weui-dialog weui-animate-fade-in">
-            <div class="weui-dialog__hd">
-                <strong class="weui-dialog__title">关键词分类</strong>
+        <div class="j-main">
+            <div class="keyword-list" v-show="listShow">
+                <div
+                    class="keywords-item"
+                    v-for="(item,index) in filter.keywordsList"
+                    :key="index">
+                    <div class="checkbox-container" :class="{ w0: !batchDeleteState }">
+                        <van-checkbox
+                            v-model="item.checked"
+                            checked-color="#2ABED1"
+                            icon-size="18px">
+                        </van-checkbox>
+                    </div>
+                    <van-swipe-cell
+                        :name="index"
+                        :disabled="batchDeleteState"
+                        :before-close="beforeKeySwipeCellClose">
+                        <div class="j-key-card" @click="clickKeyCard(item)">
+                            <div class="j-key-card-top">
+                                <div class="k-c-t-l j-tag" :class="item.calcInfo.matchWayClass">${ item.calcInfo.matchWay }</div>
+                                <div class="k-c-t-c text-container">${ item.calcInfo.key }</div>
+                                <van-icon class="k-c-t-r" name="arrow"></van-icon>
+                            </div>
+                            <div class="j-key-card-bottom" v-if="item.calcInfo.notkey">
+                                <span class="subinfo-label">排除词：</span>
+                                <span class="subinfo-text text-container">${ item.calcInfo.notkey }</span>
+                            </div>
+                        </div>
+                        <template #right>
+                            <div class="delete-button">删除</div>
+                        </template>
+                    </van-swipe-cell>
+                </div>
             </div>
-            <div class="weui-dialog__bd">
-                <input type="text" class="classify-keyword" maxlength="20" placeholder="输入关键词分类名称" onBlur="window.scrollTo(0, 0)">
+            <div class="key-empty" v-show="emptyShow">
+                <div class="empty-img-container">
+                    <img class="empty-img" src="/jyapp/images/wxkeyset/nopush.png">
+                </div>
+                <div class="empty-text">暂无关键词组</div>
+                <button class="add-keyword-button" @click="addKeyWord" :disabled="filter.allKeywordsList.length >= conf.keywordMax">
+                    <van-icon name="plus"></van-icon>
+                    <span class="button-text">订阅关键词</span>
+                </button>
+                <div class="keywords-count">
+                    关键词添加数量：<span class="highlight-text">${ filter.allKeywordsList.length }</span> / ${ conf.keywordMax }
+                </div>
+          </div>
+        </div>
+        <div class="j-footer" v-show="listShow">
+            <van-notice-bar
+                class="footer-tip center"
+                color="#2abed1"
+                background="#fff"
+                :scrollable="false"
+                :wrapable="true">
+                任意1组关键词组匹配成功即推送相关信息
+            </van-notice-bar>
+            <div class="j-button-group" v-if="batchDeleteState">
+                <button class="j-button-confirm" @click="batchDelete" :disabled="this.selectedCount <= 0">
+                    <span class="info-text">删除</span>
+                    <span class="sub-text">（已选中${ selectedCount }项）</span>
+                </button>
             </div>
-            <div class="weui-dialog__ft">
-                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_default dialog__btn dialog__btn_cancel">取消</a>
-                <a href="javascript:;" style="color: #2ABED1" class="weui-dialog__btn weui-dialog__btn_primary dialog__btn dialog__btn_confirm opacity6">确定</a>
+            <div class="j-button-group" v-else>
+                <button class="j-button-confirm" @click="addKeyWord" :disabled="filter.allKeywordsList.length >= conf.keywordMax">
+                    <span class="info-text">新增关键词</span>
+                    <span class="sub-text">（${ filter.allKeywordsList.length } / ${ conf.keywordMax }）</span>
+                </button>
             </div>
         </div>
     </div>
-
-    <!-- 关键词分类说明 -->
-    <div class="classify-show-pop dialog-container">
-        <!-- <div class="weui-mask weui-animate-fade-in"></div> -->
-        <div class="weui-dialog weui-animate-fade-in">
-            <div class="weui-dialog__hd">
-                <strong class="weui-dialog__title">提示信息</strong>
-            </div>
-            <div class="weui-dialog__bd">
-                关键词分类有利于关键词做整合管理<br>工作更为高效！
-            </div>
-            <div class="weui-dialog__ft">
-                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary dialog__btn dialog__btn_confirm">去设置</a>
-                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_default dialog__btn dialog__btn_cancel">取消</a>
+    <van-dialog
+        v-model="dialog.fastImport"
+        title="快速导入"
+        confirm-button-text="导入"
+        confirm-button-color="#2abed1"
+        @confirm="fastImport"
+        show-cancel-button>
+        <div class="fast-import-content">
+            快速导入可将免费版招标订阅内所设置的关键词及其排除词将一并导入至“未分类"关键词分类内，无需再次手动输入，简化您的订阅过程
+        </div>
+        <div class="fast-import-tip">
+            注：地区与行业分类以超级订阅设置内为准,不做导入。
+        </div>
+    </van-dialog>
+    <van-dialog
+        v-model="dialog.upgrade"
+        class="dialog-upgrade"
+        title="关键词升级提示"
+        confirm-button-text="我知道了"
+        confirm-button-color="#2abed1">
+        <div class="fast-import-content">
+            “附加词”已整合至“关键词”中，添加多个关键词用空格隔开即可，并可以灵活选择匹配模式（精准、模糊），示例说明：
+        </div>
+        <div class="fast-import-tip">
+            <div class="tip-label">调整前：</div>
+            <div class="tip-text">
+                <div class="tip-text-item">关键词：软件</div>
+                <div class="tip-text-item">附加词：系统</div>
             </div>
         </div>
-    </div>
-    <!-- 快速导入说明 -->
-    <div class="classify-fast-pop dialog-container">
-        <!-- <div class="weui-mask weui-animate-fade-in"></div> -->
-        <div class="weui-dialog weui-animate-fade-in">
-            <div class="weui-dialog__hd">
-                <strong class="weui-dialog__title">快速导入</strong>
+        <div class="fast-import-tip">
+            <div class="tip-label">调整后：</div>
+            <div class="tip-text">
+                <div class="tip-text-item">关键词：软件 系统</div>
+                <div class="tip-text-item">匹配模式：精准（同时包含所有 关键词才推送）</div>
             </div>
-            <div class="weui-dialog__bd">
-                快速导入可将免费版招标订阅内所设置的关键词及其排除词一并导入至“<span class="fastICName">未分类</span>”关键词分类内,无需再次手动输入，简化您的订阅过程。
-                <p style="color:#888;">注：地区与行业分类以超级订阅设置内为准,不做导入。</p>
+        </div>
+    </van-dialog>
+    <van-popup
+        v-model="filter.pickerShow"
+        closeable
+        round
+        position="bottom"
+        close-icon="clear"
+        class="j-popup"
+        :style="{ height: '45%' }">
+        <div class="j-container">
+            <div class="popup-header header-title">关键词分类</div>
+            <div class="j-main">
+                <div class="keywords-group-list">
+                    <div class="keywords-group-item"
+                        @click="checkThisGroup"
+                        :class="{ active: !filter.groupName }">
+                        全部
+                    </div>
+                    <div class="keywords-group-item"
+                        v-for="(item, index) in groupNameList"
+                        :key="index"
+                        @click="checkThisGroup(item)"
+                        :class="{ active: item.name === filter.groupName }">
+                        ${ item.name }
+                    </div>
+                </div>
             </div>
-            <div class="weui-dialog__ft">
-                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_default dialog__btn dialog__btn_cancel">取消</a>
-                <a href="javascript:;"  style="color: #2ABED1" class="weui-dialog__btn weui-dialog__btn_primary dialog__btn dialog__btn_confirm">导入</a>
+            <div class="j-button-group">
+                <button class="j-button-confirm" @click="toKeyManagePage">分类管理</button>
             </div>
         </div>
-    </div>
+    </van-popup> 
 </div>
 
-<script src='https://cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js'></script>
-<script src='{{Msg "seo" "cdn"}}/js/jquery.cookie.js?v={{Msg "seo" "version"}}'></script>
-<script src='{{Msg "seo" "cdn"}}/vipsubscribe/js/weui.min.js?v={{Msg "seo" "version"}}'></script>
+<script src=//cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js></script>
+<script src=//cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js></script>
+<script src=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/vant.min.js></script>
+<script src='{{Msg "seo" "cdn"}}/big-member/js/utils.js?v={{Msg "seo" "version"}}'></script>
 {{include "/common/weixin.html"}}
-<script src='{{Msg "seo" "cdn"}}/wxswordfish/share.js?v={{Msg "seo" "version"}}'></script>
-<script>
-    initShare({{.T.signature}},{{.T.openid}}, 2, "jy_extend",{{.T.nickname}},{{.T.avatar}});
-</script>
-<script src='{{Msg "seo" "cdn"}}/vipsubscribe/js/newKeyWord.js?v={{Msg "seo" "version"}}'></script>
 <script>
-    $(window).bind("pageshow", function (event) {
-        if (event.originalEvent.persisted) {
-            window.location.reload(true);
-        }
-    });
+    utils.iosBackRefresh()
 </script>
+<script src='{{Msg "seo" "cdn"}}/vipsubscribe/js/keyWord.js?v={{Msg "seo" "version"}}'></script>
 {{include "/common/baiducc.html"}}
 </body>
 

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

@@ -0,0 +1,157 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport"
+        content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>关键词分类管理</title>
+    <script src='{{Msg "seo" "cdn"}}/vipsubscribe/js/rem.js?v={{Msg "seo" "version"}}'></script>
+    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/base.css?v={{Msg "seo" "version"}}'>
+    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/iconfont/iconfont.css?v={{Msg "seo" "version"}}'>
+    <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/index.css />
+    <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/icon/local.css />
+    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/public.css?v={{Msg "seo" "version"}}'>
+    <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/vipsubscribe/css/keyword-common.css?v={{Msg "seo" "version"}}'>
+    <style>
+        #app {
+            height: 100%;
+        }
+        .m-header {
+            justify-content: flex-end;
+        }
+        .keywords-item .j-key-card {
+            flex-direction: row;
+            justify-content: space-between;
+        }
+        .j-key-card .j-key-card-left {
+            font-size: .28rem;
+            color: #171826;
+            line-height: .4rem;
+        }
+        .j-key-card .j-key-card-right {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            font-size: .24rem;
+            color: #5f5e64;
+            line-height: .36rem;
+        }
+        .j-key-card .fill-in-svg {
+            margin-left: .16rem;
+            width: .36rem;
+            height: .36rem;
+            transition: width 0.5s ease;
+        }
+        .j-key-card .fill-in-svg.w0 {
+            margin-left: 0;
+            width: 0;
+        }
+        .fill-in-svg > img {
+            display: block;
+            width: 100%;
+            height: 100%;
+        }
+        .keyword-list {
+            padding-top: 0;
+        }
+    </style>
+</head>
+
+<body>
+    <div id="app" v-cloak>
+        <div class="j-container">
+            <div class="m-header">
+                <div class="batch-delete h100" @click="batchDeleteStateChange">
+                    ${ batchDeleteState ? '取消' : '批量删除' }
+                </div>
+            </div>
+            <div class="j-main">
+                <div class="keyword-list" v-show="listShow">
+                    <!-- 分类名称卡片 -->
+                    <div
+                        class="keywords-item"
+                        v-for="(item,index) in groupNameList"
+                        :key="index">
+                        <div class="checkbox-container" :class="{ w0: !batchDeleteState }">
+                            <van-checkbox
+                                v-model="item.checked"
+                                checked-color="#2ABED1"
+                                :disabled="item.deleteDisabled"
+                                icon-size="18px">
+                            </van-checkbox>
+                        </div>
+                        <van-swipe-cell
+                            :name="index"
+                            :disabled="item.deleteDisabled || batchDeleteState"
+                            :before-close="beforeKeySwipeCellClose">
+                            <div class="j-key-card" @click="clickKeyCard(item, index)">
+                                <div class="j-key-card-left">${ item.name }</div>
+                                <div class="j-key-card-right">
+                                    <span class="text">${ item.count }组关键词</span>
+                                    <div class="fill-in-svg" :class="{ w0: batchDeleteState }">
+                                        <img src="/jyapp/vipsubscribe/image/icon-write.svg" alt="">
+                                    </div>
+                                </div>
+                            </div>
+                            <template #right>
+                                <div class="delete-button">删除</div>
+                            </template>
+                        </van-swipe-cell>
+                    </div>
+                </div>
+                <div class="key-empty" v-show="emptyShow">
+                    <div class="empty-img-container">
+                        <img class="empty-img" src="/jyapp/images/wxkeyset/nopush.png">
+                    </div>
+                    <div class="empty-text">暂无关键词分类</div>
+              </div>
+            </div>
+            <div class="j-footer">
+                <van-notice-bar
+                    v-if="batchDeleteState"
+                    class="footer-tip"
+                    color="#ff9f40"
+                    background="#fff4e8"
+                    :scrollable="false"
+                    :wrapable="true">
+                    注：关键词分类下不存在关键词组时才可删除，如需删除，需先删除该分类下的关键词组
+                </van-notice-bar>
+                <div class="j-button-group" v-if="batchDeleteState">
+                    <button class="j-button-confirm" @click="batchDelete" :disabled="this.selectedCount <= 0">
+                        <span class="info-text">删除</span>
+                        <span class="sub-text">（已选中${ selectedCount }项）</span>
+                    </button>
+                </div>
+                <div class="j-button-group" v-else>
+                    <button class="j-button-confirm" @click="addGroup">新建关键词分类</button>
+                </div>
+            </div>
+        </div>
+        <van-dialog
+            v-model="editGroupNameDialog.show"
+            class="group-name-edit"
+            title="关键词分类"
+            get-container="body"
+            confirm-button-color="#2ABED1"
+            @confirm="confirmEditGroupName"
+            show-cancel-button>
+            <div class="edit-container">
+                <input type="text" maxlength="20" v-model.trim="editGroupNameDialog.value" placeholder="输入关键词分类名称" onblur="window.scrollTo(0, 0)">
+            </div>
+        </van-dialog>
+    </div>
+    <script src=//cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js></script>
+    <script src=//cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js></script>
+    <script src=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/vant.min.js></script>
+    <script src='{{Msg "seo" "cdn"}}/big-member/js/utils.js?v={{Msg "seo" "version"}}'></script>
+    <script>
+        utils.iosBackRefresh()
+    </script>
+	{{include "/common/weixin.html"}}
+    <script src='{{Msg "seo" "cdn"}}/vipsubscribe/js/keyword-manage.js?v={{Msg "seo" "version"}}'></script>
+	{{include "/common/baiducc.html"}}
+</body>
+
+</html>