index.vue 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883
  1. <template>
  2. <div class="app-container">
  3. <el-tabs v-model="step">
  4. <el-tab-pane label="商户信息" name="first"></el-tab-pane>
  5. <el-tab-pane label="商城配置信息" name="second"></el-tab-pane>
  6. <el-tab-pane label="微信配置信息" name="third"></el-tab-pane>
  7. <el-tab-pane label="结算配置信息" name="four"></el-tab-pane>
  8. <el-tab-pane label="移动端二维码" name="five"></el-tab-pane>
  9. </el-tabs>
  10. <div v-show="step == 'first'">
  11. <el-form class="my-form" ref="step1Form" :model="step1Form" label-width="100px" label-position="right">
  12. <el-form-item label="商户账号" prop="account">
  13. <el-input v-model="step1Form.account" disabled></el-input>
  14. </el-form-item>
  15. <el-form-item label="账户昵称" prop="nickName">
  16. <el-input v-model="step1Form.nickName" disabled></el-input>
  17. </el-form-item>
  18. <el-form-item label="小程序名称" prop="appName">
  19. <el-input v-model="step1Form.appName" disabled></el-input>
  20. </el-form-item>
  21. <el-form-item label="负责人" prop="chargePerson">
  22. <el-input v-model="step1Form.chargePerson" disabled></el-input>
  23. </el-form-item>
  24. <el-form-item label="联系电话" prop="phone">
  25. <el-input v-model="step1Form.phone" disabled></el-input>
  26. </el-form-item>
  27. <el-form-item label="电子邮箱" prop="email">
  28. <el-input v-model="step1Form.email" disabled></el-input>
  29. </el-form-item>
  30. <el-form-item label="地址" prop="address">
  31. <el-input v-model="step1Form.address" disabled></el-input>
  32. </el-form-item>
  33. <el-form-item label="登录密码" prop="password">
  34. <el-input v-model="step1Form.password" type="password" disabled></el-input>
  35. <el-button class="reset" @click="handleReset()">重置密码</el-button>
  36. </el-form-item>
  37. <el-form-item label="到期时间" prop="companyExpireTime">
  38. <el-date-picker
  39. v-model="step1Form.companyExpireTime"
  40. type="datetime"
  41. value-format="yyyy-MM-dd HH:mm:ss"
  42. placeholder="选择日期时间">
  43. </el-date-picker>
  44. <el-button type="primary" @click="saveTime()">保存</el-button>
  45. </el-form-item>
  46. <!-- <el-form-item class="tr">
  47. <el-button type="primary" @click="submitStep1Form">保存</el-button>
  48. </el-form-item> -->
  49. </el-form>
  50. </div>
  51. <div v-show="step == 'second'">
  52. <el-form label-width="100px" label-position="right">
  53. <el-upload class="avatar-uploader" :action="baseURL + 'common/upload'" :headers="myHeaders"
  54. :show-file-list="false" :on-success="uploadSuccess" :before-upload="beforeUpload">
  55. </el-upload>
  56. <el-form-item label="主logo" prop="imgUrl">
  57. <div class="images">
  58. <div class="main-img">
  59. <div class="img" v-if="img1_url" @mouseover="img1_hover = true;" @mouseout="img1_hover = false;">
  60. <el-image ref="img1" :src="img1_url" :preview-src-list="[img1_url]" style="width: 120px; height: 120px"
  61. fit="contain"></el-image>
  62. <div class="mask" v-show="img1_hover">
  63. <i class="el-icon-zoom-in" @click="previewImage('img1')"></i>
  64. <i class="el-icon-upload2" @click="uploadImage('img1')"></i>
  65. </div>
  66. </div>
  67. <div class="add" v-else @click="uploadImage('img1')">
  68. <i class="el-icon-plus avatar-uploader-icon"></i>
  69. </div>
  70. </div>
  71. <div class="tmp-img">
  72. <el-image :src="require('@/assets/template/template_1.png')"
  73. :preview-src-list="[require('@/assets/template/template_1.png')]"
  74. style="width: 120px; height: 120px; display: block" fit="contain"></el-image>
  75. <div class="tmp">示例图</div>
  76. </div>
  77. </div>
  78. <div class="tips">
  79. <span>建议尺寸:400*400</span>
  80. </div>
  81. </el-form-item>
  82. <el-form-item label="通用logo" prop="imgUrl">
  83. <div class="images">
  84. <div class="main-img">
  85. <div class="img" v-if="img2_url" @mouseover="img2_hover = true;" @mouseout="img2_hover = false;">
  86. <el-image ref="img2" :src="img2_url" :preview-src-list="[img2_url]" style="width: 120px; height: 120px"
  87. fit="contain"></el-image>
  88. <div class="mask" v-show="img2_hover">
  89. <i class="el-icon-zoom-in" @click="previewImage('img2')"></i>
  90. <i class="el-icon-upload2" @click="uploadImage('img2')"></i>
  91. </div>
  92. </div>
  93. <div class="add" v-else @click="uploadImage('img2')">
  94. <i class="el-icon-plus avatar-uploader-icon"></i>
  95. </div>
  96. </div>
  97. <div class="tmp-img">
  98. <el-image :src="require('@/assets/template/template_2.png')"
  99. :preview-src-list="[require('@/assets/template/template_2.png')]"
  100. style="width: 120px; height: 120px; display: block" fit="contain"></el-image>
  101. <div class="tmp">示例图</div>
  102. </div>
  103. </div>
  104. <div class="tips">
  105. <span>建议尺寸:280*60</span>
  106. </div>
  107. </el-form-item>
  108. <el-form-item label="头像logo" prop="imgUrl">
  109. <div class="images">
  110. <div class="main-img">
  111. <div class="img" v-if="img3_url" @mouseover="img3_hover = true;" @mouseout="img3_hover = false;">
  112. <el-image ref="img3" :src="img3_url" :preview-src-list="[img3_url]" style="width: 120px; height: 120px"
  113. fit="contain"></el-image>
  114. <div class="mask" v-show="img3_hover">
  115. <i class="el-icon-zoom-in" @click="previewImage('img3')"></i>
  116. <i class="el-icon-upload2" @click="uploadImage('img3')"></i>
  117. </div>
  118. </div>
  119. <div class="add" v-else @click="uploadImage('img3')">
  120. <i class="el-icon-plus avatar-uploader-icon"></i>
  121. </div>
  122. </div>
  123. <div class="tmp-img">
  124. <el-image :src="require('@/assets/template/template_3.png')"
  125. :preview-src-list="[require('@/assets/template/template_3.png')]"
  126. style="width: 120px; height: 120px; display: block" fit="contain"></el-image>
  127. <div class="tmp">示例图</div>
  128. </div>
  129. </div>
  130. <div class="tips">
  131. <span>建议尺寸:400*400</span>
  132. </div>
  133. </el-form-item>
  134. </el-form>
  135. </div>
  136. <div v-show="step == 'third'">
  137. <!-- <div class="tips">说明:企微配置是指通过配置企业微信将企微用户和系统打通,实现企业微信用户信息同平台互通,聊天会话信息同步</div> -->
  138. <el-form class="my-form2" ref="step3Form" :model="step3Form" :rules="step3FormRules" label-width="200px"
  139. label-position="right">
  140. <!-- <el-card shadow="never" class="my-card">
  141. <div class="title">1.配置企业ID</div>
  142. <div class="box">指引:进入<el-link type="primary" :underline="false" href="https://element.eleme.io" target="_blank">企业微信</el-link>打开【我的企业】,将企业ID分别复制并填写到下方输入框中</div>
  143. <el-form-item label="企业ID" prop="enterpriseId">
  144. <el-input v-model="step3Form.enterpriseId" autocomplete="off" placeholder="请输入企业ID"></el-input>
  145. </el-form-item>
  146. </el-card>
  147. <el-card shadow="never" class="my-card">
  148. <div class="title">2.配置通讯录密钥(Secret)</div>
  149. <div class="box">进入<el-link type="primary" :underline="false" href="https://element.eleme.io" target="_blank">企业微信</el-link>打开【客户联系】-选择【客户】-展开右侧【API】。将外部联系人Secret复制并填写到下方输入框中。如果外部联系人Secret不更新,请将更新后的外部联系人Secret更新复制更新到下方输入框中。</div>
  150. <el-form-item label="通讯录密钥(Secret)" prop="listSecret">
  151. <el-input v-model="step3Form.listSecret" autocomplete="off" placeholder="请输入通讯录密钥(Secret)"></el-input>
  152. </el-form-item>
  153. <el-divider></el-divider>
  154. <div class="title">配置通讯录同步密钥(Secret)</div>
  155. <div class="box">进入<el-link type="primary" :underline="false" href="https://element.eleme.io" target="_blank">企业微信</el-link>打开【管理工具】-选择【通讯录同步】-获取通讯录同步Secret。将通讯录同步Secret复制并填写到下方输入框中。如果通讯录同步Secret不更新,请将更新后的通讯录同步Secret更新复制更新到下方输入框中。</div>
  156. <el-form-item label="通讯录同步密钥(Secret)" prop="listSyncSecret">
  157. <el-input v-model="step3Form.listSyncSecret" autocomplete="off" placeholder="请输入通讯录同步密钥(Secret)"></el-input>
  158. </el-form-item>
  159. </el-card>
  160. <el-card shadow="never" class="my-card">
  161. <div class="title">3.配置小程序</div>
  162. <div class="box">进入<el-link type="primary" :underline="false" href="https://element.eleme.io" target="_blank">企业微信</el-link>打开【应用管理】-选择【应用】-选择【小程序】-获取小程序AgentiD、小程序Secret。将小程序AgentiD、小程序Secret复制并填写到下方输入框中。</div>
  163. <el-form-item label="小程序(AgentiD)" prop="appAgentId">
  164. <el-input v-model="step3Form.appAgentId" autocomplete="off" placeholder="请输入小程序(AgentiD)"></el-input>
  165. </el-form-item>
  166. <el-form-item label="小程序(Secret)" prop="appSecret">
  167. <el-input v-model="step3Form.appSecret" autocomplete="off" placeholder="请输入小程序(Secret)"></el-input>
  168. </el-form-item>
  169. </el-card> -->
  170. <el-card shadow="never" class="my-card">
  171. <div class="title" style="margin-bottom: 20px;">1.其他基础配置</div>
  172. <el-form-item label="小程序appId" prop="appId">
  173. <el-input v-model="step3Form.appId" autocomplete="off" placeholder="请输入小程序appId"></el-input>
  174. </el-form-item>
  175. <el-form-item label="商户号Id" prop="merchantId">
  176. <el-input v-model="step3Form.merchantId" autocomplete="off" placeholder="请输入商户号Id"></el-input>
  177. </el-form-item>
  178. <el-form-item label="商户号Key" prop="merchantKey">
  179. <el-input v-model="step3Form.merchantKey" autocomplete="off" placeholder="请输入商户号Key"></el-input>
  180. </el-form-item>
  181. <el-form-item label="子appId" prop="childAppId">
  182. <el-input v-model="step3Form.childAppId" autocomplete="off" placeholder="请输入子appId"></el-input>
  183. </el-form-item>
  184. <el-form-item label="子密钥" prop="childKey">
  185. <el-input v-model="step3Form.childKey" autocomplete="off" placeholder="请输入子密钥"></el-input>
  186. </el-form-item>
  187. <el-form-item label="子商户号Id" prop="childMerchantId">
  188. <el-input v-model="step3Form.childMerchantId" autocomplete="off" placeholder="请输入子商户号Id"></el-input>
  189. </el-form-item>
  190. <el-form-item label="微信订阅模版" prop="templateId">
  191. <el-input v-model="step3Form.templateId" autocomplete="off" placeholder="请输入微信订阅模版"></el-input>
  192. </el-form-item>
  193. <el-form-item label="公众号appid" prop="pubAppId">
  194. <el-input v-model="step3Form.pubAppId" autocomplete="off" placeholder="请输入公众号appid"></el-input>
  195. </el-form-item>
  196. <el-form-item label="公众号密钥" prop="pubAppSecret">
  197. <el-input v-model="step3Form.pubAppSecret" autocomplete="off" placeholder="请输入公众号密钥"></el-input>
  198. </el-form-item>
  199. </el-card>
  200. </el-form>
  201. </div>
  202. <div v-show="step == 'four'">
  203. <el-form ref="step4Form" :model="step4Form" :rules="step4FormRules" label-width="100px" label-position="right">
  204. <h4>说明:将按照T+N天自动把销售订单“待结算”状态转为“可提现”状态,T为订单支付成功的日期。</h4>
  205. <h5>自动结算频率</h5>
  206. <el-form-item label="N等于" prop="dayNum">
  207. <el-input v-model="step4Form.dayNum" style="width: 220px;margin-right: 20px;" autocomplete="off"
  208. placeholder="请输入天数" type="number"></el-input>
  209. 天<span style="color: #EA8000;margin-left: 30px;">将在订单支付成功后T+{{ step4Form.dayNum }}天{{ step4Form.hourTime
  210. }}执行一次</span>
  211. </el-form-item>
  212. <el-form-item label="执行时间" prop="hourTime">
  213. <el-time-picker v-model="step4Form.hourTime" value-format="HH:mm:ss" placeholder="选择执行时间">
  214. </el-time-picker>
  215. </el-form-item>
  216. </el-form>
  217. </div>
  218. <div v-show="step == 'five'">
  219. <el-form label-width="100px" label-position="right">
  220. <el-upload class="avatar-uploader" :action="baseURL + 'common/upload'" :headers="myHeaders"
  221. :show-file-list="false" :on-success="uploadSuccess" :before-upload="beforeUpload">
  222. </el-upload>
  223. <el-form-item label="小程序" prop="imgUrl">
  224. <div class="images">
  225. <div class="main-img">
  226. <div class="img" v-if="qrcode1_url" @mouseover="qrcode1_hover = true;" @mouseout="qrcode1_hover = false;">
  227. <el-image ref="qrcode1" :src="qrcode1_url" :preview-src-list="[qrcode1_url]"
  228. style="width: 120px; height: 120px" fit="contain"></el-image>
  229. <div class="mask" v-show="qrcode1_hover">
  230. <i class="el-icon-zoom-in" @click="previewImage('qrcode1')"></i>
  231. <i class="el-icon-upload2" @click="uploadImage('qrcode1')"></i>
  232. </div>
  233. </div>
  234. <div class="add" v-else @click="uploadImage('qrcode1')">
  235. <i class="el-icon-plus avatar-uploader-icon"></i>
  236. </div>
  237. </div>
  238. </div>
  239. <div class="tips">
  240. <span>建议尺寸:400*400</span>
  241. </div>
  242. </el-form-item>
  243. <el-form-item label="公众号" prop="imgUrl">
  244. <div class="images">
  245. <div class="main-img">
  246. <div class="img" v-if="qrcode2_url" @mouseover="qrcode2_hover = true;" @mouseout="qrcode2_hover = false;">
  247. <el-image ref="qrcode2" :src="qrcode2_url" :preview-src-list="[qrcode2_url]"
  248. style="width: 120px; height: 120px" fit="contain"></el-image>
  249. <div class="mask" v-show="qrcode2_hover">
  250. <i class="el-icon-zoom-in" @click="previewImage('qrcode2')"></i>
  251. <i class="el-icon-upload2" @click="uploadImage('qrcode2')"></i>
  252. </div>
  253. </div>
  254. <div class="add" v-else @click="uploadImage('qrcode2')">
  255. <i class="el-icon-plus avatar-uploader-icon"></i>
  256. </div>
  257. </div>
  258. </div>
  259. <div class="tips">
  260. <span>建议尺寸:400*400</span>
  261. </div>
  262. </el-form-item>
  263. </el-form>
  264. </div>
  265. <div class="page-footer">
  266. <div class="footer" :class="classObj">
  267. <el-button type="primary" @click="submitStep2Form" :loading="formLoading" v-if="step == 'second'">{{ formLoading ?
  268. '保存中 ...' : '保 存' }}</el-button>
  269. <el-button type="primary" @click="submitStep3Form" :loading="formLoading" v-if="step == 'third'">{{ formLoading ?
  270. '保存中 ...' : '保 存' }}</el-button>
  271. <el-button type="primary" @click="submitStep4Form" :loading="formLoading" v-if="step == 'four'">{{ formLoading ?
  272. '保存中 ...' : '保 存' }}</el-button>
  273. <el-button type="primary" @click="submitStep5Form" :loading="formLoading" v-if="step == 'five'">{{ formLoading ?
  274. '保存中 ...' : '保 存' }}</el-button>
  275. <el-popconfirm title="确定关闭吗?" @confirm="goBack" style="margin-left: 10px;">
  276. <el-button slot="reference">关 闭</el-button>
  277. </el-popconfirm>
  278. </div>
  279. </div>
  280. <!-- 重置密码 -->
  281. <el-dialog title="重置密码" :visible.sync="resetFormVisible" :show-close="false" width="40%"
  282. :close-on-click-modal="false">
  283. <el-form ref="resetForm" :model="resetForm" :rules="resetFormRules" label-position="left" label-width="100px">
  284. <el-form-item label="输入新密码" prop="newPassword">
  285. <el-input v-model="resetForm.newPassword" ref="password1" autocomplete="off" placeholder="请输入新密码"
  286. :type="passwordType1"></el-input>
  287. <span class="show-pwd" @click="showPwd(1)">
  288. <svg-icon :icon-class="passwordType1 === 'password' ? 'eye' : 'eye-open'" />
  289. </span>
  290. </el-form-item>
  291. <el-form-item label="确认密码" prop="confirmPassword">
  292. <el-input v-model="resetForm.confirmPassword" ref="password2" autocomplete="off" placeholder="请再次输入新密码"
  293. :type="passwordType2"></el-input>
  294. <span class="show-pwd" @click="showPwd(2)">
  295. <svg-icon :icon-class="passwordType2 === 'password' ? 'eye' : 'eye-open'" />
  296. </span>
  297. </el-form-item>
  298. </el-form>
  299. <div slot="footer" class="dialog-footer">
  300. <el-button @click="cancelResetForm">取 消</el-button>
  301. <el-button type="primary" @click="submitResetForm">确 定</el-button>
  302. </div>
  303. </el-dialog>
  304. </div>
  305. </template>
  306. <script>
  307. import { getToken } from '@/utils/auth'
  308. import { getDetail, resetPassword, editAccount } from "@/api/merchant";
  309. import request from '@/utils/request'
  310. export default {
  311. data() {
  312. var validatePass = (rule, value, callback) => {
  313. if (value === '') {
  314. callback(new Error('请输入登录密码'));
  315. } else if (value.length < 12) {
  316. callback(new Error('密码长度至少12位'));
  317. } else if (/[A-Za-z].*[0-9]|[0-9].*[A-Za-z]/.test(value) == false) {
  318. callback(new Error('密码必须包含数字和字母'));
  319. } else {
  320. if (this.resetForm.confirmPassword !== '') {
  321. this.$refs.resetForm.validateField('confirmPassword');
  322. }
  323. callback();
  324. }
  325. };
  326. var validatePass2 = (rule, value, callback) => {
  327. if (value === '') {
  328. callback(new Error('请再次输入密码'));
  329. } else if (value !== this.resetForm.newPassword) {
  330. callback(new Error('两次输入密码不一致'));
  331. } else {
  332. callback();
  333. }
  334. };
  335. return {
  336. baseURL: process.env.VUE_APP_BASE_API,
  337. myHeaders: { 'x-token': getToken() },
  338. id: null,
  339. companyWechatId: null,
  340. step: 'first',
  341. step1Form: {
  342. account: '', // 账号
  343. nickName: '', // 用户名
  344. appName: '', // 小程序名称
  345. chargePerson: '', // 负责人
  346. phone: '', // 联系电话
  347. email: '', // 电子邮箱
  348. address: '', // 地址
  349. newPassword: '', // 新密码
  350. confirmPassword: '', // 确认密码
  351. companyExpireTime: ''
  352. },
  353. passwordType1: 'password',
  354. passwordType2: 'password',
  355. uploadImageType: null,
  356. img1_url: '',
  357. img1_hover: false,
  358. img2_url: '',
  359. img2_hover: false,
  360. img3_url: '',
  361. img3_hover: false,
  362. qrcode1_url: '',
  363. qrcode1_hover: false,
  364. qrcode2_url: '',
  365. qrcode2_hover: false,
  366. resetFormVisible: false,
  367. resetForm: {
  368. newPassword: '', // 新密码
  369. confirmPassword: '', // 确认密码
  370. },
  371. resetFormRules: {
  372. newPassword: [
  373. { required: true, validator: validatePass, trigger: 'blur' }
  374. ],
  375. confirmPassword: [
  376. { required: true, validator: validatePass2, trigger: 'blur' }
  377. ],
  378. },
  379. step3Form: {
  380. enterpriseId: '',
  381. listSecret: '',
  382. listSyncSecret: '',
  383. appAgentId: '',
  384. appSecret: '',
  385. appId: '',
  386. merchantId: '',
  387. merchantKey: '',
  388. childAppId: '',
  389. childKey: '',
  390. childMerchantId: '',
  391. templateId: '',
  392. pubAppId: '',
  393. pubAppSecret: '',
  394. },
  395. step3FormRules: {
  396. enterpriseId: [
  397. // { required: true, message: '请输入企业ID', trigger: 'blur' }
  398. ],
  399. listSecret: [
  400. // { required: true, message: '请输入通讯录密钥(Secret)', trigger: 'blur' }
  401. ],
  402. listSyncSecret: [
  403. // { required: true, message: '请输入通讯录同步密钥(Secret)', trigger: 'blur' }
  404. ],
  405. appAgentId: [
  406. // { required: true, message: '请输入小程序(AgentiD)', trigger: 'blur' }
  407. ],
  408. appSecret: [
  409. // { required: true, message: '请输入小程序(Secret)', trigger: 'blur' }
  410. ],
  411. },
  412. step4Form: {
  413. dayNum: '',
  414. hourTime: ''
  415. },
  416. step4FormRules: {
  417. dayNum: [
  418. { required: true, message: '请输入天数', trigger: 'blur' }
  419. ],
  420. hourTime: [
  421. { required: true, message: '请选择执行时间', trigger: 'change' }
  422. ],
  423. },
  424. formLoading: false,
  425. }
  426. },
  427. computed: {
  428. sidebar() {
  429. return this.$store.state.app.sidebar
  430. },
  431. classObj() {
  432. return {
  433. hideSidebar: !this.sidebar.opened,
  434. openSidebar: this.sidebar.opened
  435. }
  436. },
  437. },
  438. created() {
  439. const { id, type } = this.$route.query;
  440. this.id = id;
  441. this.getDetail();
  442. if (type === 1) {
  443. this.step = 'first';
  444. } else if (type === 2) {
  445. this.step = 'second';
  446. } else if (type === 3) {
  447. this.step = 'third';
  448. }
  449. },
  450. methods: {
  451. goBack() {
  452. this.$router.go(-1);
  453. },
  454. // 获取详情
  455. getDetail() {
  456. getDetail({ adminUserId: this.id }).then(res => {
  457. this.step1Form.account = res.data.userName;
  458. this.step1Form.nickName = res.data.nickName;
  459. this.step1Form.appName = res.data.minAppName;
  460. this.step1Form.chargePerson = res.data.linkName;
  461. this.step1Form.phone = res.data.linkPhone;
  462. this.step1Form.email = res.data.email;
  463. this.step1Form.address = res.data.address;
  464. this.step1Form.password = '************';
  465. this.step1Form.companyExpireTime = res.data.companyExpireTime
  466. this.img1_url = res.data.minLogo1;
  467. this.img2_url = res.data.minLogo2;
  468. this.img3_url = res.data.minLogo3;
  469. this.qrcode1_url = res.data.qrcode1;
  470. this.qrcode2_url = res.data.qrcode2;
  471. this.step3Form.enterpriseId = res.data.corpId;
  472. this.step3Form.listSecret = res.data.secret2;
  473. this.step3Form.listSyncSecret = res.data.secret3;
  474. this.step3Form.appAgentId = res.data.agentId1;
  475. this.step3Form.appSecret = res.data.secret1;
  476. this.step3Form.appId = res.data.appId;
  477. this.step3Form.merchantId = res.data.mchId;
  478. this.step3Form.merchantKey = res.data.mchKey;
  479. this.step3Form.childAppId = res.data.subAppId;
  480. this.step3Form.childKey = res.data.subSecret;
  481. this.step3Form.childMerchantId = res.data.subMchId;
  482. this.step3Form.templateId = res.data.template;
  483. this.step3Form.pubAppId = res.data.pubAppId;
  484. this.step3Form.pubAppSecret = res.data.pubAppSecret;
  485. this.companyWechatId = res.data.companyWechatId;
  486. this.step4Form.dayNum = res.data.dayNum
  487. this.step4Form.hourTime = res.data.hourTime
  488. })
  489. },
  490. // 重置密码
  491. handleReset(id) {
  492. this.resetId = id;
  493. this.resetFormVisible = true;
  494. },
  495. // 取消重置密码
  496. cancelResetForm() {
  497. this.resetFormVisible = false;
  498. this.passwordType1 = 'password';
  499. this.passwordType2 = 'password';
  500. this.$refs.resetForm.resetFields();
  501. },
  502. saveTime(){
  503. request({
  504. url: '/admin/user/user/updateCompanyWechat',
  505. method: 'post',
  506. data: {
  507. expireTime: this.step1Form.companyExpireTime,
  508. companyWechatId: this.companyWechatId
  509. }
  510. }).then(res =>{
  511. if(res.code == 200){
  512. this.$successMsg('保存成功');
  513. this.getDetail()
  514. }
  515. })
  516. },
  517. // 提交重置密码
  518. submitResetForm() {
  519. this.$refs.resetForm.validate((valid) => {
  520. if (valid) {
  521. let params = {
  522. password: this.resetForm.newPassword,
  523. adminUserId: this.id
  524. }
  525. resetPassword(params).then(res => {
  526. this.cancelResetForm();
  527. this.getDetail();
  528. this.$successMsg();
  529. })
  530. }
  531. })
  532. },
  533. // 显示隐藏密码
  534. showPwd(num) {
  535. if (num == 1) {
  536. if (this.passwordType1 === 'password') {
  537. this.passwordType1 = ''
  538. } else {
  539. this.passwordType1 = 'password'
  540. }
  541. this.$nextTick(() => {
  542. this.$refs.password1.focus()
  543. })
  544. }
  545. if (num == 2) {
  546. if (this.passwordType2 === 'password') {
  547. this.passwordType2 = ''
  548. } else {
  549. this.passwordType2 = 'password'
  550. }
  551. this.$nextTick(() => {
  552. this.$refs.password2.focus()
  553. })
  554. }
  555. },
  556. uploadImage(type) {
  557. this.uploadImageType = type;
  558. document.querySelector('.avatar-uploader input').click();
  559. },
  560. // 上传图片
  561. uploadSuccess(res, file) {
  562. this[this.uploadImageType + '_url'] = res.data.url;
  563. },
  564. beforeUpload(file) {
  565. const fileSuffix = file.name.substring(file.name.lastIndexOf(".") + 1);
  566. const whiteList = ['jpg', 'jpeg', 'png'];
  567. if (whiteList.indexOf(fileSuffix) === -1) {
  568. this.$errorMsg('只支持上传jpg/jpeg/png文件!');
  569. return false;
  570. }
  571. },
  572. // 预览图片
  573. previewImage(type) {
  574. this.$refs[type].showViewer = true;
  575. },
  576. submitStep2Form() {
  577. if (!this.img1_url) {
  578. return this.$errorMsg('请上传主logo');
  579. }
  580. if (!this.img2_url) {
  581. return this.$errorMsg('请上传通用logo');
  582. }
  583. if (!this.img3_url) {
  584. return this.$errorMsg('请上传头像logo');
  585. }
  586. this.formLoading = true;
  587. let params = {
  588. adminUserId: this.id,
  589. minLogo1: this.img1_url,
  590. minLogo2: this.img2_url,
  591. minLogo3: this.img3_url,
  592. companyWechatId: this.companyWechatId
  593. }
  594. editAccount(params).then(res => {
  595. this.$successMsg('保存成功');
  596. setTimeout(() => {
  597. this.goBack();
  598. }, 1500)
  599. }).finally(res => {
  600. this.formLoading = false;
  601. })
  602. },
  603. submitStep3Form() {
  604. this.$refs.step3Form.validate((valid) => {
  605. if (valid) {
  606. this.formLoading = true;
  607. let params = {
  608. adminUserId: this.id,
  609. corpId: this.step3Form.enterpriseId,
  610. secret2: this.step3Form.listSecret,
  611. secret3: this.step3Form.listSyncSecret,
  612. agentId1: this.step3Form.appAgentId,
  613. secret1: this.step3Form.appSecret,
  614. appId: this.step3Form.appId,
  615. mchId: this.step3Form.merchantId,
  616. mchKey: this.step3Form.merchantKey,
  617. subAppId: this.step3Form.childAppId,
  618. subSecret: this.step3Form.childKey,
  619. subMchId: this.step3Form.childMerchantId,
  620. template: this.step3Form.templateId,
  621. pubAppId: this.step3Form.pubAppId,
  622. pubAppSecret: this.step3Form.pubAppSecret,
  623. companyWechatId: this.companyWechatId
  624. }
  625. editAccount(params).then(res => {
  626. this.$successMsg('保存成功');
  627. setTimeout(() => {
  628. this.goBack();
  629. }, 1500)
  630. }).finally(res => {
  631. this.formLoading = false;
  632. })
  633. }
  634. })
  635. },
  636. submitStep4Form() {
  637. this.$refs.step4Form.validate((valid) => {
  638. if (valid) {
  639. this.formLoading = true;
  640. let params = {
  641. adminUserId: this.id,
  642. companyWechatId: this.companyWechatId,
  643. dayNum: this.step4Form.dayNum,
  644. hourTime: this.step4Form.hourTime,
  645. }
  646. editAccount(params).then(res => {
  647. this.$successMsg('保存成功');
  648. setTimeout(() => {
  649. this.goBack();
  650. }, 1500)
  651. }).finally(res => {
  652. this.formLoading = false;
  653. })
  654. }
  655. })
  656. },
  657. submitStep5Form() {
  658. if (!this.qrcode1_url) {
  659. return this.$errorMsg('请上传小程序图片');
  660. }
  661. if (!this.qrcode2_url) {
  662. return this.$errorMsg('请上传公众号图片');
  663. }
  664. this.formLoading = true;
  665. let params = {
  666. adminUserId: this.id,
  667. qrcode1: this.qrcode1_url,
  668. qrcode2: this.qrcode2_url,
  669. companyWechatId: this.companyWechatId
  670. }
  671. editAccount(params).then(res => {
  672. this.$successMsg('保存成功');
  673. setTimeout(() => {
  674. this.goBack();
  675. }, 1500)
  676. }).finally(res => {
  677. this.formLoading = false;
  678. })
  679. },
  680. }
  681. }
  682. </script>
  683. <style lang="scss" scoped>
  684. .setting_title {
  685. padding-left: 0;
  686. }
  687. .tips {
  688. font-size: 14px;
  689. }
  690. .my-card {
  691. margin-top: 20px;
  692. .box {
  693. background: rgb(235, 240, 249);
  694. padding: 10px;
  695. font-size: 14px;
  696. margin: 20px 0;
  697. line-height: 18px;
  698. ::v-deep .el-link {
  699. vertical-align: unset;
  700. }
  701. }
  702. }
  703. .my-form {
  704. width: 450px;
  705. margin-top: 20px;
  706. }
  707. .show-pwd {
  708. position: absolute;
  709. right: 15px;
  710. top: 0;
  711. font-size: 16px;
  712. cursor: pointer;
  713. user-select: none;
  714. }
  715. .question {
  716. position: absolute;
  717. right: -30px;
  718. top: 0;
  719. font-size: 20px;
  720. cursor: pointer;
  721. user-select: none;
  722. }
  723. .reset {
  724. position: absolute;
  725. right: -110px;
  726. top: 0;
  727. }
  728. .my-form2 {
  729. ::v-deep input {
  730. width: 400px;
  731. }
  732. }
  733. .tips {
  734. margin-top: 10px;
  735. span {
  736. display: inline-block;
  737. width: 300px;
  738. text-align: center;
  739. line-height: 32px;
  740. background: #ffefef;
  741. font-size: 14px;
  742. color: #f66460;
  743. }
  744. }
  745. .images {
  746. display: flex;
  747. flex-wrap: wrap;
  748. .main-img {
  749. display: flex;
  750. flex-direction: column;
  751. justify-content: center;
  752. align-items: center;
  753. width: 120px;
  754. margin-right: 20px;
  755. .img {
  756. border: 1px dashed #eaeaea;
  757. border-radius: 5px;
  758. overflow: hidden;
  759. position: relative;
  760. .el-image {
  761. display: block;
  762. }
  763. .mask {
  764. position: absolute;
  765. left: 0;
  766. top: 0;
  767. width: 120px;
  768. height: 120px;
  769. background: rgba($color: #000000, $alpha: 0.3);
  770. display: flex;
  771. align-items: center;
  772. justify-content: center;
  773. i {
  774. font-size: 20px;
  775. color: #ffffff;
  776. cursor: pointer;
  777. margin: 0 8px;
  778. }
  779. }
  780. }
  781. .text {
  782. font-size: 14px;
  783. color: #666666;
  784. }
  785. }
  786. .add {
  787. width: 120px;
  788. height: 120px;
  789. border: 1px dashed #eaeaea;
  790. border-radius: 5px;
  791. cursor: pointer;
  792. display: flex;
  793. align-items: center;
  794. justify-content: center;
  795. i {
  796. font-size: 30px;
  797. color: #999;
  798. }
  799. }
  800. .tmp-img {
  801. position: relative;
  802. .tmp {
  803. position: absolute;
  804. left: 0;
  805. top: 0;
  806. line-height: 20px;
  807. padding: 0 8px;
  808. background: #f66460;
  809. border-radius: 0 0 10px 0;
  810. font-size: 12px;
  811. color: #ffffff;
  812. }
  813. }
  814. }
  815. </style>