add.vue 39 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972
  1. <template>
  2. <div>
  3. <el-button size="small" type="primary" @click="show">新 建</el-button>
  4. <el-drawer
  5. title="新建客户"
  6. :visible.sync="dialogFormVisible"
  7. size="600px"
  8. direction="rtl"
  9. :show-close="false"
  10. append-to-body
  11. @close="onClose">
  12. <div class="drawer__panel">
  13. <el-row :gutter="20">
  14. <el-form :model="form" :rules="rules" ref="form" label-width="100px" label-position="right" size="mini">
  15. <el-col :span="20">
  16. <el-form-item label="客户名称:" prop="enterprisename">
  17. <el-input v-model="form.enterprisename" placeholder="请输入客户名称" style="width: 100%"></el-input>
  18. </el-form-item>
  19. </el-col>
  20. <el-col :span="4">
  21. <el-popover
  22. placement="right"
  23. width="900"
  24. v-model="businessShow"
  25. trigger="manual">
  26. <el-input
  27. style="width:300px;margin-bottom: 10px"
  28. placeholder="请输入内容"
  29. v-model="form.enterprisename"
  30. clearable
  31. @clear="businessSearch"
  32. size="mini"
  33. @keyup.enter.native="businessSearch">
  34. <i slot="prefix" class="el-icon-search" @click="businessSearch"></i>
  35. </el-input>
  36. <el-table :data="businessData" @row-click="businessSelect" :header-cell-style="{background:'#EEEEEE',color:'#333'}" size="mini">
  37. <el-table-column width="260" label="客户名称">
  38. <template slot-scope="scope">
  39. <span style="margin-left: 10px">{{ scope.row.companyName?scope.row.companyName:'--' }}</span>
  40. </template>
  41. </el-table-column>
  42. <el-table-column label="客户地址">
  43. <template slot-scope="scope">
  44. <span style="margin-left: 10px">{{ scope.row.address?scope.row.address:'--' }}</span>
  45. </template>
  46. </el-table-column>
  47. <el-table-column width="200" label="客户税号">
  48. <template slot-scope="scope">
  49. <span style="margin-left: 10px">{{ scope.row.taxNum?scope.row.taxNum:'--' }}</span>
  50. </template>
  51. </el-table-column>
  52. </el-table>
  53. <el-button size="mini" type="primary" style="width: 100%" @click="businessSearch" slot="reference" :disabled="form.enterprisename === ''">工商查询</el-button>
  54. </el-popover>
  55. </el-col>
  56. <el-col :span="24">
  57. <el-form-item label="企业简称:" prop="abbreviation">
  58. <el-input v-model="form.abbreviation" placeholder="请输入企业简称" style="width: 100%"></el-input>
  59. </el-form-item>
  60. </el-col>
  61. <!-- <el-col :span="24">
  62. <el-form-item label="erp编号:" prop="erpagentnum">
  63. <el-input v-model="form.erpagentnum" placeholder="请输入erp编号" style="width: 100%"></el-input>
  64. </el-form-item>
  65. </el-col>-->
  66. <el-col :span="24" >
  67. <el-form-item label="客户类型:" prop="type">
  68. <el-select v-model="form.type" placeholder="请选择客户类型" style="width: 100%">
  69. <el-option
  70. v-for="item in options.type"
  71. :key="item.value"
  72. :label="item.value"
  73. :value="item.value">
  74. <!-- <span style="float: left">{{ item.value }}</span>
  75. <span v-if="item.remarks !== ''" style="float: right; color: #8492a6; font-size: 10px">{{ item.remarks }}</span>-->
  76. <span style="float: left">{{ item.value }}</span>
  77. <span style="float: right; color: #8492a6; font-size: 12px">{{ item.remarks?item.remarks:'暂无描述' }}</span>
  78. </el-option>
  79. </el-select>
  80. </el-form-item>
  81. </el-col>
  82. <el-col :span="24">
  83. <el-form-item label="客户等级:" prop="grade">
  84. <el-select v-model="form.grade" placeholder="请选择客户等级" style="width: 100%">
  85. <el-option
  86. v-for="item in options.customerGrade"
  87. :key="item.rowindex"
  88. :label="item.value "
  89. :value="item.value">
  90. <span style="float: left">{{ item.value }}</span>
  91. <span style="float: right; color: #8492a6; font-size: 12px">{{ item.remarks?item.remarks:'暂无描述' }}</span>
  92. </el-option>
  93. </el-select>
  94. </el-form-item>
  95. </el-col>
  96. <el-col :span="24">
  97. <el-form-item label="客户分类:" prop="customergrade">
  98. <el-select v-model="form.customergrade" placeholder="请选择客户分类" style="width: 100%">
  99. <el-option
  100. v-for="item in options.customerClassification"
  101. :key="item.rowindex"
  102. :label="item.value "
  103. :value="item.value">
  104. <span style="float: left">{{ item.value }}</span>
  105. <span style="float: right; color: #8492a6; font-size: 12px">{{ item.remarks?item.remarks:'暂无描述' }}</span>
  106. </el-option>
  107. </el-select>
  108. </el-form-item>
  109. </el-col>
  110. <!-- <el-col :span="24">
  111. <el-form-item label="客户行业:" >
  112. <el-select v-model="form.industry" placeholder="请选择所属行业" style="width: 100%">
  113. <el-option
  114. v-for="item in options.industryData"
  115. :key="item.value"
  116. :label="item.value"
  117. :value="item.value">
  118. </el-option>
  119. </el-select>
  120. </el-form-item>
  121. </el-col>-->
  122. <el-col :span="24">
  123. <el-form-item label="客户行业:" prop="industry">
  124. <el-select
  125. ref="sle"
  126. style="width:100%;"
  127. v-model="form.industry"
  128. multiple
  129. placeholder="请选择所属行业"
  130. size="mini"
  131. >
  132. <el-option
  133. v-for="item in options.industryData"
  134. :key="item.value"
  135. :label="item.value"
  136. :value="item.value"
  137. >
  138. <span style="float: left">{{ item.value }}</span>
  139. <span style="float: right; color: #8492a6; font-size: 12px">{{ item.remarks?item.remarks:'暂无描述' }}</span>
  140. </el-option>
  141. </el-select>
  142. </el-form-item>
  143. </el-col>
  144. <el-col :span="24">
  145. <el-form-item label="联系人:" prop="contactsinfo.name">
  146. <el-popover
  147. placement="bottom-start"
  148. width="900"
  149. v-model="enterpriseContact.show"
  150. trigger="click">
  151. <el-tabs type="border-card" @tab-click="changeTab" v-model="activeName">
  152. <el-tab-pane label="企业联系人" name="first" >
  153. <el-table
  154. border
  155. height="500px"
  156. :data="enterpriseContact.listData"
  157. @row-click="enterpriseContactSelect"
  158. :header-cell-style="{background:'#EEEEEE',color:'#333'}"
  159. size="mini">
  160. <el-table-column width="80" label="姓名">
  161. <template slot-scope="scope">
  162. <span >{{ scope.row.name?scope.row.name:'--' }}</span>
  163. </template>
  164. </el-table-column>
  165. <el-table-column width="120" label="手机号">
  166. <template slot-scope="scope">
  167. <span >{{ scope.row.phonenumber?scope.row.phonenumber:'--' }}</span>
  168. </template>
  169. </el-table-column>
  170. <el-table-column width="200" label="邮箱">
  171. <template slot-scope="scope">
  172. <span >{{ scope.row.email?scope.row.email:'--' }}</span>
  173. </template>
  174. </el-table-column>
  175. <el-table-column width="120" label="部门">
  176. <template slot-scope="scope">
  177. <span >{{ scope.row.position?scope.row.position:'--' }}</span>
  178. </template>
  179. </el-table-column>
  180. <el-table-column width="120" label="职位">
  181. <template slot-scope="scope">
  182. <span >{{ scope.row.depname?scope.row.depname:'--' }}</span>
  183. </template>
  184. </el-table-column>
  185. <el-table-column width="80" label="性别">
  186. <template slot-scope="scope">
  187. <span >{{ scope.row.sex?scope.row.sex:'--' }}</span>
  188. </template>
  189. </el-table-column>
  190. <el-table-column width="120" label="生日">
  191. <template slot-scope="scope">
  192. <span >{{ scope.row.birthday?scope.row.birthday:'--' }}</span>
  193. </template>
  194. </el-table-column>
  195. <el-table-column width="300" label="家庭住址">
  196. <template slot-scope="scope">
  197. <span >{{ scope.row.address?scope.row.address:'--' }}</span>
  198. </template>
  199. </el-table-column>
  200. <el-table-column width="200" label="备注">
  201. <template slot-scope="scope">
  202. <span >{{ scope.row.remarks?scope.row.remarks:'--' }}</span>
  203. </template>
  204. </el-table-column>
  205. </el-table>
  206. <div style="display:flex;align-items:center;flex-direction:row-reverse;justify-content:space-between">
  207. <div class="container normal-panel" style="text-align:right">
  208. <el-pagination
  209. background
  210. @size-change="handleSizeChangeEnterprise"
  211. @current-change="handleCurrentChangeEnterprise"
  212. :current-page="enterpriseContact.currentPage"
  213. :page-sizes="[20, 50, 100, 200]"
  214. :page-size="20"
  215. layout="total,sizes, prev, pager, next, jumper"
  216. :total="enterpriseContact.total">
  217. </el-pagination>
  218. </div>
  219. <slot name="footerLeft"></slot>
  220. </div>
  221. </el-tab-pane>
  222. <el-tab-pane label="我的联系人" name="second">
  223. <el-table
  224. border
  225. :data="myContacts.listData"
  226. height="500px"
  227. @row-click="myContactSelect"
  228. :header-cell-style="{background:'#EEEEEE',color:'#333'}"
  229. size="mini">
  230. <el-table-column width="80" label="姓名">
  231. <template slot-scope="scope">
  232. <span >{{ scope.row.name?scope.row.name:'--' }}</span>
  233. </template>
  234. </el-table-column>
  235. <el-table-column width="120" label="手机号">
  236. <template slot-scope="scope">
  237. <span >{{ scope.row.phonenumber?scope.row.phonenumber:'--' }}</span>
  238. </template>
  239. </el-table-column>
  240. <el-table-column width="200" label="邮箱">
  241. <template slot-scope="scope">
  242. <span >{{ scope.row.email?scope.row.email:'--' }}</span>
  243. </template>
  244. </el-table-column>
  245. <el-table-column width="120" label="部门">
  246. <template slot-scope="scope">
  247. <span >{{ scope.row.position?scope.row.position:'--' }}</span>
  248. </template>
  249. </el-table-column><el-table-column width="120" label="职位">
  250. <template slot-scope="scope">
  251. <span >{{ scope.row.depname?scope.row.depname:'--' }}</span>
  252. </template>
  253. </el-table-column><el-table-column width="80" label="性别">
  254. <template slot-scope="scope">
  255. <span >{{ scope.row.sex?scope.row.sex:'--' }}</span>
  256. </template>
  257. </el-table-column><el-table-column width="120" label="生日">
  258. <template slot-scope="scope">
  259. <span >{{ scope.row.birthday?scope.row.birthday:'--' }}</span>
  260. </template>
  261. </el-table-column>
  262. <el-table-column width="300" label="家庭住址">
  263. <template slot-scope="scope">
  264. <span >{{ scope.row.address?scope.row.address:'--' }}</span>
  265. </template>
  266. </el-table-column>
  267. <el-table-column width="200" label="备注">
  268. <template slot-scope="scope">
  269. <span >{{ scope.row.remarks?scope.row.remarks:'--' }}</span>
  270. </template>
  271. </el-table-column>
  272. </el-table>
  273. <div style="display:flex;align-items:center;flex-direction:row-reverse;justify-content:space-between">
  274. <div class="container normal-panel" style="text-align:right">
  275. <el-pagination
  276. background
  277. @size-change="handleSizeChangeMy"
  278. @current-change="handleCurrentChangeMy"
  279. :current-page="myContacts.currentPage"
  280. :page-sizes="[20, 50, 100, 200]"
  281. :page-size="20"
  282. layout="total,sizes, prev, pager, next, jumper"
  283. :total="myContacts.total">
  284. </el-pagination>
  285. </div>
  286. <slot name="footerLeft"></slot>
  287. </div>
  288. </el-tab-pane>
  289. </el-tabs>
  290. <el-input slot="reference" autosize v-model="form.contactsinfo.name" placeholder="请输入联系人姓名" @input="searchData"></el-input>
  291. </el-popover>
  292. </el-form-item>
  293. </el-col>
  294. <el-col :span="24" v-if="isPhone">
  295. <el-form-item label="联系方式:" prop="contactsinfo.phonenumber">
  296. <el-button-group>
  297. <!-- <el-button type="primary" size="mini" @click="phoneChang('手机')">手机号</el-button>
  298. <el-button type="" size="mini" @click="phoneChang('座机')">座机电话</el-button>-->
  299. <el-radio v-model="isPhone" :label="true" @change="phoneChang('手机')">手机号</el-radio>
  300. <el-radio v-model="isPhone" :label="false" @change="phoneChang('座机')">座机电话</el-radio>
  301. </el-button-group>
  302. <el-input v-model="form.contactsinfo.phonenumber" placeholder="请输入手机号" style="width: 100%;margin-top: 10px" @input="telephoneChange('手机')"></el-input>
  303. </el-form-item>
  304. </el-col>
  305. <el-col :span="24" v-if="!isPhone">
  306. <el-form-item label="联系方式:" prop="contactsinfo.telephone">
  307. <el-button-group>
  308. <!-- <el-button type="" size="mini" @click="phoneChang('手机')">手机号</el-button>
  309. <el-button type="primary" size="mini" @click="phoneChang('座机')">座机电话</el-button>-->
  310. <el-radio v-model="isPhone" :label="true" @change="phoneChang('手机')">手机号</el-radio>
  311. <el-radio v-model="isPhone" :label="false" @change="phoneChang('座机')">座机电话</el-radio>
  312. </el-button-group>
  313. <div style="width: 100%">
  314. <el-input v-model="areaCode" placeholder="请输入区号" style="width:25%;margin-top: 10px" @input="telephoneChange('座机')"></el-input>
  315. <span style="color: #999999">——</span>
  316. <el-input v-model="telephone" placeholder="请输入座机电话" style="width:68%;margin-top: 10px" @input="telephoneChange('座机')"></el-input>
  317. </div>
  318. </el-form-item>
  319. </el-col>
  320. <el-col :span="24">
  321. <el-form-item label="税号:" prop="taxno">
  322. <el-input v-model="form.taxno" placeholder="请输入企业税号" style="width: 100%"></el-input>
  323. </el-form-item>
  324. </el-col>
  325. <el-col :span="24">
  326. <el-form-item label="法人:" prop="contact">
  327. <el-input v-model="form.contact" placeholder="请输入法人信息" style="width: 100%"></el-input>
  328. </el-form-item>
  329. </el-col>
  330. <el-col :span="24">
  331. <el-form-item label="联系电话:" prop="telephone">
  332. <el-input v-model="form.telephone" placeholder="请输入联系电话" style="width: 100%"></el-input>
  333. </el-form-item>
  334. </el-col>
  335. <el-col :span="24">
  336. <el-form-item label="省市县:" prop="province">
  337. <el-cascader
  338. style="width: 100%"
  339. v-model="value"
  340. :options="basicData.data().areaData"
  341. @change="cascaderChange" clearable>
  342. </el-cascader>
  343. </el-form-item>
  344. </el-col>
  345. <el-col :span="24">
  346. <el-form-item label="详细地址:" prop="address">
  347. <el-input v-model="form.address" placeholder="请输入详细地址" style="width: 100%"></el-input>
  348. </el-form-item>
  349. </el-col>
  350. <el-col :span="24">
  351. <el-form-item label="上级企业:" prop="superiorenterprisename">
  352. <el-popover
  353. placement="bottom"
  354. width="700"
  355. trigger="click"
  356. v-model="customerShow"
  357. @show="customerList">
  358. <el-input
  359. style="width:300px;margin-bottom: 10px"
  360. placeholder="请输入内容"
  361. v-model="customerParam.content.where.condition"
  362. clearable
  363. @clear="customerList(customerParam.content.pageNumber = 1)"
  364. size="mini"
  365. @keyup.enter.native="customerList(customerParam.content.pageNumber = 1)">
  366. <i slot="prefix" class="el-icon-search" @click="customerList(customerParam.content.pageNumber = 1)"></i>
  367. </el-input>
  368. <el-table :data="customer.customerData" @row-click="customerData" height="396px" :header-cell-style="{background:'#EEEEEE',color:'#333'}" size="mini">
  369. <el-table-column
  370. label="客户编号"
  371. width="180">
  372. <template slot-scope="scope">
  373. <span style="margin-left: 10px">{{ scope.row.sa_customersid?scope.row.sa_customersid:'--' }}</span>
  374. </template>
  375. </el-table-column>
  376. <el-table-column
  377. label="客户名称"
  378. width="200">
  379. <template slot-scope="scope">
  380. <span style="margin-left: 10px">{{ scope.row.enterprisename?scope.row.enterprisename:'--'}}</span>
  381. </template>
  382. </el-table-column>
  383. <el-table-column
  384. label="地址"
  385. >
  386. <template slot-scope="scope">
  387. <span style="margin-left: 10px">{{ scope.row.address?scope.row.address:'--' }}</span>
  388. </template>
  389. </el-table-column>
  390. </el-table>
  391. <div class="container normal-panel" style="text-align:right">
  392. <el-pagination
  393. background
  394. small
  395. @size-change="handleSizeChangeCustomer"
  396. @current-change="handleCurrentChangeCustomer"
  397. :page-sizes="[10,20,50,100,]"
  398. layout="total,sizes, prev, pager, next, jumper"
  399. :current-page="customer.currentPage"
  400. :total="customer.total">
  401. </el-pagination>
  402. </div>
  403. <el-input slot="reference" :readonly="true" v-model="form.superiorenterprisename" autocomplete="off" placeholder="请选择客户" @input="selectCustomer"></el-input>
  404. </el-popover>
  405. </el-form-item>
  406. </el-col>
  407. <el-col :span="24">
  408. <el-form-item label="客户来源:" prop="source">
  409. <el-input v-model="form.source" placeholder="请输入客户来源" style="width: 100%"></el-input>
  410. </el-form-item>
  411. </el-col>
  412. <el-col :span="24">
  413. <el-form-item label="归属经销商:" prop="sa_agentsid">
  414. <el-select v-model="form.sa_agentsid" placeholder="请选择经销商" style="width: 100%">
  415. <el-option
  416. v-for="item in options.distributor"
  417. :key="item.sa_agentsid"
  418. :label="item.enterprisename "
  419. :value="item.sa_agentsid">
  420. </el-option>
  421. </el-select>
  422. </el-form-item>
  423. </el-col>
  424. </el-form>
  425. </el-row>
  426. </div>
  427. <div class="fixed__btn__panel">
  428. <el-button size="small" @click="onClose" class="normal-btn-width inline-16">取 消</el-button>
  429. <!-- <el-button size="small" type="primary" @click="duplicateChecking" class="normal-btn-width">查 重</el-button>-->
  430. <duplicateCheck ref="check" :data="form" @onSuccess="onClose" @onCheck="onCheck"></duplicateCheck>
  431. <el-button size="small" type="primary" :loading="loading" @click="onSave" class="normal-btn-width">确 定</el-button>
  432. </div>
  433. </el-drawer>
  434. <enterprise
  435. :visible="visibleEnterprise"
  436. :index="index"
  437. :sa_projectid="form.sa_projectid"
  438. v-if="visibleEnterprise"
  439. @onEnterprise="onEnterprise">
  440. </enterprise>
  441. </div>
  442. </template>
  443. <script>
  444. import {mapGetters} from 'vuex'
  445. import enterprise from '@/SDrpManagement/salerPrivatecustomer/components/enterprise'
  446. // import duplicateCheck from "@/SDrpManagement/salerPrivatecustomer/components/duplicateCheck";
  447. import duplicateCheck from "@/components/duplicatesCheck/customerCheck";
  448. export default {
  449. name: "add",
  450. components:{enterprise,duplicateCheck},
  451. data(){
  452. return {
  453. activeName:'first',
  454. dialogFormVisible:false,
  455. visibleEnterprise:false,
  456. customerShow:false,
  457. checkResults:'',
  458. index:'',
  459. businessData:[],
  460. businessParam:{
  461. "id": 20221208103601,
  462. "content": {
  463. "pageNumber":1,
  464. "pageSize":5,
  465. "keyword":''
  466. },
  467. },
  468. businessShow:false,
  469. total:0,
  470. currentPage:0,
  471. form:{
  472. sa_customersid: 0,//新增是传0
  473. parentid: 0, //上级客户ID,默认或没有上级的时候传0
  474. sys_enterpriseid: 0, //合作企业档案ID,新增是传0,更新
  475. enterprisename:"",//客户名称(企业名称)
  476. type: "", //客户类型
  477. source: "", //客户来源
  478. province:"",//非必填,可选
  479. city:"",//非必填,可选
  480. county:"",//非必填,可选
  481. address:"",//非必填,可选
  482. abbreviation:"",//非必填,可选
  483. taxno:"",//税号,非必填,可选
  484. grade:'',// 客户等级(商户等级)
  485. industry:[],//非必填,可选,所属行业
  486. contact:"",//非必填,可选
  487. phonenumber:"",//非必填,可选
  488. customergrade:"",
  489. ispublic:0,//1:公海客户,0:私域客户,自己新建的
  490. telephone: "",
  491. sa_agentsid: "",
  492. erpagentnum:"",
  493. contactsinfo: {
  494. name: "",
  495. telephone: "",
  496. phonenumber: ""
  497. },
  498. },
  499. value:'',
  500. options:{
  501. type:[],
  502. parentCustomers:[],
  503. /* gradeData:[],*/
  504. customerGrade:[],
  505. industryData:[],
  506. customerClassification:[],
  507. distributor:[]
  508. },
  509. rules:{
  510. enterprisename: [
  511. { required: true, message: '请输入客户名称', trigger: 'change,blur' },
  512. ],
  513. type: [
  514. { required: true, message: '还未选择客户类型', trigger: 'change' },
  515. ],
  516. contact: [
  517. { required: false, message: '请输入法人', trigger: 'change' },
  518. ],
  519. telephone: [
  520. { required: false, message: '请输入联系电话', trigger: 'change' },
  521. { pattern:/^1[3-9]\d{9}$/, message: '请输入正确手机号码',trigger: 'change' }
  522. ],
  523. province: [
  524. { required: true, message: '请选择省市县', trigger: 'blur' },
  525. ],
  526. 'contactsinfo.name':[
  527. { required: true, message: '请输入联系人姓名', trigger: 'change,blur' }
  528. ],
  529. 'contactsinfo.phonenumber': [
  530. { required: true, message: '请输入联系电话', trigger: 'change' },
  531. { pattern:/^1[3-9]\d{9}$/, message: '请输入正确手机号码',trigger: 'change' }
  532. ],
  533. 'contactsinfo.telephone': [
  534. { required: true, message: '请输入座机电话', trigger: 'change' },
  535. { pattern:/^0\d{2,3}-\d{7,8}$/, message: '请输入正确座机电话',trigger: 'change' }
  536. ],
  537. },
  538. customerParam:{
  539. "id": 20220920083901,
  540. "content": {
  541. "pageNumber": 1,
  542. "pageSize": 10,
  543. "where": {
  544. "condition": "",
  545. "type":2,
  546. "sa_projectid":""
  547. }
  548. }
  549. },
  550. customer:{
  551. customerData:[],
  552. total:0,
  553. currentPage:0,
  554. },
  555. isPhone:true,
  556. enterpriseContact:{
  557. param:{
  558. "content": {
  559. "sys_enterpriseid": '',
  560. "pageNumber": 1,
  561. "pageSize": 20,
  562. "where": {
  563. "condition": ""
  564. }
  565. },
  566. "id": 20221219193002,
  567. },
  568. listData:[],
  569. total:0,
  570. currentPage:0,
  571. show:false
  572. },
  573. myContacts:{
  574. param:{
  575. "id": 20221219161202,
  576. "content": {
  577. "pageNumber": 1,
  578. "pageSize": 20,
  579. "ownertable":'sa_customers',
  580. "ownerid":'',
  581. "where": {
  582. "condition": ""
  583. }
  584. }
  585. },
  586. listData:[],
  587. total:0,
  588. currentPage:0,
  589. show:false
  590. },
  591. areaCode:'',
  592. telephone:''
  593. }
  594. },
  595. computed:{
  596. ...mapGetters({
  597. dataToForm:'dataToForm',
  598. loading:'loading'
  599. })
  600. },
  601. methods:{
  602. show(){
  603. this.dialogFormVisible = true
  604. this.typeList()
  605. /*this.parentCustomer()*/
  606. this.gradeList()
  607. this.industryList()
  608. this.queryCustomerGrade()
  609. this.queryDistributor()
  610. this.enterpriseContactList()
  611. },
  612. /*工商查询*/
  613. async businessSearch(){
  614. this.businessParam.content.keyword = this.form.enterprisename
  615. const res = await this.$api.requested(this.businessParam)
  616. console.log(res,"工商查询结果")
  617. this.businessData = res.data
  618. this.total = res.total
  619. this.currentPage = res.pageNumber
  620. this.businessShow = true
  621. },
  622. /*选择工商信息*/
  623. businessSelect(val){
  624. console.log("选择的工商信息",val)
  625. this.$confirm('是否以查询的工商信息更新客户信息?', '提示', {
  626. confirmButtonText: '确定',
  627. cancelButtonText: '取消',
  628. type: 'warning'
  629. }).then(() => {
  630. this.businessShow = false
  631. this.form.enterprisename = val.companyName
  632. this.form.address = val.address === "-" ? '' : val.address
  633. this.form.taxno = val.taxNum
  634. this.value = [val.regProvince,val.regCity,val.regArea]
  635. this.form.province = val.regProvince
  636. this.form.city = val.regCity
  637. this.form.county = val.regArea
  638. this.form.contact = val.legalPerson
  639. }).catch(() => {
  640. this.businessShow = false
  641. this.$message({
  642. type: 'info',
  643. message: '已取消更新'
  644. });
  645. })
  646. },
  647. /*handleSizeChange(val) {
  648. // console.log(`每页 ${val} 条`);
  649. this.param.content.pageSize = val
  650. this.businessSearch()
  651. },
  652. handleCurrentChange(val) {
  653. // console.log(`当前页: ${val}`);
  654. this.param.content.pageNumber = val
  655. this.businessSearch()
  656. },*/
  657. /*查重检查*/
  658. onCheck(){
  659. this.$refs.form.validate((valid) => {
  660. if (!valid) return false
  661. this.$refs.check.queryRule()
  662. })
  663. },
  664. /*自动查重判断*/
  665. duplicateCheck(){
  666. this.$refs.form.validate(async (valid) => {
  667. if (!valid) return false
  668. const res = await this.$api.requested({
  669. "id": 20221208172002,
  670. "content": {
  671. "sa_customersid":this.form.sa_customersid,
  672. "enterprisename":this.form.enterprisename,
  673. "taxno":this.form.taxno,
  674. "address":this.form.address
  675. },
  676. })
  677. console.log(res,"查重结果")
  678. if (res.data.length !== 0){
  679. console.log("重复")
  680. }
  681. this.checkResults = res.data.length
  682. this.onSave()
  683. })
  684. },
  685. onSave(){
  686. this.$refs.form.validate((valid) => {
  687. if (!valid) return false
  688. this.$refs.check.creatShow = true
  689. this.$store.commit('setLoading',true)
  690. this.$refs.check.queryRule(() => {
  691. this.$store.commit('setLoading',false)
  692. })
  693. })
  694. },
  695. onClose () {
  696. this.form.contactsinfo.telephone = ''
  697. this.form.contactsinfo.phonenumber = ''
  698. this.isPhone = true
  699. this.$refs['form'].resetFields();
  700. this.dialogFormVisible = false
  701. this.checkResults = ''
  702. this.value = ''
  703. this.businessShow = false
  704. this.areaCode = ''
  705. this.telephone = ''
  706. this.$emit('onSuccess')
  707. },
  708. /*客户类型列表*/
  709. async typeList(){
  710. const siteid = JSON.parse(sessionStorage.getItem('active_account')).siteid
  711. const res = await this.$api.requested({
  712. "classname": "sysmanage.develop.optiontype.optiontype",
  713. "method": "optiontypeselect",
  714. "content": {
  715. "pageNumber": 1,
  716. "pageSize": 20,
  717. "typename": "customertypemx",
  718. "parameter": {
  719. "siteid": siteid
  720. }
  721. }
  722. })
  723. this.options.type = res.data
  724. },
  725. async customerList(){
  726. const res = await this.$api.requested(this.customerParam)
  727. this.customer.customerData = res.data
  728. this.customer.total = res.total
  729. this.customer.currentPage = res.pageNumber
  730. },
  731. selectCustomer(){
  732. this.customerParam.content.where.condition = this.form.enterprisename
  733. this.customerList()
  734. },
  735. /*客户选择信息*/
  736. customerData(val){
  737. this.form.parentid = val.sa_customersid
  738. this.form.superiorenterprisename = val.enterprisename
  739. this.customerShow = false
  740. },
  741. /*客户分页*/
  742. handleSizeChangeCustomer(val) {
  743. // console.log(`每页 ${val} 条`);
  744. this.customerParam.content.pageSize = val
  745. this.customerList()
  746. },
  747. handleCurrentChangeCustomer(val) {
  748. // console.log(`当前页: ${val}`);
  749. this.customerParam.content.pageNumber = val
  750. this.customerList()
  751. },
  752. enterpriseList(){
  753. this.visibleEnterprise = true
  754. },
  755. /*上级客户列表*/
  756. onEnterprise(data){
  757. this.visibleEnterprise = false
  758. console.log("企业信息",data)
  759. this.form.parentid = data.sa_customersid
  760. this.form.superiorenterprisename = data.enterprisename
  761. },
  762. /*/!*上级客户*!/
  763. async parentCustomer(){
  764. const res = await this.$api.requested({
  765. "id": 20221014101002,
  766. "content": {
  767. "pageNumber": 1,
  768. "pageSize": 20,
  769. "where": {
  770. "condition": ""
  771. }
  772. }
  773. })
  774. console.log(res)
  775. this.options.parentCustomers = res.data
  776. },*/
  777. /*省市县*/
  778. cascaderChange (val) {
  779. this.form.province = val[0]
  780. if (val.length === 1)
  781. return this.form = Object.assign({},this.form,{province:val[0],city:'',county:''})
  782. this.form = Object.assign({},this.form,{province:val[0],city:val[1],county:val[2]})
  783. this.$refs.form.validateField('province')
  784. },
  785. /*客户分类*/
  786. async gradeList(){
  787. const siteid = JSON.parse(sessionStorage.getItem('active_account')).siteid
  788. const res = await this.$api.requested({
  789. "classname": "sysmanage.develop.optiontype.optiontype",
  790. "method": "optiontypeselect",
  791. "content": {
  792. "pageNumber": 1,
  793. "pageSize": 20,
  794. "typename": "customergrade",
  795. "parameter": {
  796. "siteid": siteid
  797. }
  798. }
  799. })
  800. console.log("客户等级",res.data)
  801. /*for (var i=0;i<res.data.length; i++){
  802. if (res.data[i].remarks !== ''){
  803. this.options.gradeData[i] = res.data[i].value + "——" + res.data[i].remarks
  804. }else{
  805. this.options.gradeData[i] = res.data[i].value
  806. }
  807. }*/
  808. this.options.customerClassification = res.data
  809. console.log("处理后客户等级",this.options.customerClassification)
  810. },
  811. /*客户等级*/
  812. queryCustomerGrade(){
  813. this.$store.dispatch('optiontypeselect','agentgrade').then(res=>{
  814. this.options.customerGrade = res.data
  815. })
  816. },
  817. /*行业列表*/
  818. async industryList(){
  819. const siteid = JSON.parse(sessionStorage.getItem('active_account')).siteid
  820. const res = await this.$api.requested({
  821. "classname": "sysmanage.develop.optiontype.optiontype",
  822. "method": "optiontypeselect",
  823. "content": {
  824. "pageNumber": 1,
  825. "pageSize": 20,
  826. "typename": "industry",
  827. "parameter": {
  828. "siteid": siteid
  829. }
  830. }
  831. })
  832. this.options.industryData = res.data
  833. },
  834. /*所属经销商*/
  835. async queryDistributor(){
  836. var sessionData = sessionStorage.getItem('active_account')
  837. sessionData = JSON.parse(sessionData)
  838. const res = await this.$api.requested({
  839. "id": 20230214162602,
  840. "content": {
  841. "hrid": sessionData.hrid,
  842. "pageNumber": 1,
  843. "pageSize": 20,
  844. "where": {
  845. "condition": ""
  846. }
  847. },
  848. })
  849. this.options.distributor = res.data
  850. console.log(this.options.distributor,'经销商')
  851. },
  852. phoneChang(val){
  853. if (val === '座机'){
  854. this.isPhone = false
  855. }else {
  856. this.isPhone = true
  857. }
  858. },
  859. searchData(){
  860. this.changeTab()
  861. },
  862. changeTab(){
  863. this.enterpriseContactList()
  864. this.myContactList()
  865. },
  866. /*企业联系人*/
  867. async enterpriseContactList(){
  868. this.enterpriseContact.param.content.where.condition = this.form.contactsinfo.name
  869. this.enterpriseContact.param.content.sys_enterpriseid = 0
  870. const res = await this.$api.requested(this.enterpriseContact.param)
  871. this.enterpriseContact.listData = res.data
  872. this.enterpriseContact.total = res.total
  873. this.enterpriseContact.currentPage = res.pageNumber
  874. },
  875. /*选择企业联系人*/
  876. enterpriseContactSelect(val){
  877. this.form.contactsinfo.name = val.name
  878. if (val.phonenumber.indexOf('-') != '-1'){
  879. this.isPhone = false
  880. this.areaCode = val.phonenumber.substring(0,val.phonenumber.indexOf('-'))
  881. this.telephone = val.phonenumber.substring(this.areaCode.length+1)
  882. this.form.contactsinfo.telephone = this.areaCode + '-' + this.telephone
  883. this.form.contactsinfo.phonenumber = ''
  884. }else {
  885. this.isPhone = true
  886. this.form.contactsinfo.phonenumber = val.phonenumber
  887. this.form.contactsinfo.telephone = ''
  888. this.areaCode = ''
  889. this.telephone = ''
  890. }
  891. this.enterpriseContact.show = false
  892. },
  893. handleSizeChangeEnterprise(val) {
  894. // console.log(`每页 ${val} 条`);
  895. this.enterpriseContact.param.content.pageSize = val
  896. this.enterpriseContactList()
  897. },
  898. handleCurrentChangeEnterprise(val) {
  899. // console.log(`当前页: ${val}`);
  900. this.enterpriseContact.param.content.pageNumber = val
  901. this.enterpriseContactList()
  902. },
  903. /*我的联系人*/
  904. async myContactList(){
  905. this.myContacts.param.content.where.condition = this.form.contactsinfo.name
  906. this.myContacts.param.content.sys_enterpriseid = 0
  907. this.myContacts.param.content.ownerid = 0
  908. const res = await this.$api.requested(this.myContacts.param)
  909. this.myContacts.listData = res.data
  910. this.myContacts.total = res.total
  911. this.myContacts.currentPage = res.pageNumber
  912. },
  913. /*选择我的联系人*/
  914. myContactSelect(val){
  915. this.form.contactsinfo.name = val.name
  916. if (val.phonenumber.indexOf('-') != '-1'){
  917. this.isPhone = false
  918. this.areaCode = val.phonenumber.substring(0,val.phonenumber.indexOf('-'))
  919. this.telephone = val.phonenumber.substring(this.areaCode.length+1)
  920. this.form.contactsinfo.telephone = this.areaCode + '-' + this.telephone
  921. this.form.contactsinfo.phonenumber = ''
  922. }else {
  923. this.isPhone = true
  924. this.form.contactsinfo.phonenumber = val.phonenumber
  925. this.form.contactsinfo.telephone = ''
  926. }
  927. this.enterpriseContact.show = false
  928. },
  929. handleSizeChangeMy(val) {
  930. // console.log(`每页 ${val} 条`);
  931. this.myContacts.param.content.pageSize = val
  932. this.myContactList()
  933. },
  934. handleCurrentChangeMy(val) {
  935. // console.log(`当前页: ${val}`);
  936. this.myContacts.param.content.pageNumber = val
  937. this.myContactList()
  938. },
  939. telephoneChange(val){
  940. if (val === '座机'){
  941. this.form.contactsinfo.phonenumber = ''
  942. this.form.contactsinfo.telephone = this.areaCode + '-' + this.telephone
  943. }else {
  944. this.form.contactsinfo.telephone = ''
  945. this.areaCode = ''
  946. this.telephone = ''
  947. }
  948. }
  949. }
  950. }
  951. </script>
  952. <style scoped>
  953. /deep/.el-input__prefix {
  954. display: flex;
  955. align-items: center;
  956. }
  957. </style>