modalDialog.vue 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399
  1. <template>
  2. <view>
  3. <u-modal v-model="show" :content-style="{ fontSize: '32rpx' }" @confirm="contentBtn" :show-title="false" confirm-text="知道了" :confirm-style="{ fontWeight: '700' }">
  4. <view class="slot-content">
  5. <rich-text :nodes="content"></rich-text>
  6. </view>
  7. </u-modal>
  8. <!-- 关注公众号 -->
  9. <u-modal
  10. v-model="goFollowShow"
  11. :content-style="{ fontSize: '32rpx' }"
  12. @confirm="goFollowShowBtn"
  13. :show-cancel-button="true"
  14. confirm-text="去关注"
  15. @cancel="cancel"
  16. :show-title="false"
  17. :cancel-style="{ borderRight: '1rpx solid #EBEBEB' }"
  18. :confirm-style="{ fontWeight: '700' }"
  19. >
  20. <view class="slot-content">
  21. <rich-text :nodes="accounts"></rich-text>
  22. </view>
  23. </u-modal>
  24. <u-modal
  25. v-model="cancelShow"
  26. :content="canceltext"
  27. :content-style="{ fontSize: '32rpx', lineHeight: '80rpx' }"
  28. :confirm-style="{ fontWeight: '700' }"
  29. @confirm="cancelShowBtn"
  30. @cancel="cancelBtn"
  31. :show-title="false"
  32. :show-cancel-button="true"
  33. :cancel-style="{ borderRight: '1rpx solid #EBEBEB' }"
  34. ></u-modal>
  35. <!-- 立即申请 -->
  36. <u-modal
  37. v-model="applyIsShow"
  38. :content-style="{ fontSize: '32rpx' }"
  39. @confirm="applyIsShowBtn"
  40. :show-cancel-button="true"
  41. confirm-text="立即申请"
  42. @cancel="applyIsShowCancel"
  43. :show-title="false"
  44. :cancel-style="{ borderRight: '1rpx solid #EBEBEB' }"
  45. :confirm-style="{ fontWeight: '700' }"
  46. >
  47. <view class="slot-content">
  48. <rich-text :nodes="jurisdictionText"></rich-text>
  49. </view>
  50. </u-modal>
  51. <!-- 拨打电话 -->
  52. <u-modal
  53. v-model="showhasPermission"
  54. :content-style="{ fontSize: '32rpx' }"
  55. @confirm="showhasPermissionBtn"
  56. :show-cancel-button="true"
  57. confirm-text="拨号"
  58. @cancel="showhasPermissionCancel"
  59. :show-title="false"
  60. :cancel-style="{ borderRight: '1rpx solid #EBEBEB' }"
  61. :confirm-style="{ fontWeight: '700' }"
  62. >
  63. <view class="slot-content">
  64. <rich-text :nodes="hasPermissionText"></rich-text>
  65. </view>
  66. </u-modal>
  67. <u-modal v-model="showRelation" confirm-text="知道了" :confirm-style="{ fontWeight: '700' }" :content="contentRelation"></u-modal>
  68. <!-- 修改手机号 -->
  69. <u-modal
  70. width="650"
  71. v-model="editIsShowDlg"
  72. :content-style="{ fontSize: '32rpx' }"
  73. @confirm="GoOutboundMobileBtn"
  74. :show-cancel-button="true"
  75. confirm-text="无需修改"
  76. cancel-text="前去修改"
  77. cancel-color="#3385FF"
  78. @cancel="GoOutboundMobileIsGo"
  79. :show-title="false"
  80. :cancel-style="{ borderRight: '1rpx solid #EBEBEB' }"
  81. >
  82. <view class="slot-content">
  83. <rich-text :nodes="editIsShowAccounts"></rich-text>
  84. </view>
  85. </u-modal>
  86. <u-modal
  87. v-model="mailboxBindingDlg"
  88. :content-style="{ fontSize: '32rpx' }"
  89. @confirm="gmailboxBindingDlgBtn"
  90. :show-cancel-button="true"
  91. confirm-text="设置"
  92. @cancel="cancelMailboxBindingDlg"
  93. :show-title="false"
  94. :cancel-style="{ borderRight: '1rpx solid #EBEBEB' }"
  95. :confirm-style="{ fontWeight: '700' }"
  96. >
  97. <view class="slot-content">
  98. <rich-text :nodes="mailboxText"></rich-text>
  99. </view>
  100. </u-modal>
  101. </view>
  102. </template>
  103. <script>
  104. import { activity } from "@/config/api.js";
  105. export default {
  106. data() {
  107. return {
  108. goFollowShow: false,
  109. show: false,
  110. cancelShow: false,
  111. applyIsShow: false,
  112. showRelation: false,
  113. showhasPermission: false,
  114. contentRelation: "申请已提交,请等待销售人员与您联系",
  115. content: "",
  116. accounts: "",
  117. canceltext: "",
  118. jurisdictionText: "",
  119. hasPermissionText: "",
  120. editIsShowAccounts: "",
  121. editIsShowDlg: false,
  122. mailboxBindingDlg: false,
  123. mailboxText: "您当前绑定的联系方式为邮箱,请先设置您的外呼号码",
  124. };
  125. },
  126. props: {
  127. isShow: {
  128. type: Boolean,
  129. default: false,
  130. },
  131. signupType: {
  132. type: Number,
  133. },
  134. signupStatus: {
  135. type: String,
  136. default: "Success",
  137. },
  138. goFollow: {
  139. type: Boolean,
  140. },
  141. isCancelShow: {
  142. type: Boolean,
  143. default: false,
  144. },
  145. idTypeCancel: {
  146. type: Object,
  147. },
  148. jurisdictionList: {
  149. type: Object,
  150. },
  151. applyForIsShow: {
  152. //潜在用户
  153. type: Boolean,
  154. },
  155. isShowhasPermission: {
  156. //联系销售
  157. type: Boolean,
  158. },
  159. hasPermission: {
  160. //权限字段
  161. type: String,
  162. },
  163. editIsShow: {
  164. type: Boolean,
  165. },
  166. countryCode: {
  167. type: String,
  168. },
  169. mobileEdit: {
  170. type: String,
  171. },
  172. goOnNextStep: {
  173. type: Boolean,
  174. default: false,
  175. },
  176. mailboxBinding: {
  177. type: Boolean,
  178. default: false,
  179. },
  180. },
  181. watch: {
  182. mailboxBinding() {
  183. this.mailboxBindingDlg = this.mailboxBinding;
  184. },
  185. editIsShow() {
  186. this.editIsShowDlg = this.editIsShow;
  187. if (this.editIsShow) {
  188. this.editIsShowAccounts = `
  189. 默认外呼号码是您当前绑定的手机号:<br />
  190. ${this.countryCode}-${this.mobileEdit}<br/><br/>
  191. 是否需要修改您的外呼号码?
  192. `;
  193. }
  194. },
  195. goFollow() {
  196. this.goFollowShow = this.goFollow;
  197. },
  198. isShow() {
  199. this.show = this.isShow;
  200. },
  201. signupType() {
  202. if (this.signupStatus !== "Success") return;
  203. if (this.signupType == 1) {
  204. this.content = `${this.countryCode}-${this.mobileEdit}<br/>预约成功,已加入您的活动日程 <br/><br/> 请关注【查研观向小助手】公众号,及时获取活动信息变更提醒
  205. `;
  206. this.accounts = `
  207. ${this.countryCode}-${this.mobileEdit}<br/>
  208. 预约成功,已加入您的活动日程<br/><br/>
  209. 想要及时获取活动时间变更通知,请关注【查研观向小助手】公众号
  210. `;
  211. } else if (this.signupType == 999) {
  212. this.content = "设置成功<br /> <br/>请关注【查研观向小助手】公众号,会前15分钟为您推送微信提醒";
  213. this.accounts = `设置成功,会前15分钟会为您推送微信消息提醒<br/><br/>
  214. 请关注【查研观向小助手】公众号,以获取微信消息提醒`;
  215. } else {
  216. this.content = "报名成功,已加入您的活动日程 <br/><br/> 请关注【查研观向小助手】公众号,会前1小时为您推送微信提醒";
  217. this.accounts = `
  218. 报名成功,已加入您的活动日程<br/><br/>
  219. 想要及时获取活动时间变更通知,请关注【查研观向小助手】公众号 `;
  220. }
  221. },
  222. signupStatus() {
  223. if (this.signupStatus == "Success") return;
  224. if (this.signupStatus == "FullStarffed") {
  225. this.content = "此活动报名人数已满,请留意下期活动";
  226. } else if (this.signupStatus == "TwoPeople") {
  227. this.content = "单机构最多2人报名同一活动,您所在机构报名人数已满";
  228. } else if (this.signupStatus == "BreakPromise") {
  229. this.content = "由于爽约次数过多,您暂时被限制报名资格";
  230. } else if (this.signupStatus == "Overtime") {
  231. this.content = "活动开始前1小时内无法预约,请联系对口销售处理";
  232. }
  233. },
  234. "idTypeCancel.type": {
  235. handler: function () {
  236. if (this.idTypeCancel.type == 1) {
  237. this.canceltext = "您要取消此次活动预约外呼吗?";
  238. } else {
  239. this.canceltext = "您要取消此次活动的报名吗?";
  240. }
  241. },
  242. deep: true,
  243. },
  244. isCancelShow() {
  245. this.cancelShow = this.isCancelShow;
  246. },
  247. applyForIsShow() {
  248. this.jurisdictionText = this.jurisdictionList.PopupMsg;
  249. this.applyIsShow = this.applyForIsShow;
  250. },
  251. isShowhasPermission() {
  252. this.hasPermissionText = this.jurisdictionList.PopupMsg;
  253. this.showhasPermission = this.isShowhasPermission;
  254. },
  255. },
  256. methods: {
  257. contentBtn() {
  258. this.$parent.isShow = false;
  259. this.show = false;
  260. this.$emit("cancelShowBtn", this.idTypeCancel, this.signupType, this.idTypeCancel.isNum);
  261. },
  262. //去关注
  263. goFollowShowBtn() {
  264. this.$parent.goFollow = false;
  265. this.goFollowShow = false;
  266. this.$emit("cancelShowBtn", this.idTypeCancel, this.signupType, this.idTypeCancel.isNum);
  267. uni.navigateTo({
  268. url: "/activityPages/accountsOfficial/accountsOfficial",
  269. });
  270. },
  271. cancel() {
  272. this.$parent.goFollow = false;
  273. this.goFollowShow = false;
  274. this.$emit("cancelShowBtn", this.idTypeCancel, this.signupType, this.idTypeCancel.isNum);
  275. },
  276. cancelBtn() {
  277. this.$parent.isCancelShow = false;
  278. this.cancelShow = false;
  279. },
  280. cancelShowBtn() {
  281. activity
  282. .signupCancel({
  283. ActivityId: this.idTypeCancel.id,
  284. SignupType: this.idTypeCancel.type,
  285. })
  286. .then((res) => {
  287. if (res.Ret == 200) {
  288. this.idTypeCancel.cutId = res.Data.ActivityId;
  289. if (this.signupType == 1) {
  290. uni.showToast({
  291. title: "预约外呼已取消",
  292. duration: 2000,
  293. });
  294. } else {
  295. uni.showToast({
  296. title: "已取消报名",
  297. duration: 2000,
  298. });
  299. }
  300. this.$emit("cancelShowBtn", this.idTypeCancel, this.signupType, this.idTypeCancel.isNum);
  301. }
  302. this.$parent.isCancelShow = false;
  303. this.cancelShow = false;
  304. });
  305. },
  306. //立即申请
  307. applyIsShowBtn() {
  308. this.applyIsShow = false;
  309. this.$parent.applyForIsShow = false;
  310. if (this.hasPermission == 3) {
  311. uni.navigateTo({
  312. url: "/pageMy/applyTrial/applyTrial",
  313. });
  314. } else if (this.hasPermission == 4) {
  315. this.showRelation = true;
  316. }
  317. },
  318. applyIsShowCancel() {
  319. this.applyIsShow = false;
  320. this.$parent.applyForIsShow = false;
  321. },
  322. showhasPermissionBtn() {
  323. uni.makePhoneCall({
  324. phoneNumber: this.jurisdictionList.SellerMobile, //仅为示例
  325. });
  326. this.showhasPermission = false;
  327. this.$parent.isShowhasPermission = false;
  328. },
  329. showhasPermissionCancel() {
  330. this.showhasPermission = false;
  331. this.$parent.isShowhasPermission = false;
  332. },
  333. GoOutboundMobileBtn() {
  334. this.$parent.editIsShow = false;
  335. this.editIsShowDlg = false;
  336. if (this.goOnNextStep) {
  337. this.goFollowShow = true;
  338. } else {
  339. this.show = true;
  340. }
  341. },
  342. GoOutboundMobileIsGo() {
  343. this.$parent.editIsShow = false;
  344. this.editIsShowDlg = false;
  345. this.$emit("cancelShowBtn", this.idTypeCancel, this.signupType, this.idTypeCancel.isNum);
  346. uni.navigateTo({
  347. url:
  348. "/activityPages/editOutbound/editOutbound?title=修改外呼号码&identification=修改&goOnNextStep=" +
  349. this.goOnNextStep +
  350. "&id=" +
  351. this.idTypeCancel.cutId +
  352. "&cellphone=" +
  353. this.countryCode +
  354. "-" +
  355. this.mobileEdit,
  356. });
  357. },
  358. gmailboxBindingDlgBtn() {
  359. this.$parent.mailboxBinding = false;
  360. this.mailboxBindingDlg = false;
  361. this.$parent.signupType = "";
  362. uni.navigateTo({
  363. url: "/activityPages/editOutbound/editOutbound?title=设置外呼号码&identification=邮箱&goOnNextStep=" + this.goOnNextStep + "&id=" + this.idTypeCancel.cutId,
  364. });
  365. },
  366. cancelMailboxBindingDlg() {
  367. this.$parent.mailboxBinding = false;
  368. this.mailboxBindingDlg = false;
  369. },
  370. },
  371. };
  372. </script>
  373. <style scoped lang="scss">
  374. .slot-content {
  375. width: 100%;
  376. padding: 50rpx;
  377. text-align: center;
  378. font-size: 32rpx;
  379. color: #0f1826;
  380. line-height: 48rpx;
  381. }
  382. .u-model__footer__button.data-v-3626fcec {
  383. border-right: 1rpx solid #333;
  384. }
  385. </style>