|
@@ -0,0 +1,551 @@
|
|
|
+<template>
|
|
|
+ <view class="container product clearfix">
|
|
|
+ <view class="club-search clearfix">
|
|
|
+ <view class="club-search-form">
|
|
|
+ <view class="search-from name">
|
|
|
+ <text class="iconfont icon-iconfonticonfontsousuo1"></text>
|
|
|
+ <input
|
|
|
+ class="input"
|
|
|
+ type="text"
|
|
|
+ confirm-type="search"
|
|
|
+ v-model="listQuery.searchName"
|
|
|
+ @input="onShowClose"
|
|
|
+ @confirm="initclubList()"
|
|
|
+ placeholder="搜索关键词"
|
|
|
+ maxlength="16"
|
|
|
+ />
|
|
|
+ <text class="iconfont icon-shanchu1" v-if="isShowClose" @click="delInputText()"></text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="search-from-title"> 咨询人:{{ questionMan }} </view>
|
|
|
+ </view>
|
|
|
+ <view class="remarks-content" :style="{ paddingBottom: isIphoneX ? '182rpx' : '148rpx' }">
|
|
|
+ <view :class="{ 'tui-order-list': scrollTop >= 0 }" class="clearfix">
|
|
|
+ <!-- 空白页 -->
|
|
|
+ <view class="empty-container" v-if="isEmpty">
|
|
|
+ <text class="error-text">点击下方添加按钮开始记录吧~</text>
|
|
|
+ </view>
|
|
|
+ <template v-else>
|
|
|
+ <!-- 列表 -->
|
|
|
+ <view
|
|
|
+ class="tui-remarks-cell tui-mtop"
|
|
|
+ v-for="(remark, index) in remarksList"
|
|
|
+ :key="index"
|
|
|
+ @click.stop="details(remark.remarksId)"
|
|
|
+ >
|
|
|
+ <view class="tui-remarks-title">{{ remark.addDate }}</view>
|
|
|
+ <view class="tui-remarks-content">
|
|
|
+ <text
|
|
|
+ class="tui-remarks-span"
|
|
|
+ v-for="(label, labelIndex) in remark.remarks"
|
|
|
+ :key="labelIndex"
|
|
|
+ >
|
|
|
+ {{ label }}
|
|
|
+ </text>
|
|
|
+ </view>
|
|
|
+ <view class="tui-remarks-button">
|
|
|
+ <view class="btn edit" @click.stop="handEditRemark(remark.remarksId)">修改</view>
|
|
|
+ <view class="btn del" @click.stop="deleteRemark(remark.remarksId)">删除</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!--加载loadding-->
|
|
|
+ <tui-loadmore :visible="loadding" :index="3" type="black"></tui-loadmore>
|
|
|
+ <tui-nomore :visible="!pullUpOn" :backgroundColor="'#ffffff'" :text="nomoreText"></tui-nomore>
|
|
|
+ <!--加载loadding-->
|
|
|
+ </template>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 取消收藏操作 -->
|
|
|
+ <tui-bottom-popup :radius="false" :mask="false" :show="popupShow">
|
|
|
+ <view class="tui-popup-box clearfix">
|
|
|
+ <view class="tui-right-flex tui-popup-btn" :style="{ paddingBottom: isIphoneX ? '68rpx' : '34rpx' }">
|
|
|
+ <view class="tui-flex-1">
|
|
|
+ <view class="tui-button" :class="isEmpty ? 'disabled' : 'cancel'" @click="handleShowClubpopup"
|
|
|
+ >同步至机构</view
|
|
|
+ >
|
|
|
+ <view class="tui-button confirm" @click="handleAddRecord">添加画像</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </tui-bottom-popup>
|
|
|
+ <!-- 添加记录 -->
|
|
|
+ <cm-clubpopup
|
|
|
+ ref="clubpopup"
|
|
|
+ v-if="isClubpopupShow"
|
|
|
+ :show="isClubpopupShow"
|
|
|
+ @handleChoiceaClub="handleChoiceaClubData"
|
|
|
+ >
|
|
|
+ </cm-clubpopup>
|
|
|
+ <!-- 弹窗提示 -->
|
|
|
+ <tui-modal
|
|
|
+ :show="modal"
|
|
|
+ @click="handleClick"
|
|
|
+ @cancel="hideMobel"
|
|
|
+ :content="contentModalText"
|
|
|
+ :button="modalButton"
|
|
|
+ color="#333"
|
|
|
+ :size="32"
|
|
|
+ shape="circle"
|
|
|
+ :maskClosable="false"
|
|
|
+ >
|
|
|
+ </tui-modal>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import tuiLoadmore from '@/components/tui-components/loadmore/loadmore'
|
|
|
+import tuiNomore from '@/components/tui-components/nomore/nomore'
|
|
|
+import cmClubpopup from '@/components/cm-module/cm-seller/cm-clubpopup'
|
|
|
+
|
|
|
+import { mapState, mapMutations } from 'vuex'
|
|
|
+const defaultListQuery = {
|
|
|
+ questionManId: 0,
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10
|
|
|
+}
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ tuiLoadmore,
|
|
|
+ tuiNomore,
|
|
|
+ cmClubpopup
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ StaticUrl: this.$Static,
|
|
|
+ isIphoneX: this.$store.state.isIphoneX,
|
|
|
+ modalButton: [
|
|
|
+ {
|
|
|
+ text: '取消',
|
|
|
+ type: 'gray',
|
|
|
+ plain: true //是否空心
|
|
|
+ },
|
|
|
+ {
|
|
|
+ text: '确认',
|
|
|
+ customStyle: {
|
|
|
+ color: '#fff',
|
|
|
+ bgColor: 'linear-gradient(90deg, #F28F31 0%, #E15616 100%)'
|
|
|
+ },
|
|
|
+ plain: false
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ totalRecord: 0,
|
|
|
+ popupShow: true,
|
|
|
+ popupShow1: false,
|
|
|
+ listQuery: Object.assign({}, defaultListQuery),
|
|
|
+ remarksList: [],
|
|
|
+ scrollTop: 0,
|
|
|
+ isEmpty: false,
|
|
|
+ loadding: false,
|
|
|
+ pullUpOn: true,
|
|
|
+ pullFlag: true,
|
|
|
+ hasNextPage: false,
|
|
|
+ navbarHeight: '',
|
|
|
+ nomoreText: '上拉显示更多',
|
|
|
+ contentModalText: '', //操作文字提示语句
|
|
|
+ modal: false,
|
|
|
+ questionMan: '',
|
|
|
+ questionManId: '',
|
|
|
+ handleRemarksId: 0,
|
|
|
+ isClubpopupShow: false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(option) {
|
|
|
+ this.questionMan = option.questionMan
|
|
|
+ this.listQuery.questionManId = option.questionManId
|
|
|
+ this.initGetStotage(this.listQuery.questionManId)
|
|
|
+ },
|
|
|
+ filters: {
|
|
|
+ NumFormat: function(value) {
|
|
|
+ //处理金额
|
|
|
+ if (!value) return '0.00'
|
|
|
+ let number = Number(value).toFixed(2)
|
|
|
+ return number
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState(['hasLogin', 'userInfo'])
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ ...mapMutations(['login', 'logout']),
|
|
|
+ async initGetStotage() {
|
|
|
+ const clubInfo = await this.$api.getComStorage('orderUserInfo')
|
|
|
+ this.listQuery.clubId = clubInfo.clubId ? clubInfo.clubId : 0
|
|
|
+ this.GetProductListInfo()
|
|
|
+ },
|
|
|
+ GetProductListInfo() {
|
|
|
+ this.remarksList = []
|
|
|
+ this.listQuery.pageNum = 1
|
|
|
+ this.UserService.getUserClubVisitorRecordlist(this.listQuery)
|
|
|
+ .then(response => {
|
|
|
+ let data = response.data
|
|
|
+ if (data.results && data.results.length > 0) {
|
|
|
+ this.isEmpty = false
|
|
|
+ this.hasNextPage = data.hasNextPage
|
|
|
+ this.totalRecord = data.totalRecord
|
|
|
+ this.remarksList = data.results
|
|
|
+ this.pullFlag = false
|
|
|
+ setTimeout(() => {
|
|
|
+ this.pullFlag = true
|
|
|
+ }, 500)
|
|
|
+ if (this.hasNextPage) {
|
|
|
+ this.pullUpOn = false
|
|
|
+ this.nomoreText = '上拉显示更多'
|
|
|
+ } else {
|
|
|
+ if (this.remarksList.length < 8) {
|
|
|
+ this.pullUpOn = true
|
|
|
+ } else {
|
|
|
+ this.pullUpOn = false
|
|
|
+ this.loadding = false
|
|
|
+ this.nomoreText = '已至底部'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.isEmpty = true
|
|
|
+ }
|
|
|
+ this.isRequest = true
|
|
|
+ })
|
|
|
+ .catch(error => {
|
|
|
+ this.$util.msg(error.msg, 2000)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ GetOnReachBottomData(index) {
|
|
|
+ //上拉加载
|
|
|
+ this.listQuery.pageNum += 1
|
|
|
+ this.UserService.getUserClubVisitorRecordlist(this.listQuery)
|
|
|
+ .then(response => {
|
|
|
+ let data = response.data
|
|
|
+ if (data.results && data.results.length > 0) {
|
|
|
+ this.hasNextPage = data.hasNextPage
|
|
|
+ this.remarksList = this.remarksList.concat(data.results)
|
|
|
+ this.pullFlag = false // 防上拉暴滑
|
|
|
+ setTimeout(() => {
|
|
|
+ this.pullFlag = true
|
|
|
+ }, 500)
|
|
|
+ if (this.hasNextPage) {
|
|
|
+ this.pullUpOn = false
|
|
|
+ this.nomoreText = '上拉显示更多'
|
|
|
+ } else {
|
|
|
+ this.pullUpOn = false
|
|
|
+ this.loadding = false
|
|
|
+ this.nomoreText = '已至底部'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(error => {
|
|
|
+ this.$util.msg(error.msg, 2000)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ deleteRemark(remarksId) {
|
|
|
+ this.handleRemarksId = remarksId
|
|
|
+ this.modal = true
|
|
|
+ this.contentModalText = '确定删除这条记录吗?'
|
|
|
+ },
|
|
|
+ handEditRemark(remarksId) {
|
|
|
+ //跳转修改资料备注
|
|
|
+ this.$api.navigateTo(`/pages/seller/remarks/add-record?type=edit&remarksId=${remarksId}&questionMan=${
|
|
|
+ this.questionMan
|
|
|
+ }`)
|
|
|
+ },
|
|
|
+ handleAllUnder() {
|
|
|
+ //跳转添加资料备注
|
|
|
+ this.$api.navigateTo('/pages/seller/remarks/customer-list')
|
|
|
+ },
|
|
|
+ handleShowClubpopup() {
|
|
|
+ if (this.isEmpty) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.isClubpopupShow = true
|
|
|
+ },
|
|
|
+ handleChoiceaClubData(data) {
|
|
|
+ console.log(data)
|
|
|
+ this.UserService.getUserRemarksConcactVisit(
|
|
|
+ {
|
|
|
+ clubId: data.clubId,
|
|
|
+ questionManId:this.listQuery.questionManId
|
|
|
+ }
|
|
|
+ )
|
|
|
+ .then(response => {
|
|
|
+ this.$util.msg('同步成功', 2000, true, 'success')
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$api.navigateTo('/pages/seller/remarks/customer-list')
|
|
|
+ }, 2000)
|
|
|
+ })
|
|
|
+ .catch(error => {
|
|
|
+ this.$util.msg(error.msg, 2000)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleAddRecord() {
|
|
|
+ this.$api.navigateTo(
|
|
|
+ `/pages/seller/remarks/add-record?questionManId=${this.listQuery.questionManId}&questionMan=${
|
|
|
+ this.questionMan
|
|
|
+ }`
|
|
|
+ )
|
|
|
+ },
|
|
|
+ handleClick(e) {
|
|
|
+ //取消收藏
|
|
|
+ if (e.index == 1) {
|
|
|
+ this.handleDeleteUserLike()
|
|
|
+ }
|
|
|
+ this.modal = false
|
|
|
+ },
|
|
|
+ handleDeleteUserLike() {
|
|
|
+ //操作删除资料备注
|
|
|
+ this.UserService.getUserRemarksVisitDelete({
|
|
|
+ remarksId: this.handleRemarksId
|
|
|
+ })
|
|
|
+ .then(response => {
|
|
|
+ this.$util.msg('已删除', 2000, true, 'success')
|
|
|
+ setTimeout(() => {
|
|
|
+ this.GetProductListInfo()
|
|
|
+ }, 2000)
|
|
|
+ })
|
|
|
+ .catch(error => {
|
|
|
+ this.$util.msg(error.msg, 2000)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ onShowClose() {
|
|
|
+ //输入框失去焦点时触发
|
|
|
+ if (this.listQuery.searchName != '') {
|
|
|
+ this.isShowClose = true
|
|
|
+ } else {
|
|
|
+ this.isShowClose = false
|
|
|
+ this.listQuery.pageNum = 1
|
|
|
+ this.initclubList()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ delInputText() {
|
|
|
+ //清除输入框内容
|
|
|
+ this.listQuery.searchName = ''
|
|
|
+ this.isShowClose = false
|
|
|
+ this.listQuery.pageNum = 1
|
|
|
+ this.initclubList()
|
|
|
+ },
|
|
|
+ hideMobel() {
|
|
|
+ this.modal = false
|
|
|
+ },
|
|
|
+ details(remarksId) {
|
|
|
+ this.$api.navigateTo(`/pages/seller/remarks/record-details?remarksId=${remarksId}`)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onPageScroll(e) {
|
|
|
+ //实时获取到滚动的值
|
|
|
+ },
|
|
|
+ onReachBottom() {
|
|
|
+ if (this.hasNextPage) {
|
|
|
+ this.loadding = true
|
|
|
+ this.pullUpOn = true
|
|
|
+ this.GetOnReachBottomData()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onPullDownRefresh() {
|
|
|
+ setTimeout(() => {
|
|
|
+ this.listQuery.pageNum = 1
|
|
|
+ uni.stopPullDownRefresh()
|
|
|
+ }, 200)
|
|
|
+ },
|
|
|
+ onShow() {}
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+@import '@/uni.scss';
|
|
|
+page {
|
|
|
+ background: #f7f7f7;
|
|
|
+}
|
|
|
+.empty-container {
|
|
|
+ z-index: 99;
|
|
|
+}
|
|
|
+.club-search {
|
|
|
+ width: 100%;
|
|
|
+ height: 192rpx;
|
|
|
+ background: #ffffff;
|
|
|
+ box-sizing: border-box;
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ z-index: 100;
|
|
|
+ .search-from-title {
|
|
|
+ width: 100%;
|
|
|
+ height: 80rpx;
|
|
|
+ line-height: 80rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 24rpx;
|
|
|
+ font-size: $font-size-34;
|
|
|
+ float: left;
|
|
|
+ color: #1890f9;
|
|
|
+ background-color: #f2f9ff;
|
|
|
+ font-weight: normal;
|
|
|
+ }
|
|
|
+ .club-search-form {
|
|
|
+ width: 100%;
|
|
|
+ height: 112rpx;
|
|
|
+ background: #ffffff;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 24rpx;
|
|
|
+ float: left;
|
|
|
+ .search-from {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: #f7f7f7;
|
|
|
+ border-radius: 32rpx;
|
|
|
+ float: left;
|
|
|
+ position: relative;
|
|
|
+ .input {
|
|
|
+ width: 500rpx;
|
|
|
+ height: 64rpx;
|
|
|
+ float: left;
|
|
|
+ line-height: 64rpx;
|
|
|
+ color: $text-color;
|
|
|
+ font-size: $font-size-24;
|
|
|
+ }
|
|
|
+ .icon-iconfonticonfontsousuo1 {
|
|
|
+ width: 64rpx;
|
|
|
+ height: 64rpx;
|
|
|
+ line-height: 64rpx;
|
|
|
+ text-align: center;
|
|
|
+ display: block;
|
|
|
+ font-size: $font-size-38;
|
|
|
+ float: left;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+ .icon-shanchu1 {
|
|
|
+ font-size: $font-size-32;
|
|
|
+ color: #999999;
|
|
|
+ position: absolute;
|
|
|
+ width: 64rpx;
|
|
|
+ height: 64rpx;
|
|
|
+ line-height: 64rpx;
|
|
|
+ text-align: center;
|
|
|
+ top: 0;
|
|
|
+ right: 0;
|
|
|
+ z-index: 10;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.remarks-content {
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ position: relative;
|
|
|
+ padding: 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 24rpx;
|
|
|
+ padding-top: 212rpx;
|
|
|
+ .empty-container-image {
|
|
|
+ width: 260rpx;
|
|
|
+ height: 260rpx;
|
|
|
+ margin-top: -300rpx;
|
|
|
+ }
|
|
|
+ .tui-remarks-cell {
|
|
|
+ width: 100%;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ background: #ffffff;
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 24rpx;
|
|
|
+ .tui-remarks-title {
|
|
|
+ width: 100%;
|
|
|
+ height: 66rpx;
|
|
|
+ line-height: 66rpx;
|
|
|
+ font-size: $font-size-26;
|
|
|
+ color: #333333;
|
|
|
+ border-bottom: 1px solid #e1e1e1;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ .tui-remarks-name {
|
|
|
+ width: 100%;
|
|
|
+ height: 37rpx;
|
|
|
+ line-height: 37rpx;
|
|
|
+ font-size: $font-size-26;
|
|
|
+ color: #666666;
|
|
|
+ text-align: left;
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ }
|
|
|
+ .tui-remarks-content {
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ border-bottom: 1px solid #e1e1e1;
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ padding-top: 20rpx;
|
|
|
+ .tui-remarks-span {
|
|
|
+ height: 48rpx;
|
|
|
+ line-height: 48rpx;
|
|
|
+ text-align: center;
|
|
|
+ padding: 0 20rpx;
|
|
|
+ background-color: #fef6f3;
|
|
|
+ font-size: $font-size-26;
|
|
|
+ color: #e15616;
|
|
|
+ border-radius: 25rpx;
|
|
|
+ display: inline-block;
|
|
|
+ margin-right: 24rpx;
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ &:nth-child(4n) {
|
|
|
+ margin-right: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tui-remarks-button {
|
|
|
+ width: 100%;
|
|
|
+ height: 48rpx;
|
|
|
+ .btn {
|
|
|
+ width: 50%;
|
|
|
+ line-height: 48rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ text-align: center;
|
|
|
+ font-size: $font-size-34;
|
|
|
+ float: left;
|
|
|
+ font-weight: bold;
|
|
|
+ &.edit {
|
|
|
+ color: #1890f9;
|
|
|
+ border-right: 1px solid #e1e1e1;
|
|
|
+ }
|
|
|
+ &.del {
|
|
|
+ color: #f94b4b;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.tui-popup-box {
|
|
|
+ position: relative;
|
|
|
+ box-sizing: border-box;
|
|
|
+ min-height: 100rpx;
|
|
|
+ padding: 6rpx 24rpx;
|
|
|
+ .tui-popup-content {
|
|
|
+ padding-top: 30rpx;
|
|
|
+ }
|
|
|
+}
|
|
|
+.tui-popup-btn {
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ float: left;
|
|
|
+ box-sizing: border-box;
|
|
|
+ margin-top: 30rpx;
|
|
|
+ .tui-flex-1 {
|
|
|
+ width: 100%;
|
|
|
+ height: 84rpx;
|
|
|
+ display: flex;
|
|
|
+ .tui-button {
|
|
|
+ flex: 1;
|
|
|
+ line-height: 84rpx;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 42rpx;
|
|
|
+ padding: 0;
|
|
|
+ margin: 0 15rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ &.cancel {
|
|
|
+ background: #ffe6dc;
|
|
|
+ color: #e15616;
|
|
|
+ }
|
|
|
+ &.disabled {
|
|
|
+ background: #e1e1e1;
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+ &.confirm {
|
|
|
+ background: $btn-confirm;
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|