您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符
 
 
 

623 行
16 KiB

  1. <template>
  2. <view class="cented-box">
  3. <view class="cented-boxs">
  4. <view class="Pinspeak">客户信息</view>
  5. <view class="chented">
  6. <view class="title">
  7. <view class="titletext">客户姓名</view>
  8. <view class="titletext2">
  9. <input class="titletext-input" style="color: #333333;" v-model="parames.name"
  10. placeholder-class="titletext-input" placeholder-style="color:#B2B2B2;" type="text"
  11. placeholder="请输入客户姓名(必填)" />
  12. </view>
  13. </view>
  14. <view class="title">
  15. <view class="titletext">客户性别</view>
  16. <view class="titletext2 displayclick"
  17. style="display: flex;align-items: center;padding-left: 10rpx;">
  18. <view class="sexRadio" @click="changeSex(1)" :class="{active:parames.sex == 1}">男士</view>
  19. <view class="sexRadio" @click="changeSex(2)" :class="{active:parames.sex == 2}">女士</view>
  20. </view>
  21. </view>
  22. <view class="title">
  23. <view class="titletext">联系电话</view>
  24. <view class="titletext2">
  25. <input class="titletext-input" style="color: #333333;" v-model="parames.phone"
  26. placeholder-class="titletext-input" placeholder-style="color:#B2B2B2;" type="number"
  27. placeholder="请输入联系电话" />
  28. </view>
  29. </view>
  30. <view class="title">
  31. <view class="titletext">接待人数</view>
  32. <view class="titletext2" style="display: flex;align-items: center;justify-content: space-around;">
  33. <view class="num" v-for="i in 6" :key="i" :class="{active:parames.howMany == i+1}"
  34. @click="changeHowMany(i+1)">
  35. {{i + 1}}
  36. </view>
  37. </view>
  38. </view>
  39. <view class="title" @click="Buildingselection()">
  40. <view class="titletext">客户来源</view>
  41. <view class="titletext2"
  42. style="font-size: 30rpx;font-weight: 400;color: #B2B2B2;line-height: 90rpx;padding-left: 10rpx;">
  43. <text v-if="showSourceName" style="color: #333333;">{{showSourceName}}</text>
  44. <text v-else>请选择客户来源</text>
  45. </view>
  46. <view class="titleimg">
  47. <image class="titleimg1" src="../../../static/images/arrow.png" mode=""></image>
  48. </view>
  49. </view>
  50. <view class="title" style="border: none;" @click="showTemplateSelect()">
  51. <view class="titletext">销讲业务</view>
  52. <view class="titletext2"
  53. style="font-size: 30rpx;font-weight: 400;color: #B2B2B2;line-height: 90rpx;padding-left: 10rpx;">
  54. <text v-if="templateName" style="color: #333333;">{{templateName}}</text>
  55. <text v-else>请选择销讲业务</text>
  56. </view>
  57. <view class="titleimg">
  58. <image class="titleimg1" src="../../../static/images/arrow.png" mode=""></image>
  59. </view>
  60. </view>
  61. </view>
  62. <view class="Pinspeak">顾问</view>
  63. <view class="chented" @click="clickShowhid()">
  64. <view class="title" style="border: none;">
  65. <view class="titletext">接待顾问</view>
  66. <view class="titletext2"
  67. style="font-size: 30rpx;font-weight: 400;color: #B2B2B2;line-height: 90rpx;padding-left: 10rpx;">
  68. <text v-if="text" style="color: #333333;">{{text}}</text>
  69. <text v-else>请选择接待顾问</text>
  70. </view>
  71. <view class="titleimg">
  72. <image class="titleimg1" src="../../../static/images/arrow.png" mode=""></image>
  73. </view>
  74. </view>
  75. </view>、
  76. </view>
  77. <!-- 提交按钮 -->
  78. <view class="clive" @click.stop="$noMultipleClicks(save)"
  79. :style="{background:(isBand==false?'#2671E2':'#949494')}">确定</view>
  80. <!-- 客户来源 -->
  81. <u-select :mask-close-able="false" label-name="sourceName" value-name="id" v-model="Showhiddenunits"
  82. mode="single-column" :list="list" @cancel="cancel" @confirm="confirm"></u-select>
  83. <!-- 销讲业务 -->
  84. <u-select :mask-close-able="false" label-name="templateName" value-name="id" v-model="showTemplate"
  85. mode="single-column" :list="templateList" @cancel="templateCancel" @confirm="templateConfirm"></u-select>
  86. <!-- 代接代提示窗 -->
  87. <u-modal v-model="show" :mask-close-able="true" :title="'代接待提醒'" :confirm-text="confirmtext"
  88. :cancel-text='canceltext' @cancel="confirmA" @confirm="confirmB" :show-cancel-button='true'
  89. :content="content"></u-modal>
  90. <!-- 多接待间隔超时提示窗 -->
  91. <u-modal v-model="showBeyound" :mask-close-able="true" title="接待提醒" :confirm-text="beyoundConfirmText"
  92. :cancel-text="beyoundCancelText" @cancel="beyoundCancel" @confirm="beyoundConfirm"
  93. :show-cancel-button="true" :content="beyondContent"></u-modal>
  94. </view>
  95. </template>
  96. <script>
  97. var app = getApp();
  98. var config = require("../../../config");
  99. export default {
  100. data() {
  101. return {
  102. noClick: true,
  103. Showhiddenunits: false,
  104. list: [], // 客户来源
  105. parames: {
  106. name: '',
  107. // 性别1男 2女
  108. sex: 1,
  109. phone: '',
  110. source: null,
  111. sourceId: null,
  112. howMany: 1,
  113. agentId: null,
  114. projectId: '',
  115. replaceReception: 0,
  116. marketingBusiness: '', // 销讲业务默认为第一个
  117. endRecordFlag: 1, // 0:结束,1:一起接待
  118. },
  119. showSourceName: '', // 展示文字
  120. shifoinfo: 0, // 高级权限 项目是否能指派顾问
  121. freeList: [], // 顾问列表
  122. text: null,
  123. show: false,
  124. content: '',
  125. confirmtext: '', //确认文字
  126. canceltext: '', //取消文字
  127. daitiReceptionobj: {},
  128. saveisshow: true,
  129. isBand: false, // 阻止二次提交
  130. tap: true,
  131. fdFlag: null,
  132. isPass: false, // 当前顾问是否正在接待
  133. fromBack: false, // 从选择顾问页面跳回
  134. beyoundConfirmText: '结束', // 多接待间隔确定文字
  135. beyoundCancelText: '一起接待', // 多接待间隔确定文字
  136. beyondContent: '', // 文字描述内容
  137. showBeyound: false, // 展示多接待间隔超时提示窗
  138. templateList: [], // 销讲业务
  139. showTemplate: false, // 展示选择销讲业务弹窗
  140. templateName: '', // 销讲业务类型文字
  141. };
  142. },
  143. computed: {
  144. // 用户详情
  145. userInfo() {
  146. return uni.getStorageSync("weapp_session_userInfo_data")
  147. },
  148. },
  149. onLoad() {
  150. uni.$on('addreception', customerId => {
  151. let obj = this.freeList.find(item => item.agentId == customerId)
  152. this.fromBack = true
  153. this.text = obj.name;
  154. this.parames.agentId = customerId;
  155. })
  156. this.getMarketingBusiness();
  157. },
  158. onUnload() {
  159. uni.$off('addreception')
  160. },
  161. onShow() {
  162. this.parames.projectId = uni.getStorageSync('buildingID').id;
  163. this.init()
  164. this.getFreeList();
  165. this.getFromSource();
  166. },
  167. methods: {
  168. // 确认的方法(结束)
  169. beyoundConfirm() {
  170. this.parames.endRecordFlag = 0
  171. this.saveAddreception()
  172. },
  173. // 取消的方法(取消)
  174. beyoundCancel() {
  175. this.parames.endRecordFlag = 1
  176. this.saveAddreception()
  177. },
  178. // 获取销讲业务
  179. getMarketingBusiness() {
  180. this.$u.get('/customer/marketingBusiness', {
  181. houseId: uni.getStorageSync('buildingID').id,
  182. status: 0,
  183. }).then(res => {
  184. this.templateList = res
  185. if (res && res.length > 0) {
  186. this.parames.marketingBusiness = res[0].id
  187. this.templateName = res[0].templateName
  188. }
  189. })
  190. },
  191. // 获取客户来源
  192. getFromSource() {
  193. uni.request({
  194. url: config.service.sourceList + "?houseId=" + this.parames.projectId,
  195. method: "GET",
  196. header: {
  197. 'content-type': 'application/json',
  198. 'Access-Token': uni.getStorageSync('weapp_session_login_data').token
  199. },
  200. success: (data) => {
  201. if (data.data.code == 10000) {
  202. this.list = data.data.data
  203. }
  204. }
  205. })
  206. },
  207. //取消
  208. confirmA() {
  209. if (this.daitiReceptionobj.assign != null) {
  210. this.parames.agentId = this.daitiReceptionobj.assign.accountId;
  211. this.baochunfun()
  212. } else {
  213. uni.showToast({
  214. icon: "none",
  215. title: "【" + this.daitiReceptionobj.owner.name + "】正在接待中"
  216. })
  217. return;
  218. }
  219. },
  220. // 确认
  221. confirmB() {
  222. this.parames.agentId = this.daitiReceptionobj.replacement.accountId;
  223. this.parames.replaceReception = 1;
  224. this.baochunfun()
  225. },
  226. save() {
  227. this.$u.get('/customer/findByAgentIdNotEnd', {
  228. agentId: this.parames.agentId,
  229. houseId: this.parames.projectId
  230. }).then(res => {
  231. console.log(res, 'asdaskljdalksjdlksajdksl')
  232. if (res.num > 0) {
  233. this.beyondContent = `【${this.text}】正在接待客户,是否要结束超过${res.endRecordInterval}分钟的接待?`
  234. this.showBeyound = true
  235. } else {
  236. this.saveAddreception()
  237. }
  238. }).catch(() => {
  239. this.saveAddreception()
  240. })
  241. },
  242. // 新增接待
  243. saveAddreception() {
  244. // 校验当前登录人是否是顾问
  245. let obj = this.freeList.find(item => {
  246. return item.agentId == this.userInfo.accountId
  247. }) || null
  248. if (!obj && this.userInfo.dataCode == 6) {
  249. this.isPass = true
  250. } else {
  251. this.isPass = false
  252. }
  253. if (this.parames.name.length == 0) {
  254. uni.showToast({
  255. icon: "none",
  256. title: "客户姓名不能为空"
  257. })
  258. return;
  259. }
  260. if (this.parames.phone && !this.$u.test.mobile(this.parames.phone)) {
  261. uni.showToast({
  262. icon: "none",
  263. title: "手机号码格式不正确"
  264. })
  265. return;
  266. }
  267. // 判断条件2是否选中顾问
  268. if (this.isPass && !this.parames.agentId) {
  269. uni.showToast({
  270. icon: "none",
  271. title: "请选择顾问~"
  272. })
  273. return;
  274. }
  275. const that = this;
  276. this.isBand = true
  277. this.$u.post("customer/daitiReception", {
  278. phone: that.parames.phone,
  279. projectId: that.parames.projectId,
  280. agentId: that.parames.agentId,
  281. endRecordFlag: that.parames.endRecordFlag
  282. }).then(res => {
  283. if (res.unchecked == 0) {
  284. that.baochunfun()
  285. this.tap = false;
  286. } else {
  287. if (res.zs == 0) {
  288. that.parames.agentId = res.assign.accountId;
  289. that.baochunfun()
  290. this.tap = false;
  291. } else {
  292. if (res.assign == null && res.replacement == null) {
  293. that.baochunfun()
  294. this.tap = false;
  295. } else {
  296. if (res.assign == null) {
  297. that.daitiReceptionobj = res;
  298. that.content = "此客户的顾问为【" + res.owner.name + "】,确认让【" + res.replacement.name +
  299. "】代接待吗?"
  300. that.confirmtext = res.replacement.name + "代接待", //确认文字
  301. that.canceltext = res.owner.name + '接待', //取消文字
  302. that.show = true;
  303. this.isBand = false
  304. } else {
  305. that.daitiReceptionobj = res;
  306. that.content = "此客户的顾问为【" + res.owner.name + "】,确认让【" + res.replacement.name +
  307. "】代接待吗?"
  308. that.confirmtext = res.replacement.name + "代接待", //确认文字
  309. that.canceltext = res.assign.name + '接待', //取消文字
  310. that.show = true;
  311. this.isBand = false
  312. }
  313. }
  314. }
  315. }
  316. }).catch(e => {
  317. that.show = true;
  318. this.isBand = false
  319. })
  320. },
  321. baochunfun() {
  322. const {
  323. dataCode
  324. } = uni.getStorageSync("weapp_session_userInfo_data");
  325. if (this.parames.phone.length == 0) {
  326. this.parames.phone = null
  327. }
  328. uni.showLoading({
  329. title: "保存中",
  330. mask: true
  331. })
  332. if (dataCode == 6) {
  333. this.$u.post("/customer/gwAdd", this.parames).then(res => {
  334. this.saveisshow = true;
  335. uni.hideLoading();
  336. uni.showToast({
  337. icon: "none",
  338. title: "保存成功"
  339. })
  340. uni.navigateBack()
  341. }).catch(e => {
  342. this.isBand = false
  343. })
  344. } else {
  345. this.$u.post("/customer/add", this.parames).then(res => {
  346. this.saveisshow = true;
  347. uni.hideLoading();
  348. uni.showToast({
  349. icon: "none",
  350. title: "保存成功"
  351. })
  352. uni.navigateBack()
  353. }).catch(e => {
  354. this.isBand = false
  355. })
  356. }
  357. },
  358. changeSex(sex) {
  359. this.parames.sex = sex;
  360. },
  361. changeHowMany(num) {
  362. this.parames.howMany = num;
  363. },
  364. clickShowhid() {
  365. if (this.shifoinfo != 0) {
  366. uni.showToast({
  367. icon: 'none',
  368. title: '您没有指派权限~',
  369. duration: 2000
  370. });
  371. return
  372. }
  373. if (this.userInfo.dataCode == 6 && !this.checkAuthority('顾问指派顾问')) {
  374. uni.showToast({
  375. icon: "none",
  376. title: "您没有指派权限~",
  377. duration: 2000
  378. })
  379. return
  380. }
  381. if (this.freeList.length == 0) {
  382. uni.showToast({
  383. icon: 'none',
  384. title: '当前无可用排班顾问',
  385. duration: 2000
  386. });
  387. } else {
  388. uni.navigateTo({
  389. url: `/pages/mine/reception/consultant?from=addreception&id=${this.parames.agentId}&chosedAgentId=${this.parames.agentId}`
  390. })
  391. }
  392. },
  393. Buildingselection() {
  394. this.Showhiddenunits = true;
  395. },
  396. showTemplateSelect() {
  397. this.showTemplate = true;
  398. },
  399. cancel() {
  400. this.Showhiddenunits = false;
  401. },
  402. confirm(e) {
  403. this.showSourceName = e[0].label;
  404. this.parames.sourceId = e[0].value;
  405. this.Showhiddenunits = false;
  406. },
  407. // 销讲业务方法
  408. templateCancel() {
  409. this.showTemplate = false;
  410. },
  411. templateConfirm(e) {
  412. this.showTemplate = false;
  413. this.templateName = e[0].label;
  414. this.parames.marketingBusiness = e[0].value;
  415. },
  416. init() {
  417. uni.request({
  418. url: config.service.getSelfAssignedByHouseId + "?houseId=" + this.parames.projectId,
  419. method: "GET",
  420. header: {
  421. 'content-type': 'application/json',
  422. 'Access-Token': uni.getStorageSync('weapp_session_login_data').token
  423. },
  424. success: (data) => {
  425. if (data.data.code == 10000) {
  426. this.shifoinfo = data.data.data.selfAssigned
  427. }
  428. }
  429. })
  430. },
  431. //获取顾问列表
  432. getFreeList() {
  433. this.$u.get("/zkAgentPool/freeList?itemId=" + this.parames.projectId + "&deptId=" + '' + '&name=' + '')
  434. .then(res => {
  435. this.freeList = res;
  436. this.freeList.forEach(item => {
  437. if (item.onLine == 0) {
  438. item.label = item.name + "(离线)";
  439. } else if (item.onLine == 1) {
  440. item.label = item.name + "(在线)";
  441. } else {
  442. item.label = item.name + "(无设备)";
  443. }
  444. item.value = item.agentId
  445. // 从选择顾问页面跳回时需阻断用当前登录人的顾问id选中自身
  446. if (!this.fromBack) {
  447. if (this.userInfo.accountId == item.agentId) {
  448. this.text = item.label
  449. this.parames.agentId = item.agentId;
  450. }
  451. }
  452. })
  453. })
  454. },
  455. }
  456. };
  457. </script>
  458. <style lang="scss" scoped>
  459. .sexRadio {
  460. color: #BFBFBF;
  461. border: 1rpx solid #BFBFBF;
  462. font-size: 24upx;
  463. width: 100rpx;
  464. height: 43rpx;
  465. text-align: center;
  466. line-height: 40rpx;
  467. &:last-child {
  468. margin-left: 20rpx;
  469. }
  470. &.active {
  471. color: #2B6FFF;
  472. border-color: #2B6FFF;
  473. }
  474. }
  475. .num {
  476. width: 50rpx;
  477. height: 50rpx;
  478. background: rgba(43, 110, 253, 0.1);
  479. color: #2B6EFD;
  480. font-size: 30rpx;
  481. display: flex;
  482. align-items: center;
  483. justify-content: center;
  484. &.active {
  485. background: #2B6EFD;
  486. color: #FFFFFF;
  487. }
  488. }
  489. .cented-box {
  490. background: #F8F8F8;
  491. width: 100%;
  492. min-height: 100vh;
  493. display: flex;
  494. flex-direction: column;
  495. .cented-boxs {
  496. flex-grow: 1;
  497. }
  498. }
  499. .Pinspeak {
  500. width: 100%;
  501. height: 92rpx;
  502. border-bottom: 1rpx solid #E0E0E0;
  503. font-size: 32rpx;
  504. font-weight: bold;
  505. color: #333333;
  506. text-indent: 30rpx;
  507. line-height: 92rpx;
  508. background: #FFFFFF;
  509. margin-top: 20rpx;
  510. padding-left: 10rpx;
  511. }
  512. .chented {
  513. width: 100%;
  514. padding-left: 30rpx;
  515. padding-right: 30rpx;
  516. background-color: #FFFFFF;
  517. .title {
  518. width: 100%;
  519. height: 90rpx;
  520. border-bottom: 1rpx solid #E0E0E0;
  521. display: flex;
  522. align-items: center;
  523. .titletext {
  524. width: 21%;
  525. height: 90rpx;
  526. font-size: 30rpx;
  527. font-weight: 400;
  528. color: #333333;
  529. line-height: 90rpx;
  530. text-indent: 10rpx;
  531. }
  532. .titletext2 {
  533. width: 71%;
  534. height: 90rpx;
  535. }
  536. .titletext-input {
  537. width: 100%;
  538. height: 90rpx;
  539. font-size: 30rpx;
  540. font-weight: 400;
  541. color: #B2B2B2;
  542. line-height: 90rpx;
  543. padding-left: 10rpx;
  544. }
  545. .titleimg {
  546. width: 8%;
  547. text-align: right;
  548. .titleimg1 {
  549. width: 16rpx;
  550. height: 36rpx;
  551. }
  552. }
  553. }
  554. }
  555. .clive {
  556. flex-shrink: 0;
  557. position: sticky;
  558. bottom: 32rpx;
  559. width: 690rpx;
  560. height: 88rpx;
  561. background: #2671E2;
  562. text-align: center;
  563. line-height: 88rpx;
  564. color: #FFFFFF;
  565. border-radius: 8rpx;
  566. margin: 0 auto;
  567. font-size: 32rpx;
  568. }
  569. </style>