create.vue 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867
  1. <!--
  2. * @Author: liuzhenlin 461480418@qq.ocm
  3. * @Date: 2023-01-12 11:57:48
  4. * @LastEditors: liuzhenlin
  5. * @LastEditTime: 2023-02-22 13:56:08
  6. * @Description: file content
  7. * @FilePath: \oms\pages\project\create.vue
  8. -->
  9. <template>
  10. <view class="home">
  11. <view class="nav">
  12. <view :style="{ paddingTop }">
  13. <view class="title" :style="[{ height }, { lineHeight: height }]">
  14. <view class="back" @click="goBack()">
  15. <u-icon name="arrow-left" color="#ffffff" size="22"></u-icon>
  16. </view>
  17. <text>项目创建</text>
  18. </view>
  19. </view>
  20. </view>
  21. <view class="main">
  22. <view class="step1" v-if="step == 1">
  23. <u-form :model="addForm" :rules="rules" ref="addForm" label-width="0">
  24. <u-form-item prop="custName" borderBottom customStyle="padding:40rpx 0 30rpx" @click="$refs.cust.open()">
  25. <view class="form-label flex_l">
  26. <view class="label-tag"></view>
  27. 选择客户
  28. </view>
  29. <u-input
  30. v-model="addForm.custName"
  31. disabled
  32. disabledColor="#ffffff"
  33. placeholder="请选择关联客户"
  34. border="none"></u-input>
  35. <u-icon slot="right" name="arrow-right"></u-icon>
  36. </u-form-item>
  37. <u-form-item prop="nboName" borderBottom customStyle="padding:40rpx 0 30rpx">
  38. <view class="form-label flex_l">
  39. <view class="label-tag"></view>
  40. 项目名称
  41. </view>
  42. <u-input
  43. placeholder="输入项目名称"
  44. v-model="addForm.nboName"
  45. border="none"
  46. suffixIconStyle="color:#CDCDCD"
  47. clearable
  48. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  49. </u-form-item>
  50. <u-form-item
  51. prop="nboSourceVal"
  52. borderBottom
  53. customStyle="padding:40rpx 0 30rpx"
  54. @click="showNboSource = true">
  55. <view class="form-label flex_l">
  56. <view class="label-tag"></view>
  57. 项目来源
  58. </view>
  59. <u-input
  60. :readonly="true"
  61. placeholder="请选择项目来源"
  62. v-model="addForm.nboSourceVal"
  63. border="none"
  64. suffixIcon="arrow-down"
  65. suffixIconStyle="color:#CDCDCD"
  66. clearable
  67. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  68. </u-form-item>
  69. <u-form-item prop="contactName" borderBottom customStyle="padding:40rpx 0 30rpx" @click="openContactUser()">
  70. <view class="form-label flex_l">
  71. <view class="label-tag"></view>
  72. 主要联系人
  73. </view>
  74. <u-input
  75. :readonly="true"
  76. placeholder="请选择主要联系人"
  77. v-model="addForm.contactName"
  78. border="none"
  79. suffixIcon="arrow-down"
  80. suffixIconStyle="color:#CDCDCD"
  81. clearable
  82. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  83. </u-form-item>
  84. <u-form-item borderBottom customStyle="padding:40rpx 0 30rpx">
  85. <view class="form-label flex_l">职位</view>
  86. <u-input
  87. placeholder="请输入职位"
  88. v-model="addForm.contactPostion"
  89. border="none"
  90. suffixIconStyle="color:#CDCDCD"
  91. clearable
  92. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  93. </u-form-item>
  94. <u-form-item borderBottom customStyle="padding:40rpx 0 30rpx">
  95. <view class="form-label flex_l">联系电话</view>
  96. <u-input
  97. placeholder="请输入联系电话"
  98. v-model="addForm.contactTelephone"
  99. border="none"
  100. suffixIconStyle="color:#CDCDCD"
  101. clearable
  102. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  103. </u-form-item>
  104. <!-- <u-form-item prop="saleName" borderBottom customStyle="padding:40rpx 0 30rpx" @click="$refs.user.open()">
  105. <view class="form-label flex_l">
  106. <view class="label-tag"></view>
  107. 销售工程师
  108. </view>
  109. <u-input
  110. :readonly="true"
  111. placeholder="请选择销售工程师"
  112. v-model="addForm.saleName"
  113. border="none"
  114. suffixIcon="arrow-down"
  115. suffixIconStyle="color:#CDCDCD"
  116. clearable
  117. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  118. </u-form-item> -->
  119. <u-form-item prop="salesVal" borderBottom customStyle="padding:40rpx 0 30rpx" @click="showModel = true">
  120. <view class="form-label flex_l">
  121. <view class="label-tag"></view>
  122. 销售模式
  123. </view>
  124. <u-input
  125. :readonly="true"
  126. placeholder="请选择销售模式"
  127. v-model="addForm.salesVal"
  128. border="none"
  129. suffixIcon="arrow-down"
  130. suffixIconStyle="color:#CDCDCD"
  131. clearable
  132. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  133. </u-form-item>
  134. <u-form-item borderBottom customStyle="padding:40rpx 0 30rpx" @click="$refs.dealer.open()">
  135. <view class="form-label flex_l">
  136. <view class="label-tag"></view>
  137. 经销商/代理商
  138. </view>
  139. <u-input
  140. :readonly="true"
  141. placeholder="请选择经销商/代理商"
  142. v-model="addForm.distributorName"
  143. border="none"
  144. suffixIcon="arrow-down"
  145. suffixIconStyle="color:#CDCDCD"
  146. clearable
  147. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  148. </u-form-item>
  149. <u-form-item prop="productLineVal" borderBottom customStyle="padding:40rpx 0 30rpx" @click="showLine = true">
  150. <view class="form-label flex_l">
  151. <view class="label-tag"></view>
  152. 产品线
  153. </view>
  154. <u-input
  155. :readonly="true"
  156. placeholder="请选择产品线"
  157. v-model="addForm.productLineVal"
  158. border="none"
  159. suffixIcon="arrow-down"
  160. suffixIconStyle="color:#CDCDCD"
  161. clearable
  162. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  163. </u-form-item>
  164. <u-form-item borderBottom customStyle="padding:40rpx 0 30rpx" @click="showSource = true">
  165. <view class="form-label flex_l">项目预算</view>
  166. <u-input
  167. type="number"
  168. placeholder="输入项目预算"
  169. v-model="addForm.nboBudget"
  170. border="none"
  171. suffixIconStyle="color:#CDCDCD"
  172. clearable
  173. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  174. </u-form-item>
  175. <u-form-item prop="isBigVal" borderBottom customStyle="padding:40rpx 0 30rpx" @click="showLarge = true">
  176. <view class="form-label flex_l">
  177. <view class="label-tag"></view>
  178. 是否大项目
  179. </view>
  180. <u-input
  181. :readonly="true"
  182. placeholder="请选择是否大项目"
  183. v-model="addForm.isBigVal"
  184. border="none"
  185. suffixIcon="arrow-down"
  186. suffixIconStyle="color:#CDCDCD"
  187. clearable
  188. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  189. </u-form-item>
  190. <u-form-item borderBottom customStyle="padding:40rpx 0 30rpx" @click="showEstTransDate = true">
  191. <view class="form-label flex_l">预计成交时间</view>
  192. <u-input
  193. :readonly="true"
  194. placeholder="请选择预计成交时间"
  195. v-model="addForm.estTransTime"
  196. border="none"
  197. suffixIcon="arrow-down"
  198. suffixIconStyle="color:#CDCDCD"
  199. clearable
  200. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  201. </u-form-item>
  202. <u-form-item borderBottom customStyle="padding:40rpx 0 30rpx" @click="showPlanDate = true">
  203. <view class="form-label flex_l">计划采购时间</view>
  204. <u-input
  205. :readonly="true"
  206. placeholder="请选择计划采购时间"
  207. v-model="addForm.planPurchaseTime"
  208. border="none"
  209. suffixIcon="arrow-down"
  210. suffixIconStyle="color:#CDCDCD"
  211. clearable
  212. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  213. </u-form-item>
  214. <u-form-item borderBottom customStyle="padding:40rpx 0 30rpx" @click="showDate = true">
  215. <view class="form-label flex_l">风险情况</view>
  216. <u-input
  217. placeholder="输入风险情况"
  218. v-model="addForm.riskProfile"
  219. border="none"
  220. suffixIconStyle="color:#CDCDCD"
  221. clearable
  222. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  223. </u-form-item>
  224. <u-form-item borderBottom customStyle="padding:40rpx 0 30rpx" @click="showDate = true">
  225. <view class="form-label flex_l">困难点</view>
  226. <u-input
  227. placeholder="输入困难点"
  228. v-model="addForm.difficulty"
  229. border="none"
  230. suffixIconStyle="color:#CDCDCD"
  231. clearable
  232. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  233. </u-form-item>
  234. <u-form-item borderBottom customStyle="padding:40rpx 0 30rpx" @click="showDate = true">
  235. <view class="form-label flex_l">竞争公司</view>
  236. <u-input
  237. placeholder="输入竞争公司"
  238. v-model="addForm.competitor"
  239. border="none"
  240. suffixIconStyle="color:#CDCDCD"
  241. clearable
  242. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  243. </u-form-item>
  244. <u-form-item borderBottom customStyle="padding:40rpx 0 30rpx" @click="showDate = true">
  245. <view class="form-label flex_l">介入情况</view>
  246. <u-input
  247. placeholder="输入介入情况"
  248. v-model="addForm.intervention"
  249. border="none"
  250. suffixIconStyle="color:#CDCDCD"
  251. clearable
  252. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  253. </u-form-item>
  254. <u-form-item borderBottom customStyle="padding:40rpx 0 30rpx">
  255. <view class="form-label flex_l">
  256. <view class="label-tag"></view>
  257. 备注
  258. </view>
  259. <u-input
  260. placeholder="输入备注"
  261. v-model="addForm.remark"
  262. border="none"
  263. clearable
  264. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  265. </u-form-item>
  266. </u-form>
  267. </view>
  268. <view class="step2" v-else-if="step == 2">
  269. <view class="step-tit">添加产品</view>
  270. <view class="add-btn" @click="$refs.product.open()">+</view>
  271. <view class="product-wrap">
  272. <view class="product-item" v-for="(v, i) in productList" :key="v.id">
  273. <view class="product-label flex_l">
  274. 产品编码:
  275. <view class="product-val">{{ v.prodCode }}</view>
  276. </view>
  277. <view class="product-label flex_l">
  278. 产品名称:
  279. <view class="product-val">{{ v.prodName }}</view>
  280. </view>
  281. <view class="product-label flex_l">
  282. 产品类别:
  283. <view class="product-val">{{ v.prodClass }}</view>
  284. </view>
  285. <view class="product-label flex_l">
  286. 产品单价:
  287. <view class="product-val">
  288. <u-input v-model="productList[i].guidPrice" clearable></u-input>
  289. </view>
  290. </view>
  291. <view class="product-label flex_l">
  292. 产品数量:
  293. <view class="product-val">
  294. <u-input v-model="productList[i].prodNum" clearable></u-input>
  295. </view>
  296. </view>
  297. </view>
  298. </view>
  299. </view>
  300. <!-- <view class="step3" v-else-if="step == 3">
  301. <u-form :model="addForm" :rules="rules" ref="addForm" label-width="0">
  302. <u-form-item
  303. prop="followTime"
  304. borderBottom
  305. customStyle="padding:40rpx 0 30rpx"
  306. @click="showFollowDate = true">
  307. <view class="form-label flex_l">
  308. <view class="label-tag"></view>
  309. 跟进时间
  310. </view>
  311. <u-input
  312. :readonly="true"
  313. placeholder="请选择跟进时间"
  314. v-model="addForm.followTime"
  315. border="none"
  316. suffixIcon="arrow-down"
  317. suffixIconStyle="color:#CDCDCD"
  318. clearable
  319. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  320. </u-form-item>
  321. <u-form-item
  322. prop="followUserName"
  323. borderBottom
  324. customStyle="padding:40rpx 0 30rpx"
  325. @click="$refs.allUser.open()">
  326. <view class="form-label flex_l">
  327. <view class="label-tag"></view>
  328. 负责人员
  329. </view>
  330. <u-input
  331. :readonly="true"
  332. placeholder="请选择负责人员"
  333. v-model="addForm.followUserName"
  334. border="none"
  335. suffixIcon="arrow-down"
  336. suffixIconStyle="color:#CDCDCD"
  337. clearable
  338. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  339. </u-form-item>
  340. <u-form-item prop="followContent" borderBottom customStyle="padding:40rpx 0 30rpx">
  341. <view class="form-label flex_l">
  342. <view class="label-tag"></view>
  343. 跟进内容
  344. </view>
  345. <u-input
  346. placeholder="请输入跟进内容"
  347. v-model="addForm.followContent"
  348. border="none"
  349. clearable
  350. customStyle="padding: 0 30rpx 0 12rpx"></u-input>
  351. </u-form-item>
  352. </u-form>
  353. </view> -->
  354. <view class="center">
  355. <view class="handle-btn" v-if="step > 1" @click="previousStep">上一步</view>
  356. <view class="handle-btn" v-if="step < 2" @click="nextStep">下一步</view>
  357. <view class="handle-btn" v-if="step == 2" @click="handleAdd">保存</view>
  358. </view>
  359. </view>
  360. <!-- 选择下次时间 -->
  361. <u-datetime-picker
  362. v-if="showEstTransDate"
  363. :show="showEstTransDate"
  364. mode="datetime"
  365. v-model="addForm.estTransTime"
  366. @cancel="showEstTransDate = false"
  367. @confirm="pickEstTransDate"></u-datetime-picker>
  368. <!-- 计划采购时间 -->
  369. <u-datetime-picker
  370. v-if="showPlanDate"
  371. :show="showPlanDate"
  372. mode="datetime"
  373. v-model="addForm.planPurchaseTime"
  374. @cancel="showPlanDate = false"
  375. @confirm="pickPlanDate"></u-datetime-picker>
  376. <!-- 跟进时间 -->
  377. <u-datetime-picker
  378. v-if="showFollowDate"
  379. :show="showFollowDate"
  380. mode="datetime"
  381. v-model="addForm.followTime"
  382. @cancel="showFollowDate = false"
  383. @confirm="pickFollowDate"></u-datetime-picker>
  384. <!-- 选择客户 -->
  385. <select-customer ref="cust" @close="closeCust()"></select-customer>
  386. <!-- 选择客户联系人 -->
  387. <customer-contact ref="contact" @close="closeContact()"></customer-contact>
  388. <!-- 选择销售 -->
  389. <select-user ref="user" :query-params="{ roles: ['Sales', 'SalesManager'] }" @close="closeUser()"></select-user>
  390. <!-- 选择经销商 -->
  391. <select-dealer ref="dealer" @close="closeDealer()"></select-dealer>
  392. <!-- 选择用户 -->
  393. <select-user ref="allUser" @close="closeAllUser()"></select-user>
  394. <!-- 选择产品 -->
  395. <select-product ref="product" @close="closeProduct()"></select-product>
  396. <!-- 项目来源 -->
  397. <u-picker
  398. :show="showNboSource"
  399. :columns="nboSourceColumns"
  400. keyName="value"
  401. @cancel="showNboSource = false"
  402. @confirm="pickSource"></u-picker>
  403. <!-- 产品线 -->
  404. <u-picker
  405. :show="showLine"
  406. :columns="productLineColumns"
  407. keyName="value"
  408. @cancel="showLine = false"
  409. @confirm="pickLine"></u-picker>
  410. <!-- 销售模式 -->
  411. <u-picker
  412. :show="showModel"
  413. :columns="salesModelColumns"
  414. keyName="value"
  415. @cancel="showModel = false"
  416. @confirm="pickModel"></u-picker>
  417. <!-- 大项目 -->
  418. <u-picker
  419. :show="showLarge"
  420. :columns="yesOrNoColumns"
  421. keyName="value"
  422. @cancel="showLarge = false"
  423. @confirm="pickLarge"></u-picker>
  424. <u-notify ref="uNotify"></u-notify>
  425. <u-toast ref="uToast"></u-toast>
  426. </view>
  427. </template>
  428. <script>
  429. import { mapGetters } from 'vuex'
  430. import projectApi from 'api/project'
  431. import customerApi from '../../api/customer'
  432. import to from 'await-to-js'
  433. import SelectCustomer from 'components/SelectCustomer'
  434. import CustomerContact from 'components/CustomerContact'
  435. import SelectUser from 'components/SelectUser'
  436. import SelectDealer from 'components/SelectDealer'
  437. import SelectProduct from 'components/SelectProduct'
  438. export default {
  439. name: 'omsIndex',
  440. components: { SelectCustomer, CustomerContact, SelectUser, SelectDealer, SelectProduct },
  441. data() {
  442. const validateDistributor = (rule, value, callback) => {
  443. if ('' === value && this.form.salesModel !== '10')
  444. callback(
  445. new Error(
  446. this.$refs.uNotify.show({
  447. top: this.height + this.paddingTop + 10,
  448. type: 'warning',
  449. message: '请选择经销商/代理商',
  450. duration: 1000 * 3,
  451. })
  452. )
  453. )
  454. else callback()
  455. }
  456. return {
  457. step: 1,
  458. height: '',
  459. paddingTop: '',
  460. showNboSource: false, //项目来源选择
  461. showModel: false, //销售模式选择
  462. showLine: false, //产品线选择
  463. showLarge: false, //是否是大项目选择
  464. nboSourceColumns: [], //项目来源
  465. salesModelColumns: [], //销售模式
  466. productLineColumns: [], //产品线
  467. yesOrNoColumns: [], //是否是大项目
  468. showEstTransDate: false, //选择预计成交时间
  469. showPlanDate: false, //计划采购时间
  470. showFollowDate: false, //计划采购时间
  471. addForm: {
  472. nboName: '', //项目名称
  473. custId: '', //关联客户id
  474. custName: '', //关联客户
  475. nboSource: '', //项目来源
  476. nboSourceVal: '', //项目来源文字
  477. contactId: '', //联系人id
  478. contactName: '', //联系人姓名
  479. contactPostion: '', //联系人职位
  480. contactTelephone: '', //联系人电话
  481. saleName: '', //销售工程师
  482. saleId: '', //销售工程师id
  483. salesModel: '', //销售模式(10直销20经销30代理)
  484. salesVal: '', //销售模式文字
  485. distributorId: '', //经销商/代理商ID
  486. distributorName: '', //经销商/代理商名称
  487. productLine: '', //产品线来源
  488. productLineVal: '', //产品线文字
  489. nboBudget: '', //项目预算
  490. isBig: '', //是否是大项目
  491. isBigVal: '', //是否是大项目文字
  492. estTransTime: this.parseTime(new Date(), '{y}-{m}-{d} {h}:{i}'), //预计成交时间
  493. planPurchaseTime: this.parseTime(new Date(), '{y}-{m}-{d} {h}:{i}'), //计划采购时间
  494. riskProfile: '', //风险情况
  495. difficulty: '', //困难点
  496. competitor: '', //竞争公司
  497. intervention: '', //介入情况
  498. remark: '', //备注
  499. // followTime: this.parseTime(new Date(), '{y}-{m}-{d} {h}:{i}'), //跟进时间
  500. // followUserId: '', //跟进用户id
  501. // followUserName: '', //跟进用户id
  502. // followContent: '', //跟进内容
  503. },
  504. rules: {
  505. nboName: [{ required: true, trigger: ['blur', 'change'], message: '请输入项目名称' }],
  506. custName: [{ required: true, trigger: ['blur', 'change'], message: '请选择关联客户' }],
  507. nboSourceVal: [{ required: true, trigger: ['blur', 'change'], message: '请选择项目来源' }],
  508. contactName: [{ required: true, trigger: ['blur', 'change'], message: '请选择主要联系人' }],
  509. // saleName: [{ required: true, trigger: ['blur', 'change'], message: '请选择销售工程师' }],
  510. salesModelVal: [{ required: true, trigger: ['blur', 'change'], message: '请选择销售模式' }],
  511. distributorName: [
  512. { validator: validateDistributor, trigger: ['blur', 'change'], message: '请选择经销商/代理商' },
  513. ],
  514. isBigVal: [{ required: true, trigger: ['blur', 'change'], message: '请选择是否大项目' }],
  515. productLineVal: [{ required: true, trigger: ['blur', 'change'], message: '请选择产品线' }],
  516. // 跟进
  517. // followTime: [{ required: true, trigger: ['blur', 'change'], message: '请输入跟进时间' }],
  518. // followContent: [{ required: true, trigger: ['blur', 'change'], message: '请输入跟进内容' }],
  519. },
  520. productList: [],
  521. }
  522. },
  523. computed: {
  524. ...mapGetters(['userId', 'username']),
  525. },
  526. onLoad(option) {
  527. console.log(option.id) //打印出上个页面传递的参数。
  528. this.addForm.custId = parseInt(option.id)
  529. },
  530. created() {
  531. const navData = uni.getMenuButtonBoundingClientRect()
  532. this.height = navData.height + 'px'
  533. this.paddingTop = navData.top + 'px'
  534. },
  535. onShow() {
  536. if (this.addForm.custId) {
  537. this.getCustomerDetail()
  538. }
  539. this.getOptions()
  540. },
  541. methods: {
  542. getOptions() {
  543. Promise.all([
  544. this.getDicts('proj_nbo_source'),
  545. this.getDicts('proj_sales_model'),
  546. this.getDicts('sys_product_line'),
  547. this.getDicts('sys_yes_no'),
  548. ]).then(([nboSource, salesModel, productLine, yesOrNo]) => {
  549. this.nboSourceColumns = [nboSource.data.values] || []
  550. this.salesModelColumns = [salesModel.data.values] || []
  551. this.productLineColumns = [productLine.data.values] || []
  552. this.yesOrNoColumns = [yesOrNo.data.values] || []
  553. })
  554. },
  555. async getCustomerDetail() {
  556. const [err, res] = await to(customerApi.getDetail({ ids: [this.addForm.custId] }))
  557. if (err) return
  558. if (res && res.code == 200) {
  559. console.log(res)
  560. this.addForm.custName = res.data.list[0].custName
  561. this.addForm.nboName = this.addForm.custName
  562. }
  563. },
  564. // 打开主要联系人
  565. openContactUser() {
  566. if (!this.addForm.custId) {
  567. this.$refs.uNotify.show({
  568. top: this.height + this.paddingTop + 10,
  569. type: 'warning',
  570. message: '请先选择客户',
  571. duration: 1000 * 3,
  572. })
  573. } else {
  574. this.$refs.contact.open(this.addForm.custId)
  575. }
  576. },
  577. // 关闭选择客户
  578. closeCust(user) {
  579. if (user) {
  580. console.log(user)
  581. this.addForm.custId = user.id
  582. this.addForm.custName = user.name
  583. }
  584. },
  585. // 经销商
  586. closeDealer(dealer) {
  587. if (dealer) {
  588. console.log(dealer)
  589. this.addForm.distributorId = dealer.id
  590. this.addForm.distributorName = dealer.name
  591. }
  592. },
  593. // 关闭选择客户联系人
  594. closeContact(user) {
  595. if (user) {
  596. console.log(user)
  597. this.addForm.contactId = user.id
  598. this.addForm.contactName = user.label
  599. this.addForm.contactPostion = user.postion
  600. this.addForm.contactTelephone = user.telephone
  601. }
  602. },
  603. // 关闭选择销售
  604. closeUser(user) {
  605. if (user) {
  606. console.log(user)
  607. this.addForm.saleId = user.id
  608. this.addForm.saleName = user.label
  609. }
  610. },
  611. // 全部用户
  612. closeAllUser(user) {
  613. if (user) {
  614. console.log(user)
  615. this.addForm.followUserId = user.id
  616. this.addForm.followUserName = user.label
  617. }
  618. },
  619. closeProduct(product) {
  620. let data = [...this.productList, ...product]
  621. this.productList = data
  622. console.log(this.productList)
  623. },
  624. // 选择来源
  625. pickSource(e) {
  626. this.addForm.nboSource = e.value[0].key
  627. this.addForm.nboSourceVal = e.value[0].value
  628. this.showNboSource = false
  629. },
  630. // 选择产品线
  631. pickLine(e) {
  632. this.addForm.productLine = e.value[0].key
  633. this.addForm.productLineVal = e.value[0].value
  634. this.showLine = false
  635. },
  636. // 选择销售类型
  637. pickModel(e) {
  638. this.addForm.salesModel = e.value[0].key
  639. this.addForm.salesVal = e.value[0].value
  640. this.showModel = false
  641. },
  642. // 是否大项目
  643. pickLarge(e) {
  644. this.addForm.isBig = e.value[0].key
  645. this.addForm.isBigVal = e.value[0].value
  646. this.showLarge = false
  647. },
  648. // 选择预计成交时间
  649. async pickEstTransDate(e) {
  650. this.showEstTransDate = false
  651. const timeFormat = uni.$u.timeFormat
  652. let timeValue = await timeFormat(e.value, 'yyyy-mm-dd hh:MM')
  653. this.addForm.estTransTime = timeValue
  654. console.log(timeValue)
  655. },
  656. // 计划采购时间
  657. async pickPlanDate(e) {
  658. this.showPlanDate = false
  659. const timeFormat = uni.$u.timeFormat
  660. let timeValue = await timeFormat(e.value, 'yyyy-mm-dd hh:MM')
  661. this.addForm.planPurchaseTime = timeValue
  662. console.log(timeValue)
  663. },
  664. // 跟进时间
  665. async pickFollowDate(e) {
  666. this.showFollowDate = false
  667. const timeFormat = uni.$u.timeFormat
  668. let timeValue = await timeFormat(e.value, 'yyyy-mm-dd hh:MM')
  669. this.addForm.followTime = timeValue
  670. console.log(timeValue)
  671. },
  672. nextStep() {
  673. if (this.step == 1) {
  674. this.$refs.addForm
  675. .validate()
  676. .then(async () => {
  677. this.step++
  678. })
  679. .catch((err) => {
  680. console.log(err)
  681. this.$refs.uNotify.show({
  682. top: this.height + this.paddingTop + 10,
  683. type: 'warning',
  684. message: err[0].message,
  685. duration: 1000 * 3,
  686. })
  687. })
  688. } else if (this.step == 2) {
  689. if (this.productList.length == 0) {
  690. this.$refs.uNotify.show({
  691. top: this.height + this.paddingTop + 10,
  692. type: 'warning',
  693. message: '请选择产品',
  694. duration: 1000 * 3,
  695. })
  696. return
  697. }
  698. this.step++
  699. }
  700. },
  701. previousStep() {
  702. if (this.step > 1) {
  703. this.step--
  704. }
  705. },
  706. handleAdd() {
  707. this.$refs.addForm
  708. .validate()
  709. .then(async () => {
  710. console.log(this.addForm)
  711. let params = this.addForm
  712. params.nboBudget = Number(params.nboBudget)
  713. params.saleName = this.username
  714. params.saleId = this.userId
  715. let products = this.productList.map((item) => ({
  716. ProdId: item.id,
  717. ProdName: item.prodName,
  718. ProdCode: item.prodCode,
  719. ProdClass: item.prodClass,
  720. ProdNum: Number(item.prodNum),
  721. ProdPrice: Number(item.guidPrice),
  722. }))
  723. params.products = products
  724. const [err, res] = await to(projectApi.create(params))
  725. if (err) return
  726. if (res && res.code == 200) {
  727. this.$refs.uToast.show({
  728. type: 'success',
  729. message: '创建成功',
  730. complete: () => {
  731. this.goBack()
  732. },
  733. })
  734. }
  735. })
  736. .catch((err) => {
  737. console.log(err)
  738. this.$refs.uNotify.show({
  739. top: this.height + this.paddingTop + 10,
  740. type: 'warning',
  741. message: err[0].message,
  742. duration: 1000 * 3,
  743. })
  744. })
  745. },
  746. goBack() {
  747. uni.navigateBack({
  748. //关闭当前页面,返回上一页面或多级页面。
  749. delta: 1,
  750. })
  751. },
  752. },
  753. }
  754. </script>
  755. <style>
  756. page {
  757. background: #f2f3f5;
  758. }
  759. </style>
  760. <style lang="scss" scoped>
  761. .home {
  762. padding-top: 188rpx;
  763. .nav {
  764. position: absolute;
  765. left: 0;
  766. top: 0;
  767. width: 100%;
  768. height: 284rpx;
  769. background: #3c9cff;
  770. .title {
  771. position: relative;
  772. text-align: center;
  773. font-size: 32rpx;
  774. font-weight: bold;
  775. color: #ffffff;
  776. .back {
  777. position: absolute;
  778. top: 0;
  779. bottom: 0;
  780. margin: auto;
  781. left: 70rpx;
  782. display: flex;
  783. }
  784. }
  785. }
  786. .main {
  787. position: absolute;
  788. width: 100%;
  789. height: calc(100vh - 188rpx);
  790. background: #ffffff;
  791. box-shadow: 0 6rpx 19rpx 2rpx rgba(0, 45, 132, 0.15);
  792. border-radius: 31rpx 31rpx 0 0;
  793. padding: 0 32rpx;
  794. overflow: auto;
  795. padding-bottom: 64rpx;
  796. .step-tit {
  797. text-align: center;
  798. line-height: 60rpx;
  799. font-size: 26rpx;
  800. color: #000;
  801. }
  802. .form-label {
  803. font-size: 32rpx;
  804. font-weight: bold;
  805. color: #323232;
  806. padding-bottom: 18rpx;
  807. .label-tag {
  808. width: 15rpx;
  809. height: 15rpx;
  810. background: #ff4d4f;
  811. border-radius: 50%;
  812. margin-right: 10rpx;
  813. }
  814. }
  815. .handle-btn {
  816. width: 234rpx;
  817. height: 92rpx;
  818. background: #3c9cff;
  819. border-radius: 31rpx;
  820. margin: 30rpx auto 0;
  821. font-size: 32rpx;
  822. color: #ffffff;
  823. text-align: center;
  824. line-height: 92rpx;
  825. }
  826. }
  827. .step1 {
  828. width: 100%;
  829. height: calc(100% - 124rpx);
  830. overflow: auto;
  831. }
  832. .step2 {
  833. width: 100%;
  834. height: calc(100% - 124rpx);
  835. .product-wrap {
  836. width: 100%;
  837. margin-top: 30rpx;
  838. height: calc(100% - 150rpx);
  839. overflow: auto;
  840. .product-item {
  841. margin: 30rpx 0;
  842. padding: 20rpx;
  843. border-radius: 10px;
  844. box-shadow: 0 6rpx 19rpx 2rpx rgba(0, 45, 132, 0.15);
  845. .product-label {
  846. padding: 20rpx 0 20rpx 20rpx;
  847. }
  848. }
  849. }
  850. .add-btn {
  851. color: #fff;
  852. width: 120rpx;
  853. height: 60rpx;
  854. padding: 0rpx 8rpx;
  855. font-size: 12rpx;
  856. background: #3c9cff;
  857. border-radius: 3px;
  858. text-align: center;
  859. line-height: 58rpx;
  860. font-size: 44rpx;
  861. }
  862. }
  863. }
  864. </style>