DistributionManage.vue 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999
  1. <template>
  2. <div>
  3. <el-main ref="elMain" style="padding: 0px">
  4. <Split :gutterSize="2" style="height: calc(100vh - 120px)">
  5. <!-- 左侧树Start -->
  6. <SplitArea :size="leftSplitWidth" :minSize="240">
  7. <div>
  8. <div>
  9. <el-checkbox v-model="containsSubDept">包含下级机构</el-checkbox>
  10. <kt-button
  11. style="margin-left: 15px; margin-bottom: 10px"
  12. icon="el-icon-plus"
  13. label="添加分销"
  14. type="primary"
  15. perms="sys:distributionManage:add"
  16. @click="handleAddButton"
  17. />
  18. </div>
  19. <el-divider></el-divider>
  20. <tree
  21. :setting="ztreeSetting"
  22. :nodes="ztreeNodes"
  23. @onClick="onZTreeClick"
  24. @onCreated="onZTreeCreated"
  25. />
  26. </div>
  27. </SplitArea>
  28. <!-- 左侧树End -->
  29. <!-- 右侧列表页面Start -->
  30. <SplitArea :size="rightSplitWidth">
  31. <el-row class="queryFrom">
  32. <el-form ref="queryFormRef" :model="queryFrom" label-width="80px">
  33. <el-row>
  34. <el-col :span="5">
  35. <el-form-item label="分销级别">
  36. <el-select
  37. clearable
  38. size="small"
  39. v-model="queryFrom.retailtype"
  40. placeholder="请选择"
  41. >
  42. <el-option label="一级分销" value="1"></el-option>
  43. <el-option label="二级分销" value="2"></el-option>
  44. </el-select>
  45. </el-form-item>
  46. </el-col>
  47. <el-col :span="5">
  48. <el-form-item label="业务来源">
  49. <el-select
  50. clearable
  51. size="small"
  52. v-model="queryFrom.source"
  53. placeholder="请选择"
  54. >
  55. <el-option
  56. v-for="val in organizationSourceoptions"
  57. :key="val.dictValue"
  58. :label="val.dictTag"
  59. :value="val.dictValue"
  60. ></el-option>
  61. </el-select>
  62. </el-form-item>
  63. </el-col>
  64. <!-- <el-col :span="5">
  65. <el-form-item label="机构">
  66. <el-select
  67. clearable
  68. size="small"
  69. v-model="queryFrom.retailtype"
  70. placeholder="请选择"
  71. >
  72. <el-option label="一级分销" value="1"></el-option>
  73. <el-option label="二级分销" value="2"></el-option>
  74. </el-select>
  75. </el-form-item>
  76. </el-col> -->
  77. <el-col :span="4">
  78. <el-form-item label="">
  79. <el-button size="small" type="primary" @click="queryInfo"
  80. >查询</el-button
  81. >
  82. <el-button
  83. size="small"
  84. type="primary"
  85. @click="batchOperation"
  86. :disabled="selectIds.length < 1"
  87. >批量设置</el-button
  88. >
  89. </el-form-item>
  90. </el-col>
  91. </el-row>
  92. </el-form>
  93. </el-row>
  94. <kt-common-table
  95. permsEdit="sys:distributionManage:edit"
  96. permsDelete="sys:distributionManage:delete"
  97. :data="pageResult"
  98. :columns="columns"
  99. editButtonName="编辑"
  100. deleteButtonName="删除"
  101. :showBatchDelete="false"
  102. @findPage="findPage"
  103. @handleEdit="handleTableEdit"
  104. deleteName="批量删除"
  105. @handleDeleteFlag="handleTableDeleteFlag"
  106. @handleDelete="handleTableBatchDelete"
  107. :select="true"
  108. @selectionChange="selectionChange"
  109. >
  110. <template slot="scope">
  111. {{ 123 }}
  112. </template>
  113. </kt-common-table>
  114. </SplitArea>
  115. <!-- 右侧列表页面End -->
  116. </Split>
  117. </el-main>
  118. <el-dialog
  119. v-dialogDrag
  120. title="分销管理"
  121. :visible.sync="dialogVisible"
  122. width="1200px"
  123. @close="closeDialog"
  124. :before-close="handleDialogBefore"
  125. >
  126. <el-tabs v-model="activeTabs">
  127. <el-tab-pane label="行政信息" name="first">
  128. <el-form label-width="120px">
  129. <el-row>
  130. <el-col :span="8">
  131. <el-form-item label="机构编码">
  132. <el-input
  133. size="medium"
  134. style="width: 100%"
  135. :value="deptInfo.id"
  136. disabled
  137. ></el-input>
  138. </el-form-item>
  139. </el-col>
  140. <el-col :span="8">
  141. <el-form-item label="机构名称">
  142. <el-input
  143. size="medium"
  144. style="width: 100%"
  145. :value="deptInfo.name"
  146. disabled
  147. ></el-input>
  148. </el-form-item>
  149. </el-col>
  150. <el-col :span="8">
  151. <el-form-item label="上级机构编码">
  152. <el-input
  153. size="medium"
  154. style="width: 100%"
  155. :value="deptInfo.parentId"
  156. disabled
  157. ></el-input>
  158. </el-form-item>
  159. </el-col>
  160. </el-row>
  161. <el-row>
  162. <el-col :span="8">
  163. <el-form-item label="机构类型">
  164. <el-select
  165. size="medium"
  166. style="width: 100%"
  167. disabled
  168. :value="deptInfo.comtype"
  169. placeholder="请选择"
  170. >
  171. <el-option
  172. v-for="item in comtypeoptions"
  173. :key="item.label"
  174. :label="item.label"
  175. :value="item.value"
  176. ></el-option>
  177. </el-select>
  178. </el-form-item>
  179. </el-col>
  180. <el-col :span="8">
  181. <el-form-item label="机构级别">
  182. <el-select
  183. size="medium"
  184. style="width: 100%"
  185. disabled
  186. :value="deptInfo.comlevel"
  187. placeholder="请选择"
  188. >
  189. <el-option
  190. v-for="item in comleveloptions"
  191. :key="item.label"
  192. :label="item.label"
  193. :value="item.value"
  194. ></el-option>
  195. </el-select>
  196. </el-form-item>
  197. </el-col>
  198. <el-col :span="8">
  199. <el-form-item label="机构性质">
  200. <el-select
  201. size="medium"
  202. style="width: 100%"
  203. disabled
  204. :value="deptInfo.comattribute"
  205. placeholder="请选择"
  206. >
  207. <el-option
  208. v-for="item in comattributeoptions"
  209. :key="item.label"
  210. :label="item.label"
  211. :value="item.value"
  212. ></el-option>
  213. </el-select>
  214. </el-form-item>
  215. </el-col>
  216. </el-row>
  217. <el-row>
  218. <el-col :span="24">
  219. <el-form-item label="机构地址" style="width: 100%">
  220. <el-input
  221. size="medium"
  222. type="textarea"
  223. :rows="3"
  224. style="width: 100%"
  225. :autosize="{ minRows: 3, maxRows: 4 }"
  226. placeholder="请输入内容"
  227. :value="deptInfo.address"
  228. disabled
  229. >
  230. </el-input>
  231. </el-form-item>
  232. </el-col>
  233. </el-row>
  234. <el-row>
  235. <el-col :span="8">
  236. <el-form-item label="团队编码">
  237. <el-input
  238. size="medium"
  239. style="width: 100%"
  240. :value="deptInfo.teamid"
  241. disabled
  242. ></el-input>
  243. </el-form-item>
  244. </el-col>
  245. <el-col :span="8">
  246. <el-form-item label="团队名称">
  247. <el-input
  248. size="medium"
  249. style="width: 100%"
  250. :value="deptInfo.teamname"
  251. disabled
  252. ></el-input>
  253. </el-form-item>
  254. </el-col>
  255. </el-row>
  256. </el-form>
  257. </el-tab-pane>
  258. <el-tab-pane label="分佣设置" name="second">
  259. <el-form v-model="distributionForm" label-width="120px">
  260. <el-form-item label="分销方式:">
  261. <el-radio-group
  262. v-model="distributionForm.retailtype"
  263. @change="retailtypeChange"
  264. >
  265. <el-row style="margin: 15px 0px"
  266. ><el-radio label="1">一级分销</el-radio></el-row
  267. >
  268. <el-row style="margin: 15px 0px"
  269. ><el-radio label="2">二级分销</el-radio></el-row
  270. >
  271. <el-row style="margin: 15px 0px"
  272. ><el-radio label="3">三级分销</el-radio></el-row
  273. >
  274. <el-row style="margin: 15px 0px"
  275. ><el-radio label="0">无分销分式</el-radio></el-row
  276. >
  277. </el-radio-group>
  278. </el-form-item>
  279. </el-form>
  280. <el-table
  281. :data="retailSettingForm"
  282. border
  283. style="width: 100%"
  284. :span-method="arraySpanMethod"
  285. >
  286. <el-table-column label="佣金级别" align="center" prop="retailLevel">
  287. <template slot-scope="scope">
  288. {{ scope.row.retailLevel }}级佣金
  289. </template>
  290. </el-table-column>
  291. <el-table-column
  292. label="佣金比例(%)"
  293. align="center"
  294. prop="retailRate"
  295. >
  296. <template slot-scope="scope">
  297. <el-input-number
  298. v-model="scope.row.retailRate"
  299. :precision="2"
  300. :min="0"
  301. :step="0.01"
  302. :max="100"
  303. ></el-input-number>
  304. </template>
  305. </el-table-column>
  306. <el-table-column label="说明" align="center" width="700">
  307. <template slot-scope="scope">
  308. <template v-if="distributionForm.retailtype == 1">
  309. <img
  310. src="@/assets/image/distribution/distribution1.png"
  311. width="600px"
  312. />
  313. </template>
  314. <template v-if="distributionForm.retailtype == 2">
  315. <img
  316. src="@/assets/image/distribution/distribution2.png"
  317. width="600px"
  318. />
  319. </template>
  320. <template v-if="distributionForm.retailtype == 3">
  321. <img
  322. src="@/assets/image/distribution/distribution3.png"
  323. width="600px"
  324. />
  325. </template>
  326. </template>
  327. </el-table-column>
  328. </el-table>
  329. </el-tab-pane>
  330. </el-tabs>
  331. <span slot="footer" class="dialog-footer" v-if="activeTabs == 'second'">
  332. <el-button size="small" @click="dialogVisible = false">取 消</el-button>
  333. <el-button size="small" type="primary" @click="comfirmRetail"
  334. >确 定</el-button
  335. >
  336. </span>
  337. </el-dialog>
  338. <el-dialog
  339. v-dialogDrag
  340. title="分销管理"
  341. :visible.sync="batcnVisible"
  342. width="1200px"
  343. @close="closeDialog"
  344. :before-close="handleDialogBefore"
  345. >
  346. <el-tabs v-model="activeTabs">
  347. <el-form v-model="distributionForm" label-width="120px">
  348. <el-form-item label="分销方式:">
  349. <el-radio-group
  350. v-model="distributionForm.retailtype"
  351. @change="retailtypeChange"
  352. >
  353. <el-row style="margin: 15px 0px"
  354. ><el-radio label="1">一级分销</el-radio></el-row
  355. >
  356. <el-row style="margin: 15px 0px"
  357. ><el-radio label="2">二级分销</el-radio></el-row
  358. >
  359. <el-row style="margin: 15px 0px"
  360. ><el-radio label="3">三级分销</el-radio></el-row
  361. >
  362. <el-row style="margin: 15px 0px"
  363. ><el-radio label="0">无分销分式</el-radio></el-row
  364. >
  365. </el-radio-group>
  366. </el-form-item>
  367. </el-form>
  368. <el-table
  369. :data="retailSettingForm"
  370. border
  371. style="width: 100%"
  372. :span-method="arraySpanMethod"
  373. >
  374. <el-table-column label="佣金级别" align="center" prop="retailLevel">
  375. <template slot-scope="scope">
  376. {{ scope.row.retailLevel }}级佣金
  377. </template>
  378. </el-table-column>
  379. <el-table-column label="佣金比例(%)" align="center" prop="retailRate">
  380. <template slot-scope="scope">
  381. <el-input-number
  382. v-model="scope.row.retailRate"
  383. :precision="2"
  384. :min="0"
  385. :step="0.01"
  386. :max="100"
  387. ></el-input-number>
  388. </template>
  389. </el-table-column>
  390. <el-table-column label="说明" align="center" width="700">
  391. <template slot-scope="scope">
  392. <template v-if="distributionForm.retailtype == 1">
  393. <img
  394. src="@/assets/image/distribution/distribution1.png"
  395. width="600px"
  396. />
  397. </template>
  398. <template v-if="distributionForm.retailtype == 2">
  399. <img
  400. src="@/assets/image/distribution/distribution2.png"
  401. width="600px"
  402. />
  403. </template>
  404. <template v-if="distributionForm.retailtype == 3">
  405. <img
  406. src="@/assets/image/distribution/distribution3.png"
  407. width="600px"
  408. />
  409. </template>
  410. </template>
  411. </el-table-column>
  412. </el-table>
  413. </el-tabs>
  414. <span slot="footer" class="dialog-footer">
  415. <el-button size="small" @click="batcnVisible = false">取 消</el-button>
  416. <el-button size="small" type="primary" @click="comfirmBatch"
  417. >确 定</el-button
  418. >
  419. </span>
  420. </el-dialog>
  421. </div>
  422. </template>
  423. <script>
  424. import Cookies from "js-cookie";
  425. import KtButton from "@/views/Core/KtButton"; // 按钮权限组件
  426. import tree from "@/components/ztree.vue"; // 机构树组件
  427. import KtCommonTable from "@/views/Core/KtCommonTable.vue"; //表格组件
  428. import CommonUtil from "@/utils/comutil.js";
  429. import { create } from "tinymce";
  430. export default {
  431. components: {
  432. KtButton,
  433. tree,
  434. KtCommonTable,
  435. },
  436. data() {
  437. return {
  438. peopleid: "",
  439. peopledeptid: "",
  440. /**Split 开始 */
  441. leftSplitWidth: 20,
  442. rightSplitWidth: 80,
  443. /**Split 结束 */
  444. containsSubDept: true,
  445. //----ztreeLeft begin---------
  446. ztreeObj: null,
  447. ztreeSetting: {
  448. check: {
  449. enable: false,
  450. },
  451. data: {
  452. simpleData: {
  453. enable: true,
  454. pIdKey: "parentId",
  455. },
  456. },
  457. view: {
  458. showIcon: false,
  459. },
  460. },
  461. ztreeNodes: [],
  462. currentTreeNode: null,
  463. //----ztreeLeft end---------
  464. //------------下拉框数据字典 begin-----------------
  465. comleveloptions: [],
  466. comattributeoptions: [],
  467. comtypeoptions: [],
  468. //------------下拉框数据字典 end-----------------
  469. // 弹出框start-------
  470. dialogVisible: false,
  471. activeTabs: "first",
  472. deptInfo: {},
  473. retailSettingForm: [],
  474. distributionForm: {
  475. id: "",
  476. retailtype: "", //分销方式
  477. disrate1: 0, //一级分销比例
  478. disrate2: 0, //二级分销比例
  479. disrate3: 0, //三级分销比例ss
  480. creator: "", //创建人
  481. createtime: "", //创建时间
  482. },
  483. // 弹出框 End--------
  484. // 右侧列表查询数据Start
  485. queryFrom: {
  486. retailtype: "",
  487. source: "",
  488. },
  489. pageResult: {},
  490. pageRequest: {
  491. //查询的默认条件
  492. pageNum: 1,
  493. pageSize: 20,
  494. columnFilters: {
  495. deptid: {
  496. name: "deptid",
  497. value: "",
  498. },
  499. containsSubDept: {
  500. name: "containsSubDept",
  501. value: "1",
  502. },
  503. retailtype: {
  504. name: "retailtype",
  505. value: "",
  506. },
  507. source: {
  508. name: "source",
  509. value: "",
  510. },
  511. // "status":{
  512. // "name":"status",
  513. // "value":"2"
  514. // }
  515. },
  516. },
  517. columns: [
  518. // 数据列
  519. { prop: "id", label: "分销编码", minWidth: 80, sortable: false },
  520. { prop: "deptid", label: "团队编码", minWidth: 80, sortable: false },
  521. { prop: "deptname", label: "团队名称", minWidth: 80, sortable: false },
  522. {
  523. prop: "source",
  524. label: "业务来源",
  525. minWidth: 80,
  526. sortable: false,
  527. formatter: this.managementSourceFormatter,
  528. },
  529. {
  530. prop: "retailtype",
  531. label: "分销方式",
  532. minWidth: 80,
  533. sortable: false,
  534. },
  535. {
  536. prop: "disrate1",
  537. label: "一级佣金比例",
  538. minWidth: 80,
  539. sortable: false,
  540. },
  541. {
  542. prop: "disrate2",
  543. label: "二级佣金比例",
  544. minWidth: 80,
  545. sortable: false,
  546. },
  547. {
  548. prop: "disrate3",
  549. label: "三级佣金比例",
  550. minWidth: 80,
  551. sortable: false,
  552. },
  553. // { prop: "display",label: "是否显示用佣金",minWidth: 80,sortable: false},
  554. // { prop: "paytype",label: "提现方式",minWidth: 120,sortable: false},
  555. // { prop: "minamount",label: "最少提现额度",minWidth: 120,sortable: false},
  556. // { prop: "maxamount",label: "每日提现上限",minWidth: 100,sortable: false},
  557. // { prop: "status", label: "状态", minWidth: 70, sortable: false},
  558. { prop: "creator", label: "创建人", minWidth: 100, sortable: false },
  559. {
  560. prop: "createtime",
  561. label: "创建时间",
  562. minWidth: 100,
  563. sortable: false,
  564. },
  565. ],
  566. selectIds: [],
  567. batcnVisible: false,
  568. organizationSourceoptions: [],
  569. // 右侧列表查询数据End
  570. };
  571. },
  572. mounted() {
  573. this.findLeftTreeData(); // 获取机构树的数据
  574. //用像素初始化左边的split的宽度
  575. this.changeTreeWidth(240); // 初始化树的宽度
  576. },
  577. watch: {
  578. containsSubDept() {
  579. // 监听是否包含下级
  580. this.pageRequest.columnFilters.containsSubDept.value = this
  581. .containsSubDept
  582. ? "1"
  583. : "0";
  584. this.findPage();
  585. },
  586. },
  587. created() {
  588. this.peopleid = Cookies.get("user");
  589. if (this.peopleid != "admin") {
  590. this.peopledeptid = Cookies.get("user").split("D")[0];
  591. this.pageRequest.columnFilters.deptid.value = this.peopledeptid;
  592. } else {
  593. this.peopledeptid = "9";
  594. this.pageRequest.columnFilters.deptid.value = this.peopledeptid;
  595. }
  596. //获取所有下拉框数据(字典)
  597. this.getDictItems("comlevel");
  598. this.getDictItems("comattribute");
  599. this.getDictItems("comtype");
  600. this.$api.insCompany.dicType("organizationSource").then((res) => {
  601. if (res.code == 200) {
  602. this.columns.forEach((e) => {
  603. if (e.prop == "source") {
  604. e.options = res.data.ddList;
  605. }
  606. });
  607. this.organizationSourceoptions = res.data.ddList;
  608. }
  609. });
  610. },
  611. methods: {
  612. managementSourceFormatter(row, column) {
  613. let source = row.source;
  614. switch (source) {
  615. case "1":
  616. return <el-tag>渠道</el-tag>;
  617. case "2":
  618. return <el-tag type="success">个代</el-tag>;
  619. case "3":
  620. return <el-tag type="warning">电销</el-tag>;
  621. default:
  622. }
  623. },
  624. //批量设置
  625. batchOperation() {
  626. this.batcnVisible = true;
  627. },
  628. comfirmBatch() {
  629. if (this.distributionForm.retailtype == "") {
  630. return this.$message.info("请选择分销方式");
  631. }
  632. // if(this.distributionForm.display=''){
  633. // return this.$message.info("请选择是否显示佣金");
  634. // }]
  635. // if(this.distributionForm.paytype.length==0){
  636. // return this.$message.info("请选择提现方式");
  637. // }
  638. let param = {};
  639. Object.assign(param, this.distributionForm);
  640. // param.deptid = this.deptInfo.teamid;
  641. // param.deptname = this.deptInfo.teamname;
  642. // param.paytype = param.paytype.toString();
  643. param.disrate1 = "";
  644. param.disrate2 = "";
  645. param.disrate3 = "";
  646. for (let i = 0; i < this.retailSettingForm.length; i++) {
  647. param["disrate" + this.retailSettingForm[i].retailLevel] =
  648. this.retailSettingForm[i].retailRate;
  649. }
  650. this.$api.retail
  651. .saveRetailBatch({
  652. disrate1: param.disrate1,
  653. disrate2: param.disrate2,
  654. disrate3: param.disrate3,
  655. retailLevel: param.retailLevel,
  656. ids: this.selectIds,
  657. })
  658. .then((res) => {
  659. if (res.code == 200) {
  660. this.$message.success("操作成功");
  661. this.findPage();
  662. this.batcnVisible = false;
  663. } else {
  664. this.$message.info("操作失败 " + res.msg);
  665. }
  666. })
  667. .catch((err) => {
  668. this.$message.error("操作失败");
  669. });
  670. },
  671. selectionChange({ selections }) {
  672. // console.log(selections);
  673. this.selectIds = selections.map((v) => {
  674. return v.deptid;
  675. });
  676. // console.log(this.selectIds);
  677. },
  678. /**Split 开始 */
  679. changeTreeWidth(widthVal) {
  680. // 初始化树的宽度
  681. this.leftSplitWidth = Math.ceil(
  682. (widthVal / this.$refs.elMain.$el.clientWidth) * 100
  683. );
  684. this.rightSplitWidth = 100 - this.leftSplitWidth;
  685. },
  686. /**Split 结束 */
  687. getDictItems(typeName) {
  688. //--数据字典--
  689. this.$api.dict
  690. .findByLableName(typeName)
  691. .then((response) => {
  692. this[typeName + "options"] = response.data; // 把获取到的数据赋给this.data
  693. })
  694. .catch((error) => {
  695. this[typeName + "options"] = [];
  696. });
  697. },
  698. //--left tree begin-------
  699. findLeftTreeData: function () {
  700. // 获取数据
  701. this.$api.dept.findTree().then((res) => {
  702. this.treeDataRecursion(res.data, 2);
  703. this.ztreeNodes = res.data;
  704. });
  705. this.$api.dept.findTree().then((res) => {
  706. this.ztreeNodes = res.data;
  707. });
  708. },
  709. //树过滤五级机构递归
  710. treeDataRecursion(data, num, one) {
  711. data = data || this.ztreeNodes;
  712. one = one || 0;
  713. one++;
  714. for (let i = 0; i < data.length; i++) {
  715. if (data[i].comlevel == 5 && data[i].managementSource != num) {
  716. data.splice(i, 1);
  717. i = i - 1;
  718. } else {
  719. this.treeDataRecursion(data[i].children, num, one);
  720. }
  721. }
  722. },
  723. onZTreeCreated: function (ztreeObj) {
  724. this.ztreeObj = ztreeObj;
  725. // onCreated 中操作ztreeObj对象展开第一个节点
  726. ztreeObj.expandNode(ztreeObj.getNodes()[0], true);
  727. this.currentTreeNode = ztreeObj.getNodes()[0];
  728. },
  729. onZTreeClick: function (evt, treeId, treeNode) {
  730. // 点击事件
  731. this.currentTreeNode = treeNode;
  732. this.pageRequest.columnFilters.deptid.value = this.currentTreeNode.id;
  733. this.findPage();
  734. },
  735. //--left tree start-------
  736. // 查询Start
  737. queryInfo(val) {
  738. this.pageRequest.columnFilters.retailtype.value =
  739. this.queryFrom.retailtype;
  740. this.pageRequest.columnFilters.source.value = this.queryFrom.source;
  741. this.pageRequest.pageNum = 1;
  742. this.findPage();
  743. },
  744. // 查询End
  745. // 右侧工具方法Start
  746. handleAddButton() {
  747. if (this.currentTreeNode == null) {
  748. return this.$message.info("请选择门店下团队");
  749. }
  750. this.activeTabs = "first";
  751. // 查询机构信息
  752. this.$api.dept.getDeptById(this.currentTreeNode.id).then((res) => {
  753. if (res.data.deptType == "D" && res.data.id.indexOf("M") >= 0) {
  754. this.$api.dept.getDeptById(res.data.parentId).then((result) => {
  755. this.deptInfo = result.data;
  756. this.deptInfo.teamid = res.data.id;
  757. this.deptInfo.teamname = res.data.name;
  758. this.dialogVisible = true;
  759. });
  760. } else {
  761. return this.$message.info("请选择门店下团队");
  762. }
  763. });
  764. },
  765. handleDialogBefore(done) {
  766. // 退出对话框之前确认提示
  767. var that = this;
  768. this.$confirm("确认关闭?")
  769. .then((_) => {
  770. done();
  771. })
  772. .catch((_) => {});
  773. },
  774. // 右侧列表的方法Start
  775. findPage(data) {
  776. // 获取分页数据
  777. if (data && data.pageRequest) {
  778. this.pageRequest.pageNum = data.pageRequest.pageNum;
  779. this.pageRequest.pageSize = data.pageRequest.pageSize;
  780. }
  781. this.$api.retail
  782. .findPage(this.pageRequest)
  783. .then((res) => {
  784. this.pageResult = res.data;
  785. })
  786. .then(data != null ? data.callback : "");
  787. },
  788. //编辑
  789. handleTableEdit(data) {
  790. let dataObj = Object.assign({}, data.row);
  791. console.log(dataObj);
  792. var deptid = dataObj.deptid.split("D")[0];
  793. this.$api.dept.getDeptById(deptid).then((res) => {
  794. if ((res.code = 200)) {
  795. this.deptInfo = res.data;
  796. this.deptInfo.teamid = dataObj.deptid;
  797. this.deptInfo.teamname = dataObj.deptname;
  798. this.distributionForm = dataObj;
  799. // this.distributionForm.paytype = data.row.paytype.split(',');
  800. this.retailSettingForm = [];
  801. for (let i = 0; i < dataObj.retailtype; i++) {
  802. this.retailSettingForm.push({
  803. retailLevel: i + 1,
  804. retailRate: dataObj["disrate" + (i + 1)],
  805. });
  806. }
  807. this.dialogVisible = true;
  808. } else {
  809. this.$message.info("加载失败");
  810. }
  811. });
  812. return;
  813. },
  814. // 批量删除人员
  815. handleTableBatchDelete(data) {},
  816. // 删除单个人员
  817. handleTableDeleteFlag(data) {
  818. this.$api.retail.retailIdDelete(data.row.id).then((res) => {
  819. if (res.code == "200") {
  820. this.findPage();
  821. this.$message({
  822. type: "success",
  823. message: res.msg,
  824. });
  825. } else {
  826. this.$message({
  827. type: "error",
  828. message: res.msg,
  829. });
  830. }
  831. });
  832. },
  833. // 右侧列表的方法End
  834. // 新增或修改的弹出框Start
  835. closeDialog() {
  836. // 清空数据
  837. this.deptInfo = {};
  838. this.retailSettingForm = [];
  839. this.distributionForm.id = "";
  840. this.distributionForm.retailtype = "";
  841. this.distributionForm.disrate1 = 0;
  842. this.distributionForm.disrate2 = 0;
  843. this.distributionForm.disrate3 = 0;
  844. // this.distributionForm.display='';
  845. // this.distributionForm.usergroup='';
  846. // this.distributionForm.status='';
  847. // this.distributionForm.paytype=[];
  848. // this.distributionForm.minamount=1;
  849. // this.distributionForm.maxamount=1000;
  850. // this.distributionForm.commission=0;
  851. this.distributionForm.creator = "";
  852. this.distributionForm.createtime = "";
  853. },
  854. // 提交
  855. submitForm() {},
  856. // 新增或修改的弹出框End
  857. //新增分销Start
  858. retailtypeChange(e) {
  859. //修改分销模式
  860. this.retailSettingForm = [];
  861. for (let i = 0; i < e; i++) {
  862. this.retailSettingForm.push({
  863. retailLevel: i + 1,
  864. retailRate: 0,
  865. });
  866. }
  867. },
  868. arraySpanMethod({ row, column, rowIndex, columnIndex }) {
  869. //合并单元格
  870. if (columnIndex === 2) {
  871. let _row_1 = 0;
  872. if (rowIndex === 0) {
  873. _row_1 = this.retailSettingForm.length;
  874. } else {
  875. _row_1 = 0;
  876. }
  877. const _col_1 = _row_1 > 0 ? 1 : 0; //如果被合并了_row=0则它这个列需要取消
  878. return {
  879. rowspan: _row_1,
  880. colspan: _col_1,
  881. };
  882. }
  883. },
  884. comfirmRetail() {
  885. if (this.distributionForm.retailtype == "") {
  886. return this.$message.info("请选择分销方式");
  887. }
  888. // if(this.distributionForm.display=''){
  889. // return this.$message.info("请选择是否显示佣金");
  890. // }]
  891. // if(this.distributionForm.paytype.length==0){
  892. // return this.$message.info("请选择提现方式");
  893. // }
  894. let param = {};
  895. Object.assign(param, this.distributionForm);
  896. param.deptid = this.deptInfo.teamid;
  897. param.deptname = this.deptInfo.teamname;
  898. // param.paytype = param.paytype.toString();
  899. param.disrate1 = "";
  900. param.disrate2 = "";
  901. param.disrate3 = "";
  902. for (let i = 0; i < this.retailSettingForm.length; i++) {
  903. param["disrate" + this.retailSettingForm[i].retailLevel] =
  904. this.retailSettingForm[i].retailRate;
  905. }
  906. this.$api.retail
  907. .saveRetail(param)
  908. .then((res) => {
  909. if (res.code == 200) {
  910. this.$message.success("操作成功");
  911. this.findPage();
  912. this.dialogVisible = false;
  913. } else {
  914. this.$message.info("操作失败 " + res.msg);
  915. }
  916. })
  917. .catch((err) => {
  918. this.$message.error("操作失败");
  919. });
  920. // 新增分销End
  921. this.$api.retail
  922. .saveRetail(param)
  923. .then((res) => {
  924. if (res.code == 200) {
  925. this.$message.success("操作成功");
  926. this.findPage();
  927. this.dialogVisible = false;
  928. } else {
  929. this.$message.info("操作失败 " + res.msg);
  930. }
  931. })
  932. .catch((err) => {
  933. this.$message.error("操作失败");
  934. });
  935. },
  936. // 新增分销End
  937. },
  938. };
  939. </script>
  940. <style scoped>
  941. .el-divider--horizontal {
  942. margin: 4px 0;
  943. }
  944. /* 顶部查询条件样式Start */
  945. .queryFrom .el-row {
  946. margin: 10px 0px;
  947. }
  948. .queryFrom .el-form-item {
  949. margin-bottom: 0px;
  950. }
  951. .queryFrom .queryButton .el-form-item__content {
  952. margin-left: 0px !important;
  953. }
  954. /* 顶部查询条件样式End */
  955. .icon {
  956. width: 1em;
  957. height: 1em;
  958. vertical-align: -0.15em;
  959. fill: currentColor;
  960. overflow: hidden;
  961. }
  962. </style>