askbot-dragon 0.7.89 → 0.7.93

package/src/components/popup.vue

@@ -0,0 +1,184 @@
+<template>
+  <div class="popUp">
+    <div class="topBtn">
+      <span class="cancel" @click="closeBtn">取消</span>
+      <span class="sure" @click="sure">确定</span>
+    </div>
+    <slot name="popup-header" class="popup-header"></slot>
+    <div class="popup-content">
+      <div
+          class="filter-item"
+          v-for="(item,index) in options"
+          :key="index"
+          @click="checked(item,index)"
+      >
+        <div :class="[checkIdList.includes(item[props.value]) && 'setColor', 'label']">{{item[props.label]}}</div>
+      </div>
+    </div>
+    <div class="popup-footer">
+      <slot name="popup-footer"></slot>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      checkOptions: [],
+      checkIdList:[],
+      visable:false
+    }
+  },
+  props: {
+    options: {
+      type: Array,
+      default:function() {
+        return []
+      }
+    },
+    defaultValue: {
+      type: Array,
+      default:function() {
+        return []
+      }
+    },
+    props: {
+      type: Object,
+      default(){
+        return{
+          label: 'label',
+          value: 'value'
+        }
+      }
+    },
+    multiple: {
+      type: Boolean,
+      default: false
+    }
+  },
+  methods: {
+    checked(item) {
+      if(this.multiple) {
+        let count = this.checkIdList.findIndex(element => { return element == item[this.props.value] } )
+        if(count !== -1) {
+          this.checkIdList.splice(count,1)
+          this.checkOptions.splice(count,1)
+        } else {
+          this.checkIdList.push(item[this.props.value])
+          this.checkOptions.push(item)
+        }
+      } else {
+        this.checkIdList = []
+        this.checkOptions = []
+        this.checkIdList.push(item[this.props.value])
+        this.checkOptions.push(item)
+      }
+    },
+    sure() {
+      if(this.checkOptions.length == 0 && this.checkIdList == 0){
+        this.$emit('onConfim',false,false)
+        return
+      }
+      let option = JSON.parse(JSON.stringify(this.checkOptions))
+      let list = JSON.parse(JSON.stringify(this.checkIdList))
+      if(this.multiple) {
+        this.$emit('onConfim',option, list)
+      } else {
+        this.$emit('onConfim',option[0], list[0])
+      }
+    },
+    closeBtn(){
+      this.$emit('onclose')
+    }
+  },
+  watch: {
+    defaultValue: {
+      handler(value) {
+        if (!value) {
+          // 定位当前位置
+        /*  this.options.forEach(item => {})*/
+        }
+      },
+      deep: true,
+      immediate: true
+    },
+    visable(value) {
+      if(value) {
+        console.log(this.defaultValue,'=====');
+        this.checkOptions = []
+        if(Array.isArray(this.defaultValue)) {
+          this.checkIdList = [...this.defaultValue]
+          this.checkIdList.forEach(item =>{
+            this.options.forEach(res =>{
+              if(item == res[this.props.value]) {
+                this.checkOptions.push(res)
+              }
+            })
+          })
+        } 
+        // else {
+        //   this.checkIdList = this.defaultValue
+        //   let obj = this.options.find(item =>{ return item[this.props.value] == this.defaultValue[0] })
+        //   obj && this.checkOptions.push(obj)
+        // }
+      } else {
+        this.checkOptions = []
+        this.checkIdList = []
+      }
+    }
+  },
+  
+}
+</script>
+
+<style lang="less" scoped>
+.popup-content {
+  /*padding-top: 8px;*/
+  .filter-item {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 48px;
+    .setColor {
+      color: #366aff;
+    }
+    .label {
+      display: block;
+      width: 80%;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space:nowrap;
+      text-align: center;
+    }
+  }
+}
+.topBtn {
+    width: 100%;
+    height: 40px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    box-sizing: border-box;
+    padding: 0 20px;
+    .cancel {
+      color: #606266;
+    }
+    .sure {
+      color: #366aff;
+    }
+  }
+.popup-footer {
+  position: absolute;
+  max-height: 50px;
+  bottom: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  color: #366aff;
+  background: #eff2f5;
+  /*border-radius: 28px;*/
+}
+</style>

package/src/components/recommend.vue

@@ -1,90 +1,90 @@
-<template>
-  <div class="text-recommed-intent">
-    <p class="intent-des" v-if="msg.recommend&&msg.recommend.description" v-html="msg.recommend.description"></p>
-    <div class="bottom-link" v-if="msg.recommend&&msg.recommend.description"></div>
-    <div v-if="msg.recommend&&msg.recommend.list" class="options-list">
-      <p
-          v-for="(option, index) in msg.recommend.list"
-          class="options-item"
-          :class="index!==msg.recommend.list.length -1?'recommend-item':'last-item'"
-          :key="msg.nodeId + '_' + index"
-          @click="
-                  $emit(
-                      'onRadioClickReco',
-                      'recdNodeId' +
-                          '_' +
-                          index +
-                          '_' +
-                          option.id +
-                          '_' +
-                          option.text,
-                      option.text,
-                      msg.apiKey
-                  )
-              "
-      >
-        {{ option.text
-        }}<i class="arsenal_icon arsenalangle-right-solid"></i>
-      </p>
-    </div>
-  </div>
-
-</template>
-
-<script>
-
-export default {
-  name: "recommend",
-  props: ["msg"]
-}
-</script>
-
-<style scoped lang="less">
-.text-recommed-intent{
- /* max-width: 300px;*/
-  background-color: white;
-  .intent-des{
-    word-wrap: break-word;
-    word-break: break-all;
-    overflow: hidden;
-    padding: 8px 0;
-    height: auto;
-    /*border-bottom: 1px solid #EEEEEE;*/
-    color: #A9B3C6;
-    font-size: 13px;
-    background-color: white;
-  }
-  .bottom-link{
-    height: 1px;
-    background-color:#EEEEEE;
-  }
-  .options-list{
-    padding-top: 4px;
-    min-width: 120px;
-    .options-item{
-
-      height: 25px;
-      line-height: 25px;
-      background-color: #ffffff;
-      color: #366aff;
-      cursor:pointer;
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      i{
-        padding-left: 10px;
-      }
-    }
-    .recommend-item{
-      padding: 8px 0;
-    }
-    .last-item{
-      padding-top: 8px;
-    }
-    .end{
-      border-bottom-left-radius: 25px !important;
-      border-bottom-right-radius: 25px !important;
-    }
-  }
-}
+<template>
+  <div class="text-recommed-intent">
+    <p class="intent-des" v-if="msg.recommend&&msg.recommend.description" v-html="msg.recommend.description"></p>
+    <div class="bottom-link" v-if="msg.recommend&&msg.recommend.description"></div>
+    <div v-if="msg.recommend&&msg.recommend.list" class="options-list">
+      <p
+          v-for="(option, index) in msg.recommend.list"
+          class="options-item"
+          :class="index!==msg.recommend.list.length -1?'recommend-item':'last-item'"
+          :key="msg.nodeId + '_' + index"
+          @click="
+                  $emit(
+                      'onRadioClickReco',
+                      'recdNodeId' +
+                          '_' +
+                          index +
+                          '_' +
+                          option.id +
+                          '_' +
+                          option.text,
+                      option.text,
+                      msg.apiKey
+                  )
+              "
+      >
+        {{ option.text
+        }}<i class="arsenal_icon arsenalangle-right-solid"></i>
+      </p>
+    </div>
+  </div>
+
+</template>
+
+<script>
+
+export default {
+  name: "recommend",
+  props: ["msg"]
+}
+</script>
+
+<style scoped lang="less">
+.text-recommed-intent{
+ /* max-width: 300px;*/
+  background-color: white;
+  .intent-des{
+    word-wrap: break-word;
+    word-break: break-all;
+    overflow: hidden;
+    padding: 8px 0;
+    height: auto;
+    /*border-bottom: 1px solid #EEEEEE;*/
+    color: #A9B3C6;
+    font-size: 13px;
+    background-color: white;
+  }
+  .bottom-link{
+    height: 1px;
+    background-color:#EEEEEE;
+  }
+  .options-list{
+    padding-top: 4px;
+    min-width: 120px;
+    .options-item{
+
+      height: 25px;
+      line-height: 25px;
+      background-color: #ffffff;
+      color: #366aff;
+      cursor:pointer;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      i{
+        padding-left: 10px;
+      }
+    }
+    .recommend-item{
+      padding: 8px 0;
+    }
+    .last-item{
+      padding-top: 8px;
+    }
+    .end{
+      border-bottom-left-radius: 25px !important;
+      border-bottom-right-radius: 25px !important;
+    }
+  }
+}
 </style>

package/src/components/selector/hOption.vue

@@ -1,21 +1,21 @@
-<template>
-  <li class="h-selector-option">
-    <slot>{{value}}</slot>
-  </li>
-</template>
-
-<script>
-export default {
-name: "hOption",
-  props: {
-    value: {
-      type: [String,Number],
-      required: true
-    }
-  }
-}
-</script>
-
-<style scoped>
-
+<template>
+  <li class="h-selector-option">
+    <slot>{{value}}</slot>
+  </li>
+</template>
+
+<script>
+export default {
+name: "hOption",
+  props: {
+    value: {
+      type: [String,Number],
+      required: true
+    }
+  }
+}
+</script>
+
+<style scoped>
+
 </style>