userEnterprise.vue 29 KB

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