userEnterprise.vue 28 KB

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