index.vue 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754
  1. <template>
  2. <div class="app-container">
  3. <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
  4. <el-form-item label="会员ID" prop="userId">
  5. <el-input
  6. v-model="queryParams.userId"
  7. placeholder="请输入会员ID"
  8. clearable
  9. size="small"
  10. @keyup.enter.native="handleQuery"
  11. />
  12. </el-form-item>
  13. <el-form-item label="会员昵称" prop="nickname">
  14. <el-input
  15. v-model="queryParams.nickname"
  16. placeholder="请输入会员昵称"
  17. clearable
  18. size="small"
  19. @keyup.enter.native="handleQuery"
  20. />
  21. </el-form-item>
  22. <el-form-item label="手机号码" prop="phone">
  23. <el-input
  24. v-model="queryParams.phone"
  25. placeholder="请输入手机号码"
  26. clearable
  27. size="small"
  28. @keyup.enter.native="handleQuery"
  29. />
  30. </el-form-item>
  31. <el-form-item label="注册时间" prop="createTimeRange">
  32. <el-date-picker clearable size="small" style="width: 340px"
  33. v-model="dateRange"
  34. type="daterange"
  35. value-format="yyyy-MM-dd"
  36. range-separator="至"
  37. start-placeholder="开始日期"
  38. end-placeholder="结束日期"
  39. @change="handleDateRangeChange">
  40. </el-date-picker>
  41. </el-form-item>
  42. <el-form-item label="所属公司" prop="companyName">
  43. <el-input
  44. v-model="queryParams.companyName"
  45. placeholder="请输入所属公司"
  46. clearable
  47. size="small"
  48. @keyup.enter.native="handleQuery"
  49. />
  50. </el-form-item>
  51. <el-form-item label="所属销售" prop="companyUserNickName">
  52. <el-input
  53. v-model="queryParams.companyUserNickName"
  54. placeholder="请输入所属销售"
  55. clearable
  56. size="small"
  57. @keyup.enter.native="handleQuery"
  58. />
  59. </el-form-item>
  60. <!-- <el-form-item label="推线编码" prop="registerCode">-->
  61. <!-- <el-input-->
  62. <!-- v-model="queryParams.registerCode"-->
  63. <!-- placeholder="请输入推线编码"-->
  64. <!-- clearable-->
  65. <!-- size="small"-->
  66. <!-- @keyup.enter.native="handleQuery"-->
  67. <!-- />-->
  68. <!-- </el-form-item>-->
  69. <el-form-item label="状态" prop="status">
  70. <el-select v-model="queryParams.status" placeholder="请选择状态" clearable size="small" >
  71. <el-option
  72. v-for="item in statusOptions"
  73. :key="item.dictValue"
  74. :label="item.dictLabel"
  75. :value="item.dictValue"
  76. />
  77. </el-select>
  78. </el-form-item>
  79. <!-- <el-form-item label="会员等级" prop="status">-->
  80. <!-- <el-select v-model="queryParams.level" placeholder="请选择会员等级" clearable size="small" >-->
  81. <!-- <el-option-->
  82. <!-- v-for="item in userLevelOptions"-->
  83. <!-- :key="item.dictValue"-->
  84. <!-- :label="item.dictLabel"-->
  85. <!-- :value="item.dictValue"-->
  86. <!-- />-->
  87. <!-- </el-select>-->
  88. <!-- </el-form-item>-->
  89. <!-- <el-form-item label="推广员" prop="isPromoter">-->
  90. <!-- <el-select v-model="queryParams.isPromoter" placeholder="请选择" clearable size="small" >-->
  91. <!-- <el-option-->
  92. <!-- v-for="item in userIsPromoterOptions"-->
  93. <!-- :key="item.dictValue"-->
  94. <!-- :label="item.dictLabel"-->
  95. <!-- :value="item.dictValue"-->
  96. <!-- />-->
  97. <!-- </el-select>-->
  98. <!-- </el-form-item>-->
  99. <el-form-item>
  100. <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
  101. <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
  102. </el-form-item>
  103. </el-form>
  104. <el-row :gutter="10" class="mb8">
  105. <el-col :span="1.5">
  106. <el-button
  107. type="primary"
  108. icon="el-icon-user"
  109. size="mini"
  110. @click="handleChangeCompanyUser"
  111. :disabled="multiple"
  112. v-hasPermi="['company:companyUser:change']"
  113. >更换会员归属</el-button>
  114. </el-col>
  115. <el-col :span="1.5">
  116. <el-button
  117. type="warning"
  118. icon="el-icon-download"
  119. size="mini"
  120. @click="handleExport"
  121. v-hasPermi="['store:user:export']"
  122. >导出</el-button>
  123. </el-col>
  124. <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
  125. </el-row>
  126. <el-table height="500" border v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
  127. <el-table-column type="selection" width="55" align="center" />
  128. <el-table-column label="ID" align="center" prop="userId" />
  129. <el-table-column label="会员昵称" align="center" prop="nickname" />
  130. <el-table-column label="会员头像" align="center" width="80">
  131. <template slot-scope="scope">
  132. <el-popover
  133. placement="right"
  134. title=""
  135. trigger="hover"
  136. >
  137. <img slot="reference" :src="scope.row.avatar" width="50" >
  138. <img :src="scope.row.avatar" style="max-width: 120px;">
  139. </el-popover>
  140. </template>
  141. </el-table-column>
  142. <el-table-column label="手机号码" align="center" prop="phone" />
  143. <el-table-column label="用户余额" align="center" prop="nowMoney" />
  144. <!-- <el-table-column label="推广佣金" align="center" prop="brokeragePrice" />-->
  145. <el-table-column label="积分" align="center" prop="integral" />
  146. <el-table-column label="会员注册时间" align="center" prop="createTime" />
  147. <!-- <el-table-column label="累计消费金额" align="center" prop="totalAmount" />-->
  148. <!-- <el-table-column label="上次消费时间" align="center" prop="lastBuyTime" />-->
  149. <!-- <el-table-column label="上次消费金额(元)" align="center" prop="number" />-->
  150. <!-- <el-table-column label="会员等级" align="center" prop="level" >-->
  151. <!-- <template slot-scope="scope">-->
  152. <!-- <el-tag prop="status" v-for="(item, index) in userLevelOptions" v-if="scope.row.level==item.dictValue">{{item.dictLabel}}</el-tag>-->
  153. <!-- </template>-->
  154. <!-- </el-table-column>-->
  155. <!-- <el-table-column label="是否允许下单" align="center" prop="isShow" >-->
  156. <!-- <template slot-scope="scope">-->
  157. <!-- <el-tag prop="isShow" v-for="(item, index) in isShowOptions" v-if="scope.row.isShow==item.dictValue">{{item.dictLabel}}</el-tag>-->
  158. <!-- </template>-->
  159. <!-- </el-table-column>-->
  160. <!-- <el-table-column label="推广员" align="center" prop="isPromoter" >-->
  161. <!-- <template slot-scope="scope">-->
  162. <!-- <el-tag prop="status" v-for="(item, index) in userIsPromoterOptions" v-if="scope.row.isPromoter==item.dictValue">{{item.dictLabel}}</el-tag>-->
  163. <!-- </template>-->
  164. <!-- </el-table-column>-->
  165. <el-table-column label="状态" align="center" prop="status" >
  166. <template slot-scope="scope">
  167. <el-tag prop="status" v-for="(item, index) in statusOptions" v-if="scope.row.status==item.dictValue">{{item.dictLabel}}</el-tag>
  168. </template>
  169. </el-table-column>
  170. <el-table-column label="所属公司" align="center" prop="companyName" />
  171. <el-table-column label="所属销售" align="center" prop="companyUserNickName" />
  172. <!-- <el-table-column label="创建时间" align="center" prop="createTime" />-->
  173. <!-- <el-table-column label="累计佣金" align="center" prop="registerDate" />-->
  174. <!-- <el-table-column label="可提现佣金" align="center" prop="registerCode" />-->
  175. <!-- <el-table-column label="冻结佣金" align="center" prop="source" />-->
  176. <!-- <el-table-column label="已提现佣金" align="center" prop="remark" />-->
  177. <el-table-column label="看课数量" align="center" prop="watchCourseCount" />
  178. <el-table-column label="参与营期数" align="center" prop="partCourseCount" />
  179. <el-table-column label="最后看课时间" align="center" prop="lastWatchDate" width="160">
  180. <template slot-scope="scope">
  181. <span>{{ parseTime(scope.row.lastWatchDate) }}</span>
  182. </template>
  183. </el-table-column>
  184. <el-table-column label="操作" align="center" fixed="right" width="150px" class-name="small-padding fixed-width">
  185. <template slot-scope="scope">
  186. <el-button
  187. size="mini"
  188. type="text"
  189. icon="el-icon-edit"
  190. @click="handleUpdate(scope.row)"
  191. v-hasPermi="['store:user:edit']"
  192. >修改</el-button>
  193. <el-button
  194. size="mini"
  195. type="text"
  196. @click="handleShow(scope.row)"
  197. v-hasPermi="['store:user:query']"
  198. >查看</el-button>
  199. <el-button
  200. size="mini"
  201. type="text"
  202. icon="el-icon-delete"
  203. @click="handleDelete(scope.row)"
  204. v-hasPermi="['store:user:remove']"
  205. >删除</el-button>
  206. </template>
  207. </el-table-column>
  208. </el-table>
  209. <pagination
  210. v-show="total>0"
  211. :total="total"
  212. :page.sync="queryParams.pageNum"
  213. :limit.sync="queryParams.pageSize"
  214. @pagination="getList"
  215. />
  216. <!-- 添加或修改用户对话框 -->
  217. <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
  218. <el-form ref="form" :model="form" :rules="rules" label-width="120px">
  219. <el-form-item label="会员头像" prop="avatar">
  220. <div style="display: flex; align-items: center; gap: 16px;">
  221. <el-popover
  222. placement="right"
  223. title=""
  224. trigger="hover"
  225. >
  226. <img slot="reference" :src="form.avatar" width="80" style="border-radius: 8px; border: 2px solid #ddd;">
  227. <img :src="form.avatar" style="max-width: 200px; border-radius: 8px;">
  228. </el-popover>
  229. <div>
  230. <el-upload
  231. class="avatar-uploader"
  232. :action="uploadUrl"
  233. :show-file-list="false"
  234. :on-success="handleAvatarSuccess"
  235. :before-upload="beforeAvatarUpload"
  236. :http-request="handleAvatarUpload"
  237. >
  238. <el-button size="small" type="primary" icon="el-icon-upload">上传头像</el-button>
  239. </el-upload>
  240. <div style="font-size: 12px; color: #999; margin-top: 4px;">
  241. 支持 JPG、PNG 格式,建议尺寸 200x200
  242. </div>
  243. </div>
  244. </div>
  245. </el-form-item>
  246. <el-form-item label="会员昵称" prop="nickname">
  247. <el-input v-model="form.nickname" placeholder="请输入用户昵称" />
  248. </el-form-item>
  249. <el-form-item label="手机号码" prop="phone">
  250. <el-input v-model="form.phone" disabled placeholder="请输入手机号码" />
  251. </el-form-item>
  252. <el-form-item label="最后一次登录ip" prop="lastIp">
  253. <el-input v-model="form.lastIp" disabled placeholder="请输入最后一次登录ip" />
  254. </el-form-item>
  255. <!-- <el-form-item label="用户余额" prop="nowMoney">
  256. <el-input v-model="form.nowMoney" disabled placeholder="请输入用户余额" />
  257. </el-form-item> -->
  258. <!-- <el-form-item label="积分" prop="integral">
  259. <el-input v-model="form.integral" disabled placeholder="请输入用户积分" />
  260. </el-form-item> -->
  261. <el-form-item label="进线日期" prop="registerDate">
  262. <el-date-picker clearable size="small"
  263. v-model="form.registerDate"
  264. type="date"
  265. value-format="yyyy-MM-dd"
  266. placeholder="选择进线日期">
  267. </el-date-picker>
  268. </el-form-item>
  269. <el-form-item label="推线编码" prop="registerCode">
  270. <el-input v-model="form.registerCode" placeholder="请输入推线编码" />
  271. </el-form-item>
  272. <el-form-item label="渠道来源" prop="source">
  273. <el-input v-model="form.source" placeholder="请输入渠道来源" />
  274. </el-form-item>
  275. <el-form-item label="会员等级" prop="level">
  276. <el-select style="width: 200px" v-model="form.level" placeholder="请选择会员等级" clearable size="small" >
  277. <el-option
  278. v-for="item in userLevelOptions"
  279. :key="item.dictValue"
  280. :label="item.dictLabel"
  281. :value="item.dictValue"
  282. />
  283. </el-select>
  284. </el-form-item>
  285. <el-form-item label="是否为推广员" prop="isPromoter">
  286. <el-select style="width: 200px" v-model="form.isPromoter" placeholder="请选择" clearable size="small" >
  287. <el-option
  288. v-for="item in userIsPromoterOptions"
  289. :key="item.dictValue"
  290. :label="item.dictLabel"
  291. :value="item.dictValue"
  292. />
  293. </el-select>
  294. </el-form-item>
  295. <el-form-item label="状态" prop="level">
  296. <el-radio-group v-model="form.status">
  297. <el-radio :label="item.dictValue" v-for="item in statusOptions" >{{item.dictLabel}}</el-radio>
  298. </el-radio-group>
  299. </el-form-item>
  300. <el-form-item label="是否展示" prop="isShow">
  301. <el-radio-group v-model="form.isShow">
  302. <el-radio :label="item.dictValue" v-for="item in isShowOptions" >{{item.dictLabel}}</el-radio>
  303. </el-radio-group>
  304. </el-form-item>
  305. <el-form-item label="用户备注" prop="remark">
  306. <el-input v-model="form.remark" placeholder="请输入用户备注" />
  307. </el-form-item>
  308. </el-form>
  309. <div slot="footer" class="dialog-footer">
  310. <el-button type="primary" @click="submitForm">确 定</el-button>
  311. <el-button @click="cancel">取 消</el-button>
  312. </div>
  313. </el-dialog>
  314. <el-drawer size="75%" :title="show.title" :visible.sync="show.open">
  315. <store-user-details ref="storeUserDetails"></store-user-details>
  316. </el-drawer>
  317. <!-- 更换会员归属对话框 -->
  318. <el-dialog title="更换会员归属" :visible.sync="changeCompanyUserOpen" width="500px" append-to-body>
  319. <el-form ref="changeCompanyUserForm" :model="changeCompanyUserForm" :rules="changeCompanyUserRules" label-width="100px">
  320. <el-form-item label="选择公司" prop="companyId">
  321. <el-select v-model="changeCompanyUserForm.companyId" placeholder="请选择公司" style="width: 100%" @change="handleCompanyChange">
  322. <el-option
  323. v-for="item in companyOptions"
  324. :key="item.companyId"
  325. :label="item.companyName"
  326. :value="item.companyId"
  327. />
  328. </el-select>
  329. </el-form-item>
  330. <el-form-item label="选择销售" prop="companyUserId">
  331. <el-select v-model="changeCompanyUserForm.companyUserId" placeholder="请选择销售" style="width: 100%" @change="handleCompanyUserChange">
  332. <el-option
  333. v-for="item in companyUserOptions"
  334. :key="item.userId"
  335. :label="item.nickName + '_' + item.userName"
  336. :value="item.userId"
  337. />
  338. </el-select>
  339. </el-form-item>
  340. </el-form>
  341. <div slot="footer" class="dialog-footer">
  342. <el-button type="primary" @click="submitChangeCompanyUserForm">确 定</el-button>
  343. <el-button @click="cancelChangeCompanyUser">取 消</el-button>
  344. </div>
  345. </el-dialog>
  346. </div>
  347. </template>
  348. <script>
  349. import { listUser, getUser, delUser, addUser, updateUser, exportUser } from "@/api/store/user";
  350. import { getCompanyUserList, changeCompanyUser, getCompanyList } from '@/api/company/companyUser';
  351. import storeUserDetails from './components/storeUserDetails.vue';
  352. export default {
  353. components: { storeUserDetails },
  354. name: "User",
  355. data() {
  356. return {
  357. uploadUrl:process.env.VUE_APP_BASE_API+"/common/uploadOSS", // 上传的图片服务器地址
  358. userIsPromoterOptions:[],
  359. userLevelOptions:[],
  360. statusOptions:[],
  361. isShowOptions:[],
  362. // 遮罩层
  363. loading: true,
  364. // 选中数组
  365. ids: [],
  366. // 非单个禁用
  367. single: true,
  368. // 非多个禁用
  369. multiple: true,
  370. // 显示搜索条件
  371. showSearch: true,
  372. // 总条数
  373. total: 0,
  374. show:{
  375. title:"会员详情",
  376. open:false,
  377. },
  378. // 用户表格数据
  379. userList: [],
  380. // 弹出层标题
  381. title: "",
  382. // 是否显示弹出层
  383. open: false,
  384. // 日期范围
  385. dateRange: [],
  386. // 查询参数
  387. queryParams: {
  388. pageNum: 1,
  389. pageSize: 10,
  390. username: null,
  391. password: null,
  392. realName: null,
  393. birthday: null,
  394. idCard: null,
  395. mark: null,
  396. nickname: null,
  397. avatar: null,
  398. phone: null,
  399. lastIp: null,
  400. nowMoney: null,
  401. brokeragePrice: null,
  402. integral: null,
  403. signNum: null,
  404. status: null,
  405. level: null,
  406. spreadUserId: null,
  407. spreadTime: null,
  408. userType: null,
  409. isPromoter: null,
  410. payCount: null,
  411. spreadCount: null,
  412. addres: null,
  413. wxProfile: null,
  414. isDel: null,
  415. startCreateTime: null,
  416. endCreateTime: null,
  417. companyName: null,
  418. companyUserNickName: null
  419. },
  420. // 表单参数
  421. form: {},
  422. // 表单校验
  423. rules: {
  424. status: [
  425. { required: true, message: "状态不能为空", trigger: "blur" }
  426. ],
  427. level: [
  428. { required: true, message: "等级不能为空", trigger: "blur" }
  429. ],
  430. },
  431. // 更换会员归属对话框
  432. changeCompanyUserOpen: false,
  433. // 更换会员归属表单
  434. changeCompanyUserForm: {
  435. companyId: null,
  436. companyUserId: null,
  437. userIds: []
  438. },
  439. // 更换会员归属表单校验
  440. changeCompanyUserRules: {
  441. companyId: [
  442. { required: true, message: '请选择公司', trigger: 'change' }
  443. ],
  444. companyUserId: [
  445. { required: true, message: '请选择销售', trigger: 'change' }
  446. ]
  447. },
  448. // 销售选项
  449. companyUserOptions: [],
  450. companyOptions: []
  451. };
  452. },
  453. created() {
  454. this.getDicts("user_status").then((response) => {
  455. this.statusOptions = response.data;
  456. });
  457. this.getDicts("user_level").then((response) => {
  458. this.userLevelOptions = response.data;
  459. });
  460. this.getDicts("sys_company_or").then((response) => {
  461. this.isShowOptions = response.data;
  462. });
  463. this.getDicts("user_is_promoter").then((response) => {
  464. this.userIsPromoterOptions = response.data;
  465. });
  466. this.getList();
  467. },
  468. methods: {
  469. // 头像上传前的校验
  470. beforeAvatarUpload(file) {
  471. const isJPG = file.type === 'image/jpeg' || file.type === 'image/png' || file.type === 'image/jpg';
  472. const isLt2M = file.size / 1024 / 1024 < 2;
  473. if (!isJPG) {
  474. this.$message.error('上传头像图片只能是 JPG/PNG/JPEG 格式!');
  475. }
  476. if (!isLt2M) {
  477. this.$message.error('上传头像图片大小不能超过 2MB!');
  478. }
  479. return isJPG && isLt2M;
  480. },
  481. // 上传成功回调(如果使用服务器上传)
  482. handleAvatarSuccess(response, file) {
  483. this.form.avatar = response.url; // 假设服务器返回的是 {url: '图片地址'}
  484. this.$message.success('头像上传成功');
  485. },
  486. /** 查询用户列表 */
  487. getList() {
  488. this.loading = true;
  489. listUser(this.queryParams).then(response => {
  490. this.userList = response.rows;
  491. this.total = response.total;
  492. this.loading = false;
  493. });
  494. },
  495. // 取消按钮
  496. cancel() {
  497. this.open = false;
  498. this.reset();
  499. },
  500. // 表单重置
  501. reset() {
  502. this.form = {
  503. userId: null,
  504. username: null,
  505. password: null,
  506. realName: null,
  507. birthday: null,
  508. idCard: null,
  509. mark: null,
  510. nickname: null,
  511. avatar: null,
  512. phone: null,
  513. createTime: null,
  514. updateTime: null,
  515. lastIp: null,
  516. nowMoney: null,
  517. brokeragePrice: null,
  518. integral: null,
  519. signNum: null,
  520. status: 0,
  521. level: 0,
  522. spreadUserId: null,
  523. spreadTime: null,
  524. userType: null,
  525. isPromoter: null,
  526. payCount: null,
  527. spreadCount: null,
  528. addres: null,
  529. wxProfile: null,
  530. isDel: null,
  531. isShow: null
  532. };
  533. this.resetForm("form");
  534. },
  535. /** 搜索按钮操作 */
  536. handleQuery() {
  537. this.queryParams.pageNum = 1;
  538. this.getList();
  539. },
  540. /** 重置按钮操作 */
  541. resetQuery() {
  542. this.dateRange = [];
  543. this.resetForm("queryForm");
  544. this.queryParams.companyName = null;
  545. this.queryParams.companyUserNickName = null;
  546. this.handleQuery();
  547. },
  548. /** 处理日期范围变化 */
  549. handleDateRangeChange(dates) {
  550. if (dates) {
  551. this.queryParams.startCreateTime = dates[0];
  552. this.queryParams.endCreateTime = dates[1];
  553. } else {
  554. this.queryParams.startCreateTime = null;
  555. this.queryParams.endCreateTime = null;
  556. }
  557. },
  558. // 多选框选中数据
  559. handleSelectionChange(selection) {
  560. this.ids = selection.map(item => item.userId)
  561. this.single = selection.length!==1
  562. this.multiple = !selection.length
  563. },
  564. /** 新增按钮操作 */
  565. handleAdd() {
  566. this.reset();
  567. this.open = true;
  568. this.title = "添加用户";
  569. },
  570. /** 修改按钮操作 */
  571. handleUpdate(row) {
  572. this.reset();
  573. const userId = row.userId || this.ids
  574. getUser(userId).then(response => {
  575. this.form = response.data;
  576. this.form.status = response.data.status.toString();
  577. this.form.isShow = response.data.isShow.toString();
  578. this.form.level = response.data.level.toString();
  579. this.form.isPromoter = response.data.isPromoter.toString();
  580. this.open = true;
  581. this.title = "修改用户";
  582. });
  583. },
  584. /** 提交按钮 */
  585. submitForm() {
  586. this.$refs["form"].validate(valid => {
  587. if (valid) {
  588. if (this.form.userId != null) {
  589. updateUser(this.form).then(response => {
  590. if (response.code === 200) {
  591. this.msgSuccess("修改成功");
  592. this.open = false;
  593. this.getList();
  594. }
  595. });
  596. } else {
  597. addUser(this.form).then(response => {
  598. if (response.code === 200) {
  599. this.msgSuccess("新增成功");
  600. this.open = false;
  601. this.getList();
  602. }
  603. });
  604. }
  605. }
  606. });
  607. },
  608. /** 删除按钮操作 */
  609. handleDelete(row) {
  610. const userIds = row.userId || this.ids;
  611. this.$confirm('是否确认删除用户编号为"' + userIds + '"的数据项?', "警告", {
  612. confirmButtonText: "确定",
  613. cancelButtonText: "取消",
  614. type: "warning"
  615. }).then(function() {
  616. return delUser(userIds);
  617. }).then(() => {
  618. this.getList();
  619. this.msgSuccess("删除成功");
  620. }).catch(function() {});
  621. },
  622. /** 导出按钮操作 */
  623. handleExport() {
  624. const queryParams = this.queryParams;
  625. this.$confirm('是否确认导出当前用户数据项?', "警告", {
  626. confirmButtonText: "确定",
  627. cancelButtonText: "取消",
  628. type: "warning"
  629. }).then(function() {
  630. return exportUser(queryParams);
  631. }).then(response => {
  632. console.log(response)
  633. this.download(response.msg);
  634. }).catch(function() {});
  635. }
  636. ,handleShow(row){
  637. var that=this;
  638. that.show.open=true;
  639. setTimeout(() => {
  640. that.$refs.storeUserDetails.getDetails(row.userId);
  641. }, 200);
  642. },
  643. /** 更换会员归属按钮操作 */
  644. handleChangeCompanyUser() {
  645. // 获取公司下拉列表
  646. getCompanyList().then(response => {
  647. if (response.code === 200) {
  648. this.companyOptions = response.data;
  649. // 重置表单和销售列表
  650. this.resetCompanyUserForm();
  651. this.companyUserOptions = [];
  652. this.changeCompanyUserOpen = true;
  653. } else {
  654. this.$message.error(response.msg || '获取公司列表失败');
  655. }
  656. }).catch(() => {
  657. this.$message.error('获取公司列表失败');
  658. });
  659. },
  660. /** 销售选择变化 */
  661. handleCompanyUserChange(userId) {
  662. if (!this.changeCompanyUserForm.companyId) {
  663. this.$message.warning('请先选择公司');
  664. this.changeCompanyUserForm.companyUserId = null;
  665. return;
  666. }
  667. },
  668. /** 重置更换会员归属表单 */
  669. resetCompanyUserForm() {
  670. this.changeCompanyUserForm = {
  671. companyId: null,
  672. companyUserId: null,
  673. userIds: []
  674. };
  675. this.resetForm("changeCompanyUserForm");
  676. },
  677. handleCompanyChange(companyId) {
  678. // 清空已选择的销售
  679. this.changeCompanyUserForm.companyUserId = null;
  680. // 根据公司ID获取对应的销售列表
  681. if (companyId) {
  682. getCompanyUserList({ companyId: companyId }).then(response => {
  683. if (response.code === 200) {
  684. this.companyUserOptions = response.data;
  685. } else {
  686. this.$message.error(response.msg || '获取销售列表失败');
  687. this.companyUserOptions = [];
  688. }
  689. }).catch(() => {
  690. this.$message.error('获取销售列表失败');
  691. this.companyUserOptions = [];
  692. });
  693. } else {
  694. this.companyUserOptions = [];
  695. }
  696. },
  697. /** 取消更换会员归属 */
  698. cancelChangeCompanyUser() {
  699. this.changeCompanyUserOpen = false;
  700. this.resetCompanyUserForm();
  701. },
  702. /** 提交更换会员归属 */
  703. submitChangeCompanyUserForm() {
  704. this.$refs["changeCompanyUserForm"].validate(valid => {
  705. if (valid) {
  706. // 调用更换会员归属接口
  707. // 检查companyId是否已设置
  708. if (!this.changeCompanyUserForm.companyId) {
  709. this.$message.error('请选择公司');
  710. return;
  711. }
  712. changeCompanyUser(this.ids, {
  713. companyUserId: this.changeCompanyUserForm.companyUserId,
  714. companyId: this.changeCompanyUserForm.companyId
  715. }).then(response => {
  716. if (response.code === 200) {
  717. this.msgSuccess("操作成功");
  718. this.changeCompanyUserOpen = false;
  719. this.getList();
  720. } else {
  721. this.$message.error(response.msg || '操作失败');
  722. }
  723. }).catch(() => {
  724. this.$message.error('操作失败');
  725. });
  726. }
  727. });
  728. }
  729. }
  730. };
  731. </script>