跟进记录

li-guang

2021-01-06 b1ad3da0513c1e3e9d0e4ed294cd7a68aa65102f

 hive-app/pages/workbench/followRecords.vue

@@ -16,7 +16,51 @@
            @tabClick="tabClick($event)"
         />
      </view>
      <view class="content-row font-14" v-for="item in 2">
      <view v-if="isShow" class="filter-content font-14">
         <view class="filter-content-time">
            <text>开始时间</text>
            <view class="gray flex align-center" @click="showTime()">
               <text>请选择</text>
               <text class="iconfont iconarrow-backimg"></text>
            </view>
            <date-time-picker ref='date-time' type='datetime' @change='dateTimeChange'></date-time-picker>
         </view>
         <view class="filter-content-time">
            <text>结束时间</text>
            <view class="gray flex align-center" @click="showTime()">
               <text>请选择</text>
               <text class="iconfont iconarrow-backimg"></text>
            </view>
            <date-time-picker ref='date-time' type='datetime' @change='dateTimeChange'></date-time-picker>
         </view>
         <view class="filter-content-row">
            <view>
               <text>客户</text>
            </view>
            <view class="img-box">
               <image class="header-img mr-20" src="../../static/images/default-avatar.png"></image>
               <navigator url="../member/selectCustomer" hover-class="none">
                  <text class="iconfont iconjia gray-outline-btn-circle ml-5"></text>
               </navigator>
            </view>
         </view>
         <view class="filter-content-row">
            <view>
               <text>员工</text>
            </view>
            <view class="img-box">
               <image class="header-img mr-20" src="../../static/images/default-avatar.png"></image>
               <navigator url="../manager/selectEmployee" hover-class="none">
                  <text class="iconfont iconjia gray-outline-btn-circle ml-5"></text>
               </navigator>
            </view>
         </view>
         <view class="flex sticky-footer">
            <button class="white-btn flex-1">重置</button>
            <button class="blue-btn flex-1 ml-10">确定</button>
         </view>
      </view>
      <view v-else class="content-row font-14" v-for="item in 2">
         <view class="flex align-center">
            <image class="header-img" src="../../static/images/default-avatar.png"></image>
            <view class="flex flex-v ml-10">
@@ -42,7 +86,7 @@
         </view>
         <view class="right mt-5">
            <text class="iconfont iconxin"></text>
            <text class="iconfont iconliuyan1 ml-20"></text>
            <text class="iconfont iconliuyan1 ml-20" @click="showMessage"></text>
         </view>
         <view class="content-row-notes flex align-center blue">
            <text class="iconfont iconxin mr-10"></text>
@@ -52,14 +96,20 @@
            <text>李贝: 好的,继续跟进</text>
         </view>
      </view>
      <view v-show="messageShow" class="message-row">
         <input type="text" cursor-spacing="10" :focus="messageShow" class="message-input" placeholder="评论" placeholder-class="placeholder"/>
         <button class="green-btn message-btn">发送</button>
      </view>
   </view>
</template>

<script>
   import HTabs from "@/components/liuyuno-tabs/liuyuno-tabs.vue";
   import DateTimePicker from '../../components/bory-dateTimePicker/bory-dateTimePicker.vue'
   export default {
      components: {
          HTabs
          HTabs,
         DateTimePicker
      },
      data() {
        return {
@@ -80,7 +130,9 @@
         imgList:[
            {'imgurl':'../../static/images/banner.jpg'},
            {'imgurl':'../../static/images/product.jpg'}
         ]
         ],
         isShow:false,
         messageShow:false,
        }  
      },
      methods:{
@@ -92,6 +144,19 @@
            uni.previewImage({
               urls: imgArr
            })
         },
         onNavigationBarButtonTap(e){
            if(e.index==0){
            }
            if(e.width && e.index==1){
               this.isShow=!this.isShow
            }
         },
         showTime () {
            this.$refs['date-time'].show();
         },
         showMessage(){
            this.messageShow=!this.messageShow
         },
      }
   }
@@ -117,7 +182,6 @@
   .content-img{
      width: 80px;
      height: 80px;
      border-radius: 4px;
   }
   .content-row-notes{
      line-height: 20px;
@@ -125,4 +189,47 @@
      padding: 5px;
      margin-top: 10px;
   }
   .filter-content{
      position: fixed;
      left: 0;
      right: 0;
      height: 100%;
      background: #FFFFFF;
      padding: 0px 10px;
   }
   .filter-content-time{
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-bottom: 1px solid #EDEAF4;
      padding: 10px 0;
   }
   .filter-content-row{
      padding: 10px 0;
      border-bottom: 1px solid #EDEAF4;
   }
   .img-box{
      display: flex;
      align-items: center;
      padding: 0 10px;
      margin-top: 10px;
   }
   .message-row{
      display: flex;
      align-items: center;
      background: #F6F6F8;
      padding: 10px;
   }
   .message-input{
      flex: 1;
      font-size: 14px;
      background: #FFFFFF;
      height: 30px;
      margin-right: 5px;
   }
   .message-btn{
      margin: 0;
      line-height: 30px;
      border-radius: 0;
   }
</style>