userEnterprise.vue 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654
  1. <template>
  2. <div class="mainBox">
  3. <div class="layerBox">
  4. <el-form ref="form" :model="form" :rules="loginRules" class="login-form" autocomplete="on" label-position="left" label-width="120px">
  5. <div class="formDiv">
  6. <!--选择角色 start------------------------------------------>
  7. <el-form-item label="所属角色2:" :label-width="formLabelWidth" prop="role_id" class="custom-align-right">
  8. <div class="formLabelFloatBox">
  9. <el-select v-model="form.role_id" placeholder="请选择..">
  10. <el-option
  11. v-for="item in role_idArr"
  12. :key="item.value"
  13. :label="item.label"
  14. :value="item.value">
  15. </el-option>
  16. </el-select>
  17. </div>
  18. </el-form-item>
  19. <!--选择角色 end------------------------------------------>
  20. <el-form-item label="登录账号:" :label-width="formLabelWidth" prop="user_name" class="custom-align-right">
  21. <el-input v-model="form.user_name" autocomplete="off" placeholder="请输入登录账号.."></el-input>
  22. </el-form-item>
  23. <div v-if="editId==''">
  24. <!--新密码 start------------------------------------------>
  25. <div class="PasswordBox">
  26. <el-form-item prop="password" label="登录密码:" class="custom-align-right">
  27. <div class="PasswordBody">
  28. <el-input
  29. :key="passwordType1"
  30. ref="password1"
  31. v-model="form.password"
  32. :type="passwordType1"
  33. placeholder="请输入密码"
  34. name="password"
  35. tabindex="2"
  36. autocomplete="off"
  37. @blur="capsTooltip2 = false"
  38. />
  39. <span class="show-pwd" @click="showPwd(1)">
  40. <svg-icon :icon-class="passwordType1 === 'password' ? 'eye' : 'eye-open'" />
  41. </span>
  42. </div>
  43. </el-form-item>
  44. </div>
  45. <!--新密码 end------------------------------------------>
  46. <!--新密码 start------------------------------------------>
  47. <div class="PasswordBox">
  48. <el-form-item prop="confirm_password" label="确认密码:" class="custom-align-right">
  49. <div class="PasswordBody">
  50. <el-input
  51. :key="passwordType2"
  52. ref="password2"
  53. v-model="form.confirm_password"
  54. :type="passwordType2"
  55. placeholder="请输入密码"
  56. name="password"
  57. tabindex="2"
  58. autocomplete="off"
  59. @blur="capsTooltip2 = false"
  60. />
  61. <span class="show-pwd" @click="showPwd(2)">
  62. <svg-icon :icon-class="passwordType2 === 'password' ? 'eye' : 'eye-open'" />
  63. </span>
  64. </div>
  65. </el-form-item>
  66. </div>
  67. <!--新密码 end------------------------------------------>
  68. </div>
  69. <el-form-item label="企业名称:" :label-width="formLabelWidth" prop="business_name" class="custom-align-right">
  70. <el-input v-model="form.business_name" autocomplete="off" placeholder="请输入企业名称.."></el-input>
  71. </el-form-item>
  72. <el-form-item label="详细地址:" :label-width="formLabelWidth" prop="address_arr_id" class="custom-align-right">
  73. <CityCascader v-model="form.address_arr_id" @update-city-id="update_address_arr_id"></CityCascader>
  74. </el-form-item>
  75. <el-form-item label="" :label-width="formLabelWidth" prop="" class="custom-align-right">
  76. <el-input v-model="form.address" autocomplete="off" placeholder="请输入门牌号.."></el-input>
  77. </el-form-item>
  78. <el-form-item label="负责人:" :label-width="formLabelWidth" prop="real_name" class="custom-align-right">
  79. <el-input v-model="form.real_name" autocomplete="off" placeholder="请输入负责人姓名.."></el-input>
  80. </el-form-item>
  81. <el-form-item label="负责人职务:" :label-width="formLabelWidth" prop="position" class="custom-align-right">
  82. <el-input v-model="form.position" autocomplete="off" placeholder="请输入负责人职务.."></el-input>
  83. </el-form-item>
  84. <el-form-item label="负责人电话:" :label-width="formLabelWidth" prop="mobile" class="custom-align-right">
  85. <el-input v-model="form.mobile" autocomplete="off" placeholder="请输入负责人联系电话.."></el-input>
  86. </el-form-item>
  87. <el-form-item label="负责人身份证:" :label-width="formLabelWidth" prop="id_card" class="custom-align-right">
  88. <el-input v-model="form.id_card" autocomplete="off" placeholder="请输入负责人身份证号.."></el-input>
  89. </el-form-item>
  90. <el-form-item label="法人:" :label-width="formLabelWidth" prop="legal_person_real_name" class="custom-align-right">
  91. <el-input v-model="form.legal_person_real_name" autocomplete="off" placeholder="请输入法人姓名.."></el-input>
  92. </el-form-item>
  93. <el-form-item label="法人电话:" :label-width="formLabelWidth" prop="legal_person_mobile" class="custom-align-right">
  94. <el-input v-model="form.legal_person_mobile" autocomplete="off" placeholder="请输入法人联系电话.."></el-input>
  95. </el-form-item>
  96. <el-form-item label="法人身份证:" :label-width="formLabelWidth" prop="legal_person_id_card" class="custom-align-right">
  97. <el-input v-model="form.legal_person_id_card" autocomplete="off" placeholder="请输入法人身份证号.."></el-input>
  98. </el-form-item>
  99. <el-form-item label="有效期:" :label-width="formLabelWidth" prop="timeList" class="custom-align-right">
  100. <el-date-picker
  101. v-model="timeList"
  102. type="daterange"
  103. :disabled="form.long_time === 1"
  104. range-separator="至"
  105. start-placeholder="开始日期"
  106. end-placeholder="结束日期"
  107. :picker-options="pickerOptions">
  108. </el-date-picker>
  109. <el-checkbox v-model="form.long_time" :true-label="1" :false-label="0" class="longTimeCheckbox">无限期</el-checkbox>
  110. </el-form-item>
  111. <el-form-item label="传真:" :label-width="formLabelWidth" prop="fax" class="custom-align-right">
  112. <el-input v-model="form.fax" autocomplete="off" placeholder="请输入传真号码.."></el-input>
  113. </el-form-item>
  114. <el-form-item label="邮编:" :label-width="formLabelWidth" prop="" class="custom-align-right">
  115. <el-input v-model="form.zip_code" autocomplete="off" placeholder="请输入邮编.."></el-input>
  116. </el-form-item>
  117. <el-form-item label="QQ:" :label-width="formLabelWidth" prop="" class="custom-align-right">
  118. <el-input v-model="form.qq" autocomplete="off" placeholder="请输入QQ号.."></el-input>
  119. </el-form-item>
  120. <el-form-item label="电子邮箱:" :label-width="formLabelWidth" prop="" class="custom-align-right">
  121. <el-input v-model="form.email" autocomplete="off" placeholder="请输入电子邮箱.."></el-input>
  122. </el-form-item>
  123. <el-form-item label="相关资料:" :label-width="formLabelWidth" prop="" class="custom-align-right">
  124. <el-upload
  125. class="upload-demo"
  126. :action="uploadFileUrl"
  127. :headers="headers"
  128. :on-preview="handlePreview"
  129. :on-remove="handleRemove"
  130. :before-remove="beforeRemove"
  131. :on-success="handleUploadSuccess"
  132. multiple
  133. :limit="30"
  134. :on-exceed="handleExceed"
  135. :file-list="otherList">
  136. <el-button size="small" type="primary">点击上传</el-button>
  137. <div slot="tip" class="el-upload__tip">每张图片最大1MB,最多上传30张图片。</div>
  138. </el-upload>
  139. </el-form-item>
  140. <el-form-item label="提示词:" :label-width="formLabelWidth" prop="" class="custom-align-right">
  141. <el-input type="textarea" v-model="form.remark" class="custom-textarea" placeholder="请输入提示词"></el-input>
  142. </el-form-item>
  143. <el-form-item label="网站选择" :label-width="formLabelWidth" prop="sszq" class="custom-align-right">
  144. <el-select v-model="form.sszq" multiple filterable placeholder="请选择">
  145. <el-option
  146. v-for="item in webSiteList"
  147. :key="item.value"
  148. :label="item.label"
  149. :value="item.value">
  150. </el-option>
  151. </el-select>
  152. </el-form-item>
  153. </div>
  154. </el-form>
  155. </div>
  156. <div class="bottomBtnBox">
  157. <el-button type="info" @click="goList">返回</el-button>
  158. <el-button type="primary" @click="addData" v-if="editId==''">提交</el-button>
  159. <el-button type="primary" @click="editData" v-if="editId!=''">修改</el-button>
  160. <el-button type="warning" @click="resetPassword" v-if="editId!=''">重置密码</el-button>
  161. </div>
  162. </div>
  163. </template>
  164. <script>
  165. // 引入公用样式
  166. import '@/styles/global.less';
  167. // 引入baseUrl
  168. import URL from '@/utils/baseUrl';
  169. //城市级联选择器
  170. import CityCascader from './CityCascader';
  171. //格式化时间
  172. import { formatLocalDate } from '@/utils/public';
  173. export default {
  174. components: {
  175. CityCascader, //城市级联选择器
  176. },
  177. data() {
  178. let self = this;
  179. // 配置验证规则:用于表单验证
  180. const validatePassword = (rule, value, callback) => {
  181. if (value.length < 6) {
  182. callback(new Error('密码不能低于6位!'))
  183. } else {
  184. callback()
  185. }
  186. }
  187. const validateEmpty = (rule,value,callback) => {
  188. if (!value || value.trim() === "") {
  189. callback(new Error('该项不能为空!'));
  190. } else {
  191. callback();
  192. }
  193. }
  194. const validateArray = (rule,value,callback) => {
  195. if (value.length == 0) {
  196. callback(new Error('该项不能为空!'))
  197. } else {
  198. callback()
  199. }
  200. }
  201. const validateTimeTo = (rule,value,callback) => {
  202. if(self.timeList.length == 0&&self.form.long_time==0){
  203. callback(new Error('该项不能为空!'))
  204. }else{
  205. callback()
  206. }
  207. }
  208. const validateIdcard = (rule,value,callback) => {
  209. const idCardRegex = /^(?:\d{15}|\d{18}|\d{17}[\dXx])$/; // 正则表达式验证身份证号
  210. if (!value || value.trim() === "") {
  211. callback(new Error('该项不能为空!'));
  212. } else if (!idCardRegex.test(value.trim())) {
  213. callback(new Error('请输入有效的身份证号')); // 更新错误信息
  214. } else {
  215. console.log("身份证号验证通过!");
  216. self.extractBirthdayFromIdcard();
  217. callback();
  218. }
  219. }
  220. return {
  221. formLabelWidth:"120px",
  222. editId:"",
  223. uploadFileUrl:URL.testUrl+"/public/uploadFile",//获得上传地址
  224. headers: {},
  225. form:{
  226. type_id:3,//企业会员
  227. role_id:"",//角色id
  228. user_name:"",//登录账号
  229. password:"",//密码
  230. confirm_password:"",//确认密码
  231. real_name:"",//真实姓名
  232. id_card:"",//身份证号
  233. mobile:"",//手机号
  234. city_arr_id:"",//工作区域
  235. address_arr_id:"",//详细地址
  236. from_time:"",//有效期开始时间
  237. to_time:"",//有效期结束时间
  238. long_time:0,//是否为长期 //长期1:长期 0:非长期
  239. qq:"",//QQ
  240. email:"",//电子邮箱
  241. other:[],//相关资料
  242. remark:"",//提示词
  243. //企业相关字段
  244. fax:"",//传真
  245. business_name:"",//企业名称
  246. position:"",//负责人职务
  247. legal_person_real_name:"",//法人姓名
  248. legal_person_mobile:"",//法人手机号
  249. legal_person_id_card:"",//法人身份证号
  250. sszq:[]//网站选择
  251. },
  252. timeList:[],//时间段
  253. otherList:[],//相关资料列表
  254. role_idArr:[],//角色id池
  255. //网站列表
  256. webSiteList: [],
  257. //密码验证
  258. capsTooltip1: false,
  259. capsTooltip2: false,
  260. passwordType1: 'password',
  261. passwordType2: 'password',
  262. //配置from表单验证规则
  263. loginRules: {
  264. //1.角色id
  265. role_id: [{ required: true, trigger: 'blur', validator: validateArray }],
  266. //2.登录账号
  267. user_name: [{ required: true, trigger: 'blur', validator: validateEmpty }],
  268. //3.密码和确认密码
  269. password: [{ required: true, trigger: 'blur', validator: validatePassword }],
  270. confirm_password: [{ required: true, trigger: 'blur', validator: validatePassword }],
  271. //4.调研员编号
  272. number: [{ required: true, trigger: 'blur', validator: validateEmpty }],
  273. //5.真实姓名
  274. real_name: [{ required: true, trigger: 'blur', validator: validateEmpty }],
  275. //6.手机号
  276. mobile: [{ required: true, trigger: 'blur', validator: validateEmpty }],
  277. //7.身份证号
  278. id_card: [{ required: true, trigger: 'blur', validator: validateEmpty }],
  279. //8.性别
  280. gender: [{ required: true, trigger: 'blur', validator: validateEmpty }],
  281. //9.手机号
  282. mobile: [{ required: true, trigger: 'blur', validator: validateEmpty }],
  283. //10.工作区域
  284. address_arr_id: [{ required: true, trigger: 'blur', validator: validateArray }],
  285. //11.企业名称
  286. business_name: [{ required: true, trigger: 'blur', validator: validateEmpty }],
  287. //12.负责人职务
  288. position: [{ required: true, trigger: 'blur', validator: validateEmpty }],
  289. //12.法人姓名
  290. legal_person_real_name: [{ required: true, trigger: 'blur', validator: validateEmpty }],
  291. //13.法人电话
  292. legal_person_mobile: [{ required: true, trigger: 'blur', validator: validateEmpty }],
  293. //14.法人身份证号
  294. legal_person_id_card: [{ required: true, trigger: 'blur', validator: validateEmpty }],
  295. //15.有效期
  296. timeList:[{ required: true, trigger: 'blur', validator: validateTimeTo }],
  297. //16.网站选择
  298. sszq: [{ required: true, trigger: 'blur', validator: validateArray }]
  299. },
  300. //时间跨度
  301. pickerOptions: {
  302. selectableRange: '1900-01-01 to 2100-12-31', // 允许选择的日期范围
  303. // disabledDate(time) {
  304. // return time.getTime() < Date.now() - 86400000; // 禁用今天之前的日期
  305. // },
  306. },
  307. };
  308. },
  309. methods: {
  310. //1.表单收集 start ------------------------------------------------------------>
  311. //1.1切换密码框的显示与隐藏
  312. showPwd(num) {
  313. const passwordTypeKey = 'passwordType' + num; //动态生成 passwordType 的键
  314. const passwordRefKey = 'password' + num; //动态生成 password 的引用
  315. // 切换密码类型
  316. if (this[passwordTypeKey] === 'password') {
  317. this[passwordTypeKey] = ''; //显示密码
  318. } else {
  319. this[passwordTypeKey] = 'password'; //隐藏密码
  320. }
  321. // 使用 $nextTick 聚焦到对应的密码输入框
  322. this.$nextTick(() => {
  323. this.$refs[passwordRefKey].focus(); //聚焦到对应的密码输入框
  324. });
  325. },
  326. //1.2获得角色列表池
  327. getRoleList(){
  328. let data = {
  329. page:1,
  330. pageSize:100
  331. }
  332. this.$store.dispatch('userRole/roleList',data).then(res=>{
  333. this.role_idArr = res.data.rows.map(item => ({
  334. value: item.id,
  335. label: item.role_name
  336. }));
  337. }).catch(error=>{
  338. this.$message({
  339. type: 'warning',
  340. message: '网络错误,请重试!'
  341. });
  342. })
  343. },
  344. //1.3更新工作区域
  345. update_city_arr_id(value){
  346. console.log("工作区域ID已更新:", value);
  347. this.form.city_arr_id = value;
  348. },
  349. //1.5更新详细地址
  350. update_address_arr_id(value){
  351. console.log("详细地址ID已更新:", value);
  352. this.form.address_arr_id = value;
  353. },
  354. //1.5重置表单
  355. clearData(){
  356. },
  357. //表单收集 end ------------------------------------------------------------>
  358. //2.提交表单 start ------------------------------------------------------------>
  359. //2.3 多文件上传
  360. handleRemove(file, fileList) {
  361. console.log(file, fileList);
  362. },
  363. handlePreview(file) {
  364. console.log(file);
  365. },
  366. handleExceed(files, fileList) {
  367. this.$message.warning(`当前限制选择 30 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`);
  368. },
  369. beforeRemove(file, fileList) {
  370. return this.$confirm(`确定移除 ${ file.name }?`);
  371. },
  372. //获取token
  373. getTokenFromCookie() {
  374. const name = "Admin-Token=";
  375. const decodedCookie = decodeURIComponent(document.cookie);
  376. const cookieArray = decodedCookie.split(';');
  377. for (let i = 0; i < cookieArray.length; i++) {
  378. let cookie = cookieArray[i].trim();
  379. if (cookie.indexOf(name) === 0) {
  380. return cookie.substring(name.length, cookie.length); // 返回 token
  381. }
  382. }
  383. return ""; // 如果没有找到 token,返回空字符串
  384. },
  385. //设置token
  386. setHeaders() {
  387. this.token = this.getTokenFromCookie(); // 从 cookie 中获取 token
  388. this.headers = { token: this.token }; // 设置 headers
  389. console.log(this.headers); // 打印 headers
  390. },
  391. //上传成功以后
  392. handleUploadSuccess(response) {
  393. this.form.other.push(response.data.imgUrl)
  394. console.log('上传成功:', response);
  395. console.log(this.form.other);
  396. },
  397. //提交表单
  398. addData(){
  399. console.log(this.timeList)
  400. //console.log(this.form.address_arr_id)
  401. //1.格式化时间戳
  402. if(this.form.long_time==0){
  403. this.form.from_time = formatLocalDate(this.timeList[0]);
  404. this.form.to_time = formatLocalDate(this.timeList[1]);
  405. }else{
  406. this.form.from_time = "";
  407. this.form.to_time = "";
  408. delete this.form.from_time;
  409. delete this.form.to_time;
  410. }
  411. //2.开始验证
  412. this.$refs.form.validate(valid => {
  413. if (valid) {
  414. //3.验证用户是否已经存在
  415. this.$store.dispatch('userMember/verifyUserInfo',{user_name:this.form.user_name}).then(res=>{
  416. if(res.code==0){
  417. //如果code为0表示用户不存在,提交表单
  418. this.$store.dispatch('userMember/createUser',this.form).then(res=>{
  419. if(res.code==200){
  420. console.log(res);
  421. this.$message({
  422. type: 'success',
  423. message: '用户添加成功!'
  424. });
  425. this.goList();
  426. }else{
  427. this.$message({
  428. type: 'warning',
  429. message: res.message
  430. });
  431. }
  432. })
  433. }else if(res.code==200){
  434. //如果code==200 表示用户存在,阻止进一步提交
  435. this.$message({
  436. type: 'warning',
  437. message: '该账号已被注册,请更换其他账号!'
  438. });
  439. }
  440. }).catch(error=>{
  441. this.$message({
  442. type: 'warning',
  443. message: '网络错误,请重试!'
  444. });
  445. })
  446. }
  447. })
  448. },
  449. //提交表单 start ------------------------------------------------------------>
  450. //3.编辑表单 start ------------------------------------------------------------>
  451. //获得网站列表
  452. getWebsiteList(){
  453. this.$store.dispatch('pool/getWebList',{page:1,pageSize:1000}).then(res=>{
  454. if(res.code!=200){
  455. this.$message.error(res.message)
  456. }else{
  457. for(let item of res.data.rows){
  458. let data = {
  459. value:item.id,
  460. label:item.website_name
  461. }
  462. this.webSiteList.push(data)
  463. }
  464. }
  465. })
  466. },
  467. //获得用户信息
  468. getUserInfo(){
  469. this.$store.dispatch('userMember/getUser',{id:this.editId}).then(res=>{
  470. console.log(res);
  471. //回显数据
  472. this.form.type_id = res.data.type_id;
  473. this.form.user_name = res.data.user_name;
  474. this.form.role_id = res.data.role_id;
  475. this.form.real_name = res.data.real_name;
  476. this.form.mobile = res.data.mobile;
  477. this.form.number = res.data.number;
  478. this.form.avatar = res.data.avatar;
  479. this.form.id_card = res.data.id_card;
  480. this.form.fax = res.data.fax;
  481. this.form.business_name = res.data.business_name;
  482. this.form.legal_person_id_card = res.data.legal_person_id_card;
  483. this.form.legal_person_mobile = res.data.legal_person_mobile;
  484. this.form.legal_person_real_name = res.data.legal_person_real_name;
  485. this.form.position = res.data.position;
  486. //还原有效期
  487. if(res.data.long_time==0){
  488. this.timeList = [
  489. res.data.from_time,
  490. res.data.to_time
  491. ]
  492. this.form.from_time = res.data.from_time;
  493. this.form.to_time = res.data.to_time;
  494. this.form.long_time = 0;
  495. }else{
  496. this.form.from_time = "";
  497. this.form.to_time = "";
  498. this.form.long_time = 1;
  499. }
  500. this.form.qq = res.data.qq;
  501. this.form.email = res.data.email;
  502. this.form.zip_code = res.data.zip_code;
  503. this.form.remark = res.data.remark;
  504. this.form.address_arr_id = res.data.address_arr_id;
  505. // 处理文件列表
  506. const fileArrayString = res.data.other; // 假设这是一个字符串格式的数组
  507. const fileArray = JSON.parse(fileArrayString); // 解析为数组
  508. this.form.other.push(...fileArray); // 将解析出来的值 push 到 this.form.other
  509. // 将文件列表赋值给 otherList,生成默认文件名
  510. this.otherList = fileArray.map((url, index) => ({
  511. name: `文件${index + 1}`, // 生成文件名
  512. url: url, // 文件的 URL
  513. status: 'success' // 设置状态为 success
  514. }));
  515. }).catch(error=>{
  516. this.$message({
  517. type: 'warning',
  518. message: '网络错误,请重试!'
  519. });
  520. })
  521. },
  522. //修改用户
  523. editData(){
  524. //1.格式化时间戳
  525. if(this.form.long_time==0){
  526. this.form.from_time = formatLocalDate(this.timeList[0]);
  527. this.form.to_time = formatLocalDate(this.timeList[1]);
  528. }else{
  529. this.form.from_time = "";
  530. this.form.to_time = "";
  531. }
  532. this.$refs.form.validate(valid => {
  533. if (valid) {
  534. //1.验证用户是否存在
  535. this.$store.dispatch('userMember/verifyUserInfo',{id:this.editId,user_name:this.form.user_name}).then(res=>{
  536. if(res.code==0){
  537. console.log(this.form);
  538. this.form.address_arr_id = JSON.parse(this.form.address_arr_id);
  539. //2.设置修改的用户id
  540. this.form.id = this.editId;
  541. //3.提交用户修改
  542. //如果code为0表示用户不存在,提交表单
  543. this.$store.dispatch('userMember/updateUser',this.form).then(res=>{
  544. console.log(res);
  545. this.$message({
  546. type: 'success',
  547. message: '用户添加成功!'
  548. });
  549. this.goList();
  550. })
  551. }else if(res.code==200){
  552. //如果code==200 表示用户存在,阻止进一步提交
  553. this.$message({
  554. type: 'warning',
  555. message: '该账号已被注册,请更换其他账号!'
  556. });
  557. }
  558. }).catch(error=>{
  559. this.$message({
  560. type: 'warning',
  561. message: '网络错误,请重试!'
  562. });
  563. })
  564. }
  565. })
  566. },
  567. //重置密码
  568. resetPassword(){
  569. let password = Math.random().toString(36).slice(-6); // 随机生成6个字母的组合
  570. this.$store.dispatch('userMember/resetPassword',{id:this.editId,password:password}).then(res=> {
  571. if(res.code==200){
  572. this.$message({
  573. type: 'success',
  574. message: '密码重置为:' + password
  575. });
  576. }
  577. }).catch(() => {
  578. this.$message({
  579. type: 'warning',
  580. message: '网络错误,请重试!'
  581. });
  582. })
  583. },
  584. //编辑表单 end ------------------------------------------------------------>
  585. goList(){
  586. this.$router.push({
  587. path: '/userList',
  588. });
  589. },
  590. },
  591. mounted(){
  592. this.getRoleList();
  593. //判断是新建还是回显
  594. if(this.$route.query.id!=undefined){
  595. this.editId = this.$route.query.id;
  596. console.log("编辑用户!")
  597. this.getUserInfo();
  598. }else{
  599. console.log("添加用户!")
  600. }
  601. //设置token
  602. this.setHeaders(); // 在组件挂载时设置 headers
  603. //获取所有网站列表
  604. this.getWebsiteList();
  605. }
  606. };
  607. </script>
  608. <style scoped lang="less">
  609. .PasswordBox {
  610. display: flex;
  611. align-items: center;
  612. .el-form-item {
  613. flex: 1;
  614. }
  615. .PasswordTitle {
  616. width:120px;
  617. text-align: right;
  618. margin-right: 10px;
  619. margin-bottom:22px;
  620. }
  621. .PasswordBody {
  622. flex: 1;
  623. display: flex;
  624. align-items: center;
  625. }
  626. .show-pwd {
  627. margin-left: 10px;
  628. }
  629. }
  630. .longTimeCheckbox {
  631. margin-left: 10px;
  632. }
  633. //执行v-deep穿透scope选择器 start------------------------------------------------------------>*/
  634. ::v-deep .custom-form-item > .el-form-item__label {
  635. line-height: 140px !important;
  636. }
  637. ::v-deep .custom-textarea .el-textarea__inner {
  638. resize: none; /* 禁止用户拖拽调整大小 */
  639. }
  640. ::v-deep .custom-align-right .el-form-item__label {
  641. text-align: right; /* 设置标签文字右对齐 */
  642. }
  643. ::v-deep .el-select {
  644. width: 100%; /* 禁止用户拖拽调整大小 */
  645. }
  646. //执行v-deep穿透scope选择器 end------------------------------------------------------------>*/
  647. </style>