addContract.vue 46 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083
  1. <template>
  2. <div>
  3. <!-- <p class="normal-title normal-panel" style="line-height:32px;padding-left:16px;border-bottom:1px solid #eeeeee">新建合同</p> -->
  4. <div>
  5. <p class="normal-title normal-panel" style="border-bottom:1px solid #cccccc;padding:16px">新建{{$route.query.type == '框架' ? '经销商合作' : $route.query.type}}合同</p>
  6. <div class="container normal-panel" style="padding-bottom:0">
  7. <!--合作协议-->
  8. <el-row v-if="$route.query.type == '框架'">
  9. <el-form :model="form" :rules="rules" ref="form" label-position="right" label-width="140px" size="small">
  10. <el-col :span="24">
  11. <el-form-item label="合同标题:" prop="title">
  12. <el-input type="text" size="small" v-model="form.title" placeholder="请输入合同标题"></el-input>
  13. </el-form-item>
  14. </el-col>
  15. <el-col :span="24">
  16. <el-form-item label="经销商:" prop="enterprisename" >
  17. <el-popover
  18. placement="bottom"
  19. trigger="manual"
  20. v-model="agentVisible"
  21. width="500">
  22. <selectAgent type="5" ref="member" :param="agentListPrams" :radio="true" @onSelect="agentChange" @onCancel="agentVisible = false"></selectAgent>
  23. <el-input readonly type="text" slot="reference" size="small" @focus="showChange('agentVisible')" v-model="form.enterprisename" placeholder="请选择经销商"></el-input>
  24. </el-popover>
  25. </el-form-item>
  26. </el-col>
  27. <el-col :span="24">
  28. <el-form-item label="业务员:" prop="salername">
  29. <el-popover
  30. placement="bottom"
  31. trigger="manual"
  32. v-model="salesmanVisible"
  33. width="500">
  34. <!-- <selectAgent type="5" ref="member" :param="agentListPrams" :radio="true" @onSelect="agentChange" @onCancel="agentVisible = false"></selectAgent>-->
  35. <selectSalesman type="1" ref="selectSalesman" :sys_enterpriseid="form.sys_enterpriseid" :radio="true" @onSelect="salesmanChange" @onCancel="salesmanVisible = false"></selectSalesman>
  36. <el-input readonly type="text" slot="reference" size="small" @focus="showChange('salesmanVisible')" v-model="form.salername" placeholder="请选择业务员"></el-input>
  37. </el-popover>
  38. </el-form-item>
  39. </el-col>
  40. <!-- <el-col :span="24">
  41. <el-form-item label="业务员:" prop="">
  42. <el-input disabled type="text" size="small" v-model="form.salername"></el-input>
  43. </el-form-item>
  44. </el-col>-->
  45. <el-col :span="24">
  46. <el-form-item label="折扣(%):" prop="discountrate" >
  47. <el-input type="number" size="small" v-model="form.discountrate" placeholder="请输入0-100%" @change="discountrateChange"></el-input>
  48. </el-form-item>
  49. </el-col>
  50. <el-col :span="24">
  51. <el-form-item label="付款条件:" prop="paytype">
  52. <el-select v-model="form.paytype" placeholder="请选择">
  53. <el-option
  54. v-for="item in payTypeData"
  55. :key="item.value"
  56. :label="item.label"
  57. :value="item.value">
  58. </el-option>
  59. </el-select>
  60. </el-form-item>
  61. </el-col>
  62. <el-col :span="24">
  63. <el-form-item label="发货日期提醒(天):" prop="reminddays" >
  64. <el-input type="text" size="small" v-model="form.reminddays" placeholder="请输入发货日期提醒天数"></el-input>
  65. </el-form-item>
  66. </el-col>
  67. <el-col :span="24">
  68. <el-form-item label="合同有效期:" prop="begdate">
  69. <el-input style="display:none" v-model="form.begdate"></el-input>
  70. <time-select ref="timeSelect" class="inline-16" @clearSelect="clearTime" @timeChange="timeChange"></time-select>
  71. </el-form-item>
  72. </el-col>
  73. <el-col :span="24">
  74. <el-form-item label="签约日期:" prop="signdate">
  75. <el-date-picker
  76. v-model="form.signdate"
  77. type="date"
  78. value-format="yyyy-MM-dd"
  79. placeholder="选择日期">
  80. </el-date-picker>
  81. </el-form-item>
  82. </el-col>
  83. <el-col :span="24">
  84. <el-form-item label="合同模板:" prop="type">
  85. <el-input disabled type="text" size="small" :value="$route.query.type == '框架' ? '经销合作' : $route.query.type"></el-input>
  86. </el-form-item>
  87. </el-col>
  88. <el-col :span="24">
  89. <el-form-item label="合同描述:" prop="remarks">
  90. <el-input type="textarea" size="small" v-model="form.remarks" placeholder="请输入描述信息"></el-input>
  91. </el-form-item>
  92. </el-col>
  93. </el-form>
  94. </el-row>
  95. <!--经销项目-->
  96. <el-row v-if="$route.query.type == '经销项目'">
  97. <el-form :model="form" :rules="rules" ref="form" label-position="right" label-width="140px" size="small">
  98. <el-col :span="24">
  99. <el-form-item label="合同标题:" prop="title">
  100. <el-input type="text" size="small" v-model="form.title" placeholder="请输入合同标题"></el-input>
  101. </el-form-item>
  102. </el-col>
  103. <el-col :span="24">
  104. <el-form-item label="经销商:" prop="enterprisename">
  105. <el-popover
  106. placement="bottom"
  107. trigger="manual"
  108. v-model="agentVisible"
  109. width="500">
  110. <selectAgent type="5" ref="member" :param="agentListPrams" :radio="true" @onSelect="agentChange" @onCancel="agentVisible = false"></selectAgent>
  111. <el-input readonly type="text" slot="reference" size="small" @focus="showChange('agentVisible')" v-model="form.enterprisename" placeholder="请选择经销商"></el-input>
  112. </el-popover>
  113. </el-form-item>
  114. </el-col>
  115. <el-col :span="24">
  116. <el-form-item label="项目名称:" prop="projectname">
  117. <el-popover
  118. placement="bottom"
  119. trigger="manual"
  120. v-model="projectVisible"
  121. width="600">
  122. <seleteProject ref="project" type="2" :sys_enterpriseid='form.sys_enterpriseid' @onSelect="projectChange" @onCanel="projectVisible=false"></seleteProject>
  123. <el-input readonly type="text" slot="reference" size="small" v-model="form.projectname" @focus="showChange('projectVisible')" placeholder="请选择项目"></el-input>
  124. </el-popover>
  125. </el-form-item>
  126. </el-col>
  127. <el-col :span="24">
  128. <el-form-item label="项目编号:" prop="">
  129. <el-input disabled type="text" size="small" v-model="form.projectnum" placeholder="请选择项目"></el-input>
  130. </el-form-item>
  131. </el-col>
  132. <el-col :span="24">
  133. <el-form-item label="业务员:" prop="salername">
  134. <el-popover
  135. placement="bottom"
  136. trigger="manual"
  137. v-model="salesmanVisible"
  138. width="500">
  139. <selectSalesman type="2" ref="selectSalesman" :sa_projectid="form.sa_projectid" :radio="true" @onSelect="salesmanChange" @onCancel="salesmanVisible = false"></selectSalesman>
  140. <el-input readonly type="text" slot="reference" size="small" @focus="showChange('salesmanVisible')" v-model="form.salername" placeholder="请选择业务员"></el-input>
  141. </el-popover>
  142. </el-form-item>
  143. </el-col>
  144. <el-col :span="24">
  145. <el-form-item label="折扣(%):" prop="discountrate" >
  146. <el-input type="number" size="small" v-model="form.discountrate" placeholder="请输入0-100%" @change="discountrateChange"></el-input>
  147. </el-form-item>
  148. </el-col>
  149. <el-col :span="24">
  150. <el-form-item label="付款条件:" prop="paytype">
  151. <el-select v-model="form.paytype" placeholder="请选择">
  152. <el-option
  153. v-for="item in payTypeData"
  154. :key="item.value"
  155. :label="item.label"
  156. :value="item.value">
  157. </el-option>
  158. </el-select>
  159. </el-form-item>
  160. </el-col>
  161. <el-col :span="24">
  162. <el-form-item label="发货日期提醒(天):" prop="reminddays" >
  163. <el-input type="text" size="small" v-model="form.reminddays" placeholder="请输入发货日期提醒天数"></el-input>
  164. </el-form-item>
  165. </el-col>
  166. <el-col :span="24">
  167. <el-form-item label="合同有效期:" prop="begdate">
  168. <input type="text" style="display:none" v-model="form.begdate">
  169. <time-select ref="timeSelect" class="inline-16" @clearSelect="clearTime" @timeChange="timeChange"></time-select>
  170. </el-form-item>
  171. </el-col>
  172. <el-col :span="24">
  173. <el-form-item label="签约日期:" prop="signdate">
  174. <el-date-picker
  175. v-model="form.signdate"
  176. type="date"
  177. value-format="yyyy-MM-dd"
  178. placeholder="选择日期">
  179. </el-date-picker>
  180. </el-form-item>
  181. </el-col>
  182. <el-col :span="24">
  183. <el-form-item label="签约金额(元):" prop="signamount">
  184. <el-input type="text" size="small" placeholder="系统自动计算" disabled v-model="form.signamount"></el-input>
  185. </el-form-item>
  186. </el-col>
  187. <el-col :span="24">
  188. <el-form-item label="合同模板:" prop="type">
  189. <el-input disabled type="text" size="small" :value="$route.query.type == '框架' ? '经销合作' : $route.query.type"></el-input>
  190. </el-form-item>
  191. </el-col>
  192. <el-col :span="24">
  193. <el-form-item label="合同描述:" prop="hrid">
  194. <el-input type="textarea" size="small" v-model="form.remarks"></el-input>
  195. </el-form-item>
  196. </el-col>
  197. </el-form>
  198. </el-row>
  199. <!--直销项目-->
  200. <el-row v-if="$route.query.type == '直销项目'">
  201. <el-form :model="form" :rules="rules" ref="form" label-position="right" label-width="140px" size="small">
  202. <el-col :span="24">
  203. <el-form-item label="合同标题:" prop="title">
  204. <el-input type="text" size="small" v-model="form.title" placeholder="请输入合同标题"></el-input>
  205. </el-form-item>
  206. </el-col>
  207. <el-col :span="24">
  208. <el-form-item label="客户" prop="sys_enterpriseid">
  209. <el-popover
  210. placement="bottom"
  211. trigger="manual"
  212. v-model="accountVisible"
  213. width="500">
  214. <selectAgent type="7" ref="member" :param="agentListPrams" :radio="true" @onSelect="accountChange" @onCancel="accountVisible = false"></selectAgent>
  215. <el-input readonly type="text" slot="reference" size="small" @focus="showChange('accountVisible')" v-model="form.enterprisename" placeholder="请选择客户"></el-input>
  216. </el-popover>
  217. </el-form-item>
  218. </el-col>
  219. <el-col :span="24">
  220. <el-form-item label="项目:" prop="projectname">
  221. <el-popover
  222. placement="bottom"
  223. trigger="manual"
  224. v-model="projectVisible"
  225. width="600">
  226. <seleteProject ref="project" type="1" @onSelect="projectChange" @onCanel="projectVisible=false"></seleteProject>
  227. <el-input readonly type="text" slot="reference" size="small" @focus="showChange('projectVisible')" v-model="form.projectname" placeholder="请选择项目"></el-input>
  228. </el-popover>
  229. </el-form-item>
  230. </el-col>
  231. <el-col :span="24">
  232. <el-form-item label="项目地址:" prop="address">
  233. <el-input disabled type="text" size="small" v-model="address" placeholder="请选择项目地址"></el-input>
  234. </el-form-item>
  235. </el-col>
  236. <el-col :span="24">
  237. <el-form-item label="业务员:" prop="salername">
  238. <el-popover
  239. placement="bottom"
  240. trigger="manual"
  241. v-model="salesmanVisible"
  242. width="500">
  243. <selectSalesman type="2" ref="selectSalesman" :sa_projectid="form.sa_projectid" :radio="true" @onSelect="salesmanChange" @onCancel="salesmanVisible = false"></selectSalesman>
  244. <el-input readonly type="text" slot="reference" size="small" @focus="showChange('salesmanVisible')" v-model="form.salername" placeholder="请选择业务员"></el-input>
  245. </el-popover>
  246. </el-form-item>
  247. </el-col>
  248. <el-col :span="24">
  249. <el-form-item label="折扣(%):" prop="discountrate" >
  250. <el-input type="number" size="small" v-model="form.discountrate" placeholder="请输入0-100%" @change="discountrateChange"></el-input>
  251. </el-form-item>
  252. </el-col>
  253. <el-col :span="24">
  254. <el-form-item label="付款条件:" prop="paytype">
  255. <el-select v-model="form.paytype" placeholder="请选择">
  256. <el-option
  257. v-for="item in payTypeData"
  258. :key="item.value"
  259. :label="item.label"
  260. :value="item.value">
  261. </el-option>
  262. </el-select>
  263. </el-form-item>
  264. </el-col>
  265. <el-col :span="24">
  266. <el-form-item label="发货日期提醒(天):" prop="reminddays" >
  267. <el-input type="text" size="small" v-model="form.reminddays" placeholder="请输入发货日期提醒天数"></el-input>
  268. </el-form-item>
  269. </el-col>
  270. <el-col :span="24">
  271. <el-form-item label="收货人:" prop="receiptName">
  272. <el-popover
  273. placement="bottom"
  274. trigger="manual"
  275. v-model="receiptVisible"
  276. width="600">
  277. <seleteReceipt ref="receipt" type="1" @onSelect="receiptChange" @onCanel="receiptVisible = false"></seleteReceipt>
  278. <el-input readonly type="text" slot="reference" size="small" @focus="showChange('receiptVisible')" v-model="form.receiptName"></el-input>
  279. </el-popover>
  280. </el-form-item>
  281. </el-col>
  282. <el-col :span="24">
  283. <el-form-item label="收货人电话:" prop="phonenumber">
  284. <el-input disabled type="text" size="small" v-model="form.phonenumber"></el-input>
  285. </el-form-item>
  286. </el-col>
  287. <el-col :span="24">
  288. <el-form-item label="合同有效期:" prop="begdate">
  289. <input type="text" style="display:none" v-model="form.begdate">
  290. <time-select ref="timeSelect" class="inline-16" @clearSelect="clearTime" @timeChange="timeChange"></time-select>
  291. </el-form-item>
  292. </el-col>
  293. <el-col :span="24">
  294. <el-form-item label="签约日期:" prop="signdate">
  295. <el-date-picker
  296. v-model="form.signdate"
  297. value-format="yyyy-MM-dd"
  298. type="date"
  299. placeholder="选择日期">
  300. </el-date-picker>
  301. </el-form-item>
  302. </el-col>
  303. <el-col :span="24">
  304. <el-form-item label="签约金额(元):" prop="signamount">
  305. <el-input type="text" placeholder="系统自动计算" disabled size="small" v-model="form.signamount"></el-input>
  306. </el-form-item>
  307. </el-col>
  308. <el-col :span="24">
  309. <el-form-item label="合同模板:" prop="type">
  310. <el-input disabled type="text" size="small" :value="$route.query.type == '框架' ? '经销合作' : $route.query.type"></el-input>
  311. </el-form-item>
  312. </el-col>
  313. <el-col :span="24">
  314. <el-form-item label="合同描述:" prop="hrid">
  315. <el-input type="textarea" size="small" v-model="form.remarks"></el-input>
  316. </el-form-item>
  317. </el-col>
  318. </el-form>
  319. </el-row>
  320. <!--工具使用协议-->
  321. <el-row v-if="$route.query.type == '工具借用'">
  322. <el-form :model="form" :rules="rules" ref="form" label-position="right" label-width="140px" size="small">
  323. <el-col :span="24">
  324. <el-form-item label="合同标题:" prop="title">
  325. <el-input type="text" size="small" v-model="form.title" placeholder="请输入合同标题"></el-input>
  326. </el-form-item>
  327. </el-col>
  328. <el-col :span="24">
  329. <el-form-item label="企业" prop="enterprisename">
  330. <el-popover
  331. placement="bottom"
  332. trigger="manual"
  333. v-model="accountVisible"
  334. width="600">
  335. <el-tabs v-model="activeName" @tab-click="tabClick">
  336. <el-tab-pane label="客户" name="客户">
  337. <selectAgent ref="member" type="7" :param="agentListPrams" :radio="true" @onSelect="accountChange" @onCancel="accountVisible = false"></selectAgent>
  338. </el-tab-pane>
  339. <el-tab-pane label="经销商" name="经销商">
  340. <selectAgent ref="member" type="5" :param="agentListPrams" :radio="true" @onSelect="accountChange" @onCancel="accountVisible = false"></selectAgent>
  341. </el-tab-pane>
  342. </el-tabs>
  343. <!-- <selectAgent ref="member" type="10" :param="agentListPrams" :radio="true" @onSelect="accountChange" @onCancel="accountVisible = false"></selectAgent>-->
  344. <el-input readonly type="text" slot="reference" size="small" @focus="showChange('accountVisible')" v-model="form.enterprisename" placeholder="请选择企业"></el-input>
  345. </el-popover>
  346. </el-form-item>
  347. </el-col>
  348. <el-col :span="24">
  349. <el-form-item label="业务员:" prop="salername">
  350. <el-popover
  351. placement="bottom"
  352. trigger="manual"
  353. v-model="salesmanVisible"
  354. width="500">
  355. <selectSalesman type="1" ref="selectSalesman" :sys_enterpriseid="form.sys_enterpriseid" :radio="true" @onSelect="salesmanChange" @onCancel="salesmanVisible = false"></selectSalesman>
  356. <el-input readonly type="text" slot="reference" size="small" @focus="showChange('salesmanVisible')" v-model="form.salername" placeholder="请选择业务员"></el-input>
  357. </el-popover>
  358. </el-form-item>
  359. </el-col>
  360. <el-col :span="24">
  361. <el-form-item label="合同有效期:" prop="begdate">
  362. <input type="text" style="display:none" v-model="form.begdate">
  363. <time-select ref="timeSelect" class="inline-16" @clearSelect="clearTime" @timeChange="timeChange"></time-select>
  364. </el-form-item>
  365. </el-col>
  366. <el-col :span="24">
  367. <el-form-item label="签约日期:" prop="signdate">
  368. <el-date-picker
  369. v-model="form.signdate"
  370. value-format="yyyy-MM-dd"
  371. type="date"
  372. placeholder="选择日期">
  373. </el-date-picker>
  374. </el-form-item>
  375. </el-col>
  376. <el-col :span="24">
  377. <el-form-item label="单套价格(元)" prop="signamount">
  378. <el-input type="text" disabled size="small" placeholder="系统自动计算" v-model="form.signamount"></el-input>
  379. </el-form-item>
  380. </el-col>
  381. <el-col :span="24">
  382. <el-form-item label="合同模板:" prop="type">
  383. <el-input disabled type="text" size="small" :value="$route.query.type == '框架' ? '经销合作' : $route.query.type"></el-input>
  384. </el-form-item>
  385. </el-col>
  386. <el-col :span="24">
  387. <el-form-item label="合同描述:" prop="hrid">
  388. <el-input type="textarea" size="small" v-model="form.remarks"></el-input>
  389. </el-form-item>
  390. </el-col>
  391. </el-form>
  392. </el-row>
  393. <!--居间协议-->
  394. <el-row v-if="$route.query.type == '居间'">
  395. <el-form :model="form" :rules="rules" ref="form" label-position="right" label-width="135px" size="small">
  396. <el-col :span="24">
  397. <el-form-item label="合同标题:" prop="title">
  398. <el-input type="text" size="small" v-model="form.title" placeholder="请输入合同标题"></el-input>
  399. </el-form-item>
  400. </el-col>
  401. <el-col :span="24">
  402. <el-form-item label="居间商:" prop="enterprisename">
  403. <el-popover
  404. placement="bottom"
  405. trigger="manual"
  406. v-model="agentVisible"
  407. width="500">
  408. <selectAgent ref="member" type="5" :param="agentListPrams" :radio="true" @onSelect="centerChange" @onCancel="agentVisible = false"></selectAgent>
  409. <el-input readonly type="text" slot="reference" size="small" @focus="showChange('agentVisible')" v-model="form.enterprisename" placeholder="请选择居间商"></el-input>
  410. </el-popover>
  411. </el-form-item>
  412. </el-col>
  413. <el-col :span="24">
  414. <el-form-item label="项目合同:" prop="ascription_title">
  415. <el-popover
  416. placement="bottom"
  417. trigger="manual"
  418. v-model="concratVisible"
  419. width="600">
  420. <seleteProjectContract ref="project" @onSelect="concratChange" @onCanel="concratVisible=false" ></seleteProjectContract>
  421. <el-input readonly type="text" slot="reference" size="small" @focus="showChange('concratVisible')" v-model="form.ascription_title" placeholder="请选择项目合同"></el-input>
  422. </el-popover>
  423. </el-form-item>
  424. </el-col>
  425. <el-col :span="24">
  426. <el-form-item label="项目名称:" prop="projectname">
  427. <el-input disabled type="text" size="small" v-model="form.projectname" placeholder="请选择项目"></el-input>
  428. </el-form-item>
  429. </el-col>
  430. <el-col :span="24">
  431. <el-form-item label="项目编号:" prop="projectnum">
  432. <el-input disabled type="text" size="small" v-model="form.projectnum" placeholder="项目编号"></el-input>
  433. </el-form-item>
  434. </el-col>
  435. <el-col :span="24">
  436. <el-form-item label="业务员:" prop="salername">
  437. <el-popover
  438. placement="bottom"
  439. trigger="manual"
  440. v-model="salesmanVisible"
  441. width="500">
  442. <selectSalesman type="2" ref="selectSalesman" :sa_projectid="form.sa_projectid" :radio="true" @onSelect="salesmanChange" @onCancel="salesmanVisible = false"></selectSalesman>
  443. <el-input readonly type="text" slot="reference" size="small" @focus="showChange('salesmanVisible')" v-model="form.salername" placeholder="请选择业务员"></el-input>
  444. </el-popover>
  445. </el-form-item>
  446. </el-col>
  447. <el-col :span="24">
  448. <el-form-item label="签约日期:" prop="signdate">
  449. <el-date-picker
  450. v-model="form.signdate"
  451. value-format="yyyy-MM-dd"
  452. type="date"
  453. placeholder="选择日期">
  454. </el-date-picker>
  455. </el-form-item>
  456. </el-col>
  457. <el-col :span="24">
  458. <el-form-item label="计算方式" prop="calculatemodel">
  459. <el-radio-group v-model="form.calculatemodel">
  460. <el-radio label="1">按订单金额比例计算</el-radio>
  461. <el-radio label="2">按居间产品折扣计算</el-radio>
  462. </el-radio-group>
  463. </el-form-item>
  464. </el-col>
  465. <el-col :span="24" v-if="form.calculatemodel==1">
  466. <el-form-item label="订单金额比例(%):" prop="orderratio" >
  467. <el-input type="number" size="small" v-model.number="form.orderratio" placeholder="请输入0-100%" @change="orderratioChange"></el-input>
  468. </el-form-item>
  469. </el-col>
  470. <el-col :span="24" v-if="form.calculatemodel==2">
  471. <el-form-item label="居间产品折扣(%):" prop="productdiscount">
  472. <el-input type="number" size="small" v-model.number="form.productdiscount" placeholder="请输入0-100%" @change="productdiscountChange"></el-input>
  473. </el-form-item>
  474. </el-col>
  475. <el-col :span="24">
  476. <el-form-item label="合同有效期:" prop="begdate">
  477. <input type="text" style="display:none" v-model="form.begdate">
  478. <time-select ref="timeSelect" class="inline-16" @clearSelect="clearTime" @timeChange="timeChange"></time-select>
  479. </el-form-item>
  480. </el-col>
  481. <el-col :span="24">
  482. <el-form-item label="合同模板:" prop="type">
  483. <el-input disabled type="text" size="small" :value="$route.query.type == '框架' ? '经销合作' : $route.query.type"></el-input>
  484. </el-form-item>
  485. </el-col>
  486. <el-col :span="24">
  487. <el-form-item label="合同描述:" prop="hrid">
  488. <el-input type="textarea" size="small" v-model="form.remarks"></el-input>
  489. </el-form-item>
  490. </el-col>
  491. </el-form>
  492. </el-row>
  493. </div>
  494. </div>
  495. <div class="fixed__btn__panel">
  496. <el-button size="small" @click="onCancel" class="normal-btn-width">取 消</el-button>
  497. <el-button size="small" type="primary" @click="onSubmit" class="normal-btn-width">确 定</el-button>
  498. </div>
  499. </div>
  500. </template>
  501. <script>
  502. import {mapGetters} from 'vuex'
  503. import selectPople from './selectSaler'
  504. import selectAgent from './selectAgent.vue'
  505. import seleteProject from './seleteProject'
  506. import seleteProjectContract from './seleteProjectContract'
  507. import TimeSelect from './TimeSelect'
  508. import selectModel from './seleteModel'
  509. import seleteReceipt from './seleteReceipt'
  510. import selectSalesman from './selectSalesman'
  511. export default {
  512. name: '',
  513. components:{selectPople,TimeSelect,seleteProject,selectAgent,selectModel,seleteProjectContract,seleteReceipt,selectSalesman},
  514. data () {
  515. var checkNumber = (rule, value, callback) => {
  516. if (typeof +value != 'number') {
  517. return callback(new Error('请填写数字'));
  518. }
  519. callback()
  520. }
  521. var NumberSize = (rule, value, callback) => {
  522. if (+value > 100 || +value < 0 ) {
  523. return callback(new Error('折扣范围(0-100%)'));
  524. }
  525. callback()
  526. }
  527. var checkTimer = (rule, value, callback) => {
  528. if (new Date(this.form.enddate).getTime() > new Date(value).getTime() && new Date(this.form.begdate).getTime() < new Date(value).getTime()) {
  529. callback()
  530. } {
  531. return callback(new Error('签约日期必须在合同有效期内'));
  532. }
  533. }
  534. var discountrate = (rule,value,callback) =>{
  535. if (this.form.discountrate < 0 || this.form.discountrate > 100){
  536. callback(new Error('请输入0-100%'))
  537. } else {
  538. callback();
  539. }
  540. }
  541. return {
  542. activeName: '客户',
  543. agentVisible:false,
  544. salerVisible:false,
  545. projectVisible:false,
  546. accountVisible:false,
  547. modelVisible:false,
  548. concratVisible:false,
  549. receiptVisible:false,
  550. salesmanVisible:false,
  551. modelList:[],
  552. /* 新建居间项目时 所关联的居间商 */
  553. centerEnterpriseList:[],
  554. payTypeData:[],
  555. address:'',
  556. form: {
  557. "sa_contractid": 0,
  558. "sys_enterpriseid": "",
  559. "projectname":'',
  560. "projectnum":'',
  561. "begdate": "",
  562. "enddate": "",
  563. "sa_projectid": "", //可选
  564. "type": "", //可选
  565. "discountrate": '', //可选
  566. /*"saler_hrid": JSON.parse(window.sessionStorage.getItem('active_account')).hrid, //可选*/
  567. "saler_hrid":'',
  568. "signdate": "", //可选
  569. "signby": "", //可选
  570. "remarks": "", //可选
  571. "title": "",
  572. "signamount":'',
  573. /*"salername":JSON.parse(window.sessionStorage.getItem('active_account')).name,*/
  574. "salername":'',
  575. "enterprisename":'',
  576. "sys_printmodelid": '',//可选
  577. "typemx":"",//可选
  578. "modelname":"",
  579. "calculatemodel":'1',
  580. "productdiscount":'',
  581. "orderratio":'',
  582. "ascription_title":'',
  583. 'ascription_contractid':'',
  584. 'receiptName':'',
  585. "rec_contactsid":'',//收货联系人
  586. 'phonenumber':'',
  587. 'paytype':'',
  588. 'reminddays':''
  589. },
  590. rules: {
  591. title: [
  592. { required: true, message: '请填写标题', trigger: 'blur' },
  593. ],
  594. sys_enterpriseid: [
  595. { required: true, message: '请选择客户', trigger: 'change' },
  596. ],
  597. ascription_title: [
  598. { required: true, message: '请选择项目合同', trigger: 'change' },
  599. ],
  600. begdate: [
  601. { required: true, message: '请选择生效日期', trigger: 'blur' },
  602. ],
  603. projectname: [
  604. { required: true, message: '请选择项目', trigger: 'change' },
  605. ],
  606. receiptName: [
  607. { required: true, message: '请选择收货人', trigger: 'change' },
  608. ],
  609. salername: [
  610. { required: true, message: '请选择业务员', trigger: 'change' },
  611. ],
  612. enterprisename: [
  613. { required: true, message: '请选择经销商', trigger: 'change' },
  614. ],
  615. signdate: [
  616. { required: true, message: '请填写签约时间', trigger: 'change' },
  617. ],
  618. paytype: [
  619. { required: true, message: '请选择付款条件', trigger: 'change' },
  620. ],
  621. reminddays: [
  622. { required: true, message: '请设置发货日期提醒天数', trigger: 'blur' },
  623. ],
  624. productdiscount: [
  625. { message: '必须为数字', type:'number', trigger: 'change' },
  626. { required: true, message: '请填写折扣', trigger: 'blur' },
  627. /* { validator: checkNumber, trigger: 'blur'},*/
  628. { validator: NumberSize, trigger: 'blur'}
  629. ],
  630. orderratio: [
  631. { message: '必须为数字', type:'number', trigger: 'change' },
  632. { required: true, message: '请填写折扣', trigger: 'blur' },
  633. /* { validator: checkNumber, trigger: 'blur'},*/
  634. { validator: NumberSize, trigger: 'blur'}
  635. ],
  636. salername: [
  637. { required: true, message: '请选择经销商', trigger: 'change' },
  638. ],
  639. discountrate: [
  640. /* { validator: checkNumber, trigger: 'blur'},*/
  641. { validator: NumberSize, trigger: 'blur'}
  642. ],
  643. },
  644. salerListParams: {
  645. "id": 20221122153902,
  646. "content": {
  647. "pageNumber": 1,
  648. "pageSize": 20,
  649. "where": {
  650. "condition": ""
  651. }
  652. },
  653. },
  654. agentListPrams: {
  655. "id": 20220920083901,
  656. "content": {
  657. "pageNumber": 1,
  658. "pageSize": 20,
  659. "where": {
  660. "condition": "",
  661. "type":5,
  662. "typemx":"",
  663. }
  664. }
  665. },
  666. salsemanParam:{
  667. "id":20230305201202,
  668. "content":{
  669. "type":'',//type:1经销商合作协议,2:经销项目协议,直销项目协议,居间协议,3:工具借用协议
  670. "sys_enterpriseid":'',//type=1或3时传
  671. "sa_projectid":'' //type=2时传
  672. }
  673. }
  674. };
  675. },
  676. computed: {
  677. ...mapGetters({
  678. DrawerShow:'DrawerShow'
  679. })
  680. },
  681. watch: {
  682. 'DrawerShow': {
  683. handler (val) {
  684. if (!val) {
  685. this.showChange(false)
  686. if (this.$refs.form) this.$refs.form.resetFields()
  687. this.onCancel()
  688. this.$refs.timeSelect.time = ''
  689. } else {
  690. if(this.$refs.member) this.$refs.member.listData()
  691. if(this.$refs.project) {
  692. this.$refs.project.params.content.type = this.$route.query.type == '经销项目' ? '2' : '1'
  693. console.log(this.$refs.project.params.content.type,'项目类型');
  694. this.$refs.project.queryEnterpriseArchives()
  695. }
  696. }
  697. },
  698. immediate:true,
  699. },
  700. },
  701. created () {
  702. this.form = {
  703. "sa_contractid": 0,
  704. "sys_enterpriseid": "",
  705. "projectname":'',
  706. "projectnum":'',
  707. "begdate": "",
  708. "enddate": "",
  709. "sa_projectid": "", //可选
  710. "type": "", //可选
  711. "discountrate": '', //可选
  712. /*"saler_hrid": JSON.parse(window.sessionStorage.getItem('active_account')).hrid, //可选*/
  713. "saler_hrid":"",
  714. "signdate": "", //可选
  715. "signby": "", //可选
  716. "remarks": "", //可选
  717. "title": "",
  718. "signamount":'',
  719. /*"salername":JSON.parse(window.sessionStorage.getItem('active_account')).name,*/
  720. "salername":"",
  721. "enterprisename":'',
  722. "sys_printmodelid": '',//可选
  723. "typemx":"",//可选
  724. "modelname":"",
  725. "calculatemodel":'1',
  726. "productdiscount":'',
  727. "orderratio":'',
  728. "ascription_title":'',
  729. 'ascription_contractid':'',
  730. 'receiptName':'',
  731. "rec_contactsid":'',//收货联系人
  732. 'phonenumber':'',
  733. 'paytype':'',
  734. 'reminddays':''
  735. }
  736. this.payTypeList()
  737. },
  738. methods: {
  739. async onSubmit () {
  740. this.$refs.form.validate(async val => {
  741. if (val) {
  742. /* 居间新建 */
  743. if (this.$route.query.type == '居间') {
  744. let is = this.centerEnterpriseList.some(item => item.sys_enterpriseid == this.form.sys_enterpriseid)
  745. if (is) {
  746. this.$confirm('该项目商机已存在居间服务商,不可创建','提示',{
  747. cancelButtonText:'取消',
  748. showConfirmButton:false
  749. }).then(() => {
  750. })
  751. } else {
  752. if (this.$route.query.type == '直销项目') {
  753. this.form.type = '项目'
  754. this.form.typemx = '直销'
  755. } else if (this.$route.query.type == '经销项目') {
  756. this.form.type = '项目'
  757. this.form.typemx = '经销'
  758. } else {
  759. this.form.type = this.$route.query.type
  760. }
  761. this.form.discountrate ? this.form.discountrate = (this.form.discountrate / 100).toFixed(4) : ''
  762. this.form.productdiscount ? this.form.productdiscount = (this.form.productdiscount / 100).toFixed(4) : ''
  763. this.form.orderratio ? this.form.orderratio = (this.form.orderratio / 100).toFixed(4) : ''
  764. let res = await this.$api.requested({
  765. "id":20221121185302,
  766. "content": this.form
  767. })
  768. this.tool.showMessage(res,() => {
  769. console.log(res.data);
  770. this.$store.dispatch('DrawerShowChange',false)
  771. this.$store.dispatch('changeDetailDrawer',true)
  772. this.$router.push({path:'/contractDetail',query:{type:this.$route.query.type,id:res.data.sa_contractid,rowindex:res.data.rowindex}})
  773. })
  774. }
  775. } else {
  776. /* 其它新建 */
  777. if (this.$route.query.type == '直销项目') {
  778. this.form.type = '项目'
  779. this.form.typemx = '直销'
  780. } else if (this.$route.query.type == '经销项目') {
  781. this.form.type = '项目'
  782. this.form.typemx = '经销'
  783. } else {
  784. this.form.type = this.$route.query.type
  785. }
  786. this.form.discountrate ? this.form.discountrate = (this.form.discountrate / 100).toFixed(4) : ''
  787. this.form.productdiscount ? this.form.productdiscount = (this.form.productdiscount / 100).toFixed(4) : ''
  788. this.form.orderratio ? this.form.orderratio = (this.form.orderratio / 100).toFixed(4) : ''
  789. let res = await this.$api.requested({
  790. "id":20221121185302,
  791. "content": this.form
  792. })
  793. this.tool.showMessage(res,() => {
  794. console.log(res.data);
  795. this.$store.dispatch('DrawerShowChange',false)
  796. this.$store.dispatch('changeDetailDrawer',true)
  797. this.$router.push({path:'/contractDetail',query:{type:this.$route.query.type,id:res.data.sa_contractid,rowindex:res.data.rowindex}})
  798. })
  799. }
  800. }
  801. })
  802. },
  803. onCancel () {
  804. this.$store.dispatch('DrawerShowChange',false)
  805. this.$refs.form.resetFields()
  806. this.form = {
  807. "sa_contractid": 0,
  808. "sys_enterpriseid": "",
  809. "projectname":'',
  810. "projectnum":"",
  811. "begdate": "",
  812. "enddate": "",
  813. "sa_projectid": "", //可选
  814. "type": "", //可选
  815. "discountrate": '', //可选
  816. /*"saler_hrid": JSON.parse(window.sessionStorage.getItem('active_account')).hrid, //可选*/
  817. "saler_hrid":'',
  818. "signdate": "", //可选
  819. "signby": "", //可选
  820. "remarks": "", //可选
  821. "title": "",
  822. "signamount":'',
  823. /*"salername":JSON.parse(window.sessionStorage.getItem('active_account')).name,*/
  824. "salername":'',
  825. "enterprisename":'',
  826. "sys_printmodelid": '',//可选
  827. "typemx":"",//可选
  828. "modelname":"",
  829. "calculatemodel":'1',
  830. "productdiscount":'',
  831. "orderratio":'',
  832. "ascription_title":'',
  833. 'ascription_contractid':'',
  834. 'receiptName':'',
  835. "rec_contactsid":'',//收货联系人
  836. 'phonenumber':''
  837. }
  838. this.$refs.member.selected = []
  839. this.$refs.selectSalesman.selected = []
  840. this.address = ''
  841. this.agentVisible = false
  842. this.salerVisible = false
  843. this.projectVisible = false
  844. this.accountVisible = false
  845. this.modelVisible = false
  846. this.concratVisible = false
  847. this.receiptVisible = false
  848. this.salesmanVisible = false
  849. },
  850. showChange (key) {
  851. this.agentVisible = false
  852. this.salerVisible = false
  853. this.projectVisible = false
  854. this.accountVisible = false
  855. this.modelVisible = false
  856. this.concratVisible = false
  857. this.receiptVisible = false
  858. this.salesmanVisible = false
  859. if (key === 'projectVisible'){
  860. if (this.form.sys_enterpriseid !== ''){
  861. this.$refs.project.params.content.sys_enterpriseid = this.form.sys_enterpriseid
  862. this.$refs.project.queryEnterpriseArchives()
  863. key ? this[key] = true : ''
  864. }else {
  865. this.$refs.form.validateField("enterprisename")
  866. this.$refs.form.validateField("sys_enterpriseid")
  867. }
  868. }else if (key === 'receiptVisible'){
  869. if (this.form.sys_enterpriseid !== ''){
  870. this.$refs.receipt.params.content.sys_enterpriseid = this.form.sys_enterpriseid
  871. this.$refs.receipt.queryReceipts()
  872. key ? this[key] = true : ''
  873. }else {
  874. this.$refs.form.validateField("enterprisename")
  875. this.$refs.form.validateField("sys_enterpriseid")
  876. }
  877. }else if(key === 'concratVisible'){
  878. this.$refs.project.queryEnterpriseArchives()
  879. key ? this[key] = true : ''
  880. }else if(key === 'salesmanVisible'){
  881. this.$refs.selectSalesman.listData()
  882. key ? this[key] = true : ''
  883. }else {
  884. key ? this[key] = true : ''
  885. }
  886. this.$refs.member.listData()
  887. },
  888. agentChange (data) {
  889. this.form.sys_enterpriseid = data[0].sys_enterpriseid
  890. this.form.enterprisename = data[0].enterprisename
  891. this.agentVisible = false
  892. if (this.$route.query.type == '框架'){
  893. this.salsemanParam.content.type = 1
  894. this.salsemanParam.content.sys_enterpriseid = this.form.sys_enterpriseid
  895. this.querySalse()
  896. }
  897. },
  898. async querySalse(){
  899. const res = await this.$api.requested(this.salsemanParam)
  900. console.log("res",res)
  901. this.form.salername = res.data[0].name
  902. this.form.saler_hrid = res.data[0].hrid
  903. },
  904. salesmanChange(data){
  905. console.log(data,"业务员")
  906. this.form.salername = data[0].name
  907. this.form.saler_hrid = data[0].hrid
  908. this.salesmanVisible = false
  909. },
  910. salerChange (data) {
  911. this.form.saler_hrid = data[0].hrid
  912. this.form.saler_name = data[0].name
  913. this.salerVisible = false
  914. },
  915. projectChange (data) {
  916. this.form.projectname = data.projectname
  917. this.form.projectnum = data.projectnum
  918. this.form.sa_projectid = data.sa_projectid
  919. this.address = data.province + data.city + data.county + data.address
  920. this.projectVisible = false
  921. this.salsemanParam.content.type = 2
  922. this.salsemanParam.content.sa_projectid = this.form.sa_projectid
  923. this.querySalse()
  924. },
  925. receiptChange (data) {
  926. this.form.receiptName = data.name
  927. this.form.phonenumber = data.phonenumber
  928. this.form.rec_contactsid = data.contactsid
  929. this.receiptVisible = false
  930. },
  931. accountChange (data) {
  932. this.form.enterprisename = data[0].enterprisename
  933. this.form.sys_enterpriseid = data[0].sys_enterpriseid
  934. this.accountVisible = false
  935. if (this.$route.query.type == '工具借用'){
  936. this.salsemanParam.content.type = 3
  937. this.salsemanParam.content.sys_enterpriseid = this.form.sys_enterpriseid
  938. this.querySalse()
  939. }
  940. },
  941. centerChange (data) {
  942. this.form.enterprisename = data[0].enterprisename
  943. this.form.sys_enterpriseid = data[0].sys_enterpriseid
  944. this.agentVisible = false
  945. },
  946. concratChange (data) {
  947. console.log(data,"输出")
  948. this.centerEnterpriseList = data.parties
  949. this.form.ascription_title = data.projectname
  950. this.form.ascription_contractid = data.sa_contractid
  951. this.form.projectname = data.projectname
  952. this.form.projectnum = data.projectnum
  953. this.form.sa_projectid = data.sa_projectid
  954. this.concratVisible = false
  955. this.salsemanParam.content.type = 2
  956. this.salsemanParam.content.sa_projectid = this.form.sa_projectid
  957. this.querySalse()
  958. },
  959. modelChange (data) {
  960. this.form.modelname = data.modelname
  961. console.log(this.form.modelname);
  962. this.form.sys_printmodelid = data.sys_printmodelid
  963. this.modelVisible = false
  964. },
  965. clearTime () {
  966. this.form.begdate = ''
  967. this.form.enddate = ''
  968. },
  969. timeChange (time) {
  970. this.form.begdate = time[0]
  971. this.form.enddate = time[1]
  972. },
  973. async getModelList () {
  974. let res = await this.$api.requested({
  975. "id": 20221121155801,
  976. "content": {
  977. "pageNumber": 1,
  978. "pageSize": 999999,
  979. "where":{
  980. "condition":""
  981. }
  982. }
  983. })
  984. this.modelList = res.data
  985. console.log(this.modelList);
  986. },
  987. tabClick(){
  988. console.log(this.activeName)
  989. if (this.activeName === '客户'){
  990. this.agentListPrams.content.where.type = '7'
  991. this.$refs.member.listData()
  992. }else {
  993. this.agentListPrams.content.where.type = '5'
  994. this.$refs.member.listData()
  995. }
  996. },
  997. /*获取付款条件*/
  998. async payTypeList(){
  999. const res = await this.$api.requested({
  1000. id: "20230110100103",
  1001. content: {
  1002. pageNumber: 1,
  1003. pageSize:50,
  1004. where: {condition: ""},
  1005. }
  1006. })
  1007. console.log(res,'res')
  1008. this.payTypeData = res.data.map((item,index)=>{
  1009. /*if (item.point === '订单审核'){
  1010. return {
  1011. label:item.ruleno + '\xa0 \xa0 \xa0 \xa0' + item.point + '\xa0 \xa0 \xa0 \xa0' + "立账额度" + (item.amountrate * 100) +'% ' + '\xa0 \xa0 \xa0 \xa0' + '后置天数' + item.days + '天',
  1012. value:item.ruleno + '' + item.point + '' + "立账额度" + (item.amountrate * 100) +'% ' + '' + '后置天数' + item.days + '天',
  1013. }
  1014. }else {
  1015. return {
  1016. label:item.ruleno + '\xa0 \xa0 \xa0 \xa0' + item.point + '\xa0 \xa0 \xa0 \xa0' + '后置天数' + item.days + '天',
  1017. value:item.ruleno + '' + item.point + '' + '后置天数' + item.days + '天',
  1018. }
  1019. }*/
  1020. return {
  1021. label:item.ruleno + '-' + item.remarks,
  1022. value:item.ruleno + '-' + item.remarks
  1023. }
  1024. })
  1025. /* res.data.forEach((item,index)=>{
  1026. if (item.point === '订单审核'){
  1027. this.payTypeData[index] = item.ruleno + ' ' + item.point + ' ' + "立账额度" + (item.amountrate * 100) +'% ' + '后置天数' + item.days
  1028. }else {
  1029. this.payTypeData[index] = item.ruleno + ' ' + item.point + ' ' + '后置天数' + item.days
  1030. }
  1031. })*/
  1032. console.log(this.payTypeData,'处理后数据')
  1033. },
  1034. discountrateChange(){
  1035. this.form.discountrate = Math.round(this.form.discountrate * 100)/100
  1036. },
  1037. orderratioChange(){
  1038. this.form.orderratio = Math.round(this.form.orderratio * 100)/100
  1039. },
  1040. productdiscountChange(){
  1041. this.form.productdiscount = Math.round(this.form.productdiscount * 100)/100
  1042. }
  1043. },
  1044. mounted() {
  1045. this.payTypeList()
  1046. }
  1047. };
  1048. </script>
  1049. <style scoped>
  1050. * {
  1051. box-sizing: border-box;
  1052. }
  1053. .header_info {
  1054. background: #ffffff;
  1055. padding: 16px 16px 0 16px;
  1056. margin-bottom: 16px;
  1057. }
  1058. /deep/.el-select,.el-input,.el-date-editor {
  1059. width: 100% !important;
  1060. }
  1061. </style>