supplier.vue 33 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706
  1. categoryOptions<template>
  2. <div class="app-container calendar-list-container">
  3. <!-- 查询和其他操作 -->
  4. <div class="filter-container">
  5. <el-input clearable class="filter-item" style="width: 200px;" placeholder="供应商名称"
  6. v-model="listQuery.supplierName"></el-input>
  7. <el-input clearable class="filter-item" style="width: 200px;" placeholder="供应商编号"
  8. v-model="listQuery.supplierNum"></el-input>
  9. <el-select class="filter-item" style="width: 200px" v-model="listQuery.typeId" filterable placeholder="供应商类别">
  10. <el-option v-for="item in brandOptions" :key="item.value" :label="item.label" :value="item.value">
  11. </el-option>
  12. </el-select>
  13. <treeselect class="filter-item" default-expand-all v-model="listQuery.responsibleDept" :options="categoryOptions"
  14. :normalizer="normalizer" placeholder="申请部门" style="width: 200px" />
  15. <el-select v-model="listQuery.isEnable" clearable placeholder="是否启用" class="filter-item" style="width: 200px;">
  16. <el-option :key="item.type" v-for="item in goodsStatusList" :label="item.name" :value="item.type">
  17. </el-option>
  18. </el-select>
  19. <el-button class="filter-item" type="primary" v-waves icon="el-icon-search"
  20. @click="handleQuery">查找</el-button>
  21. <el-button class="filter-item" icon="el-icon-refresh" @click="resetQuery">重置</el-button>
  22. <el-button class="filter-item" type="primary" @click="handleAdd" icon="el-icon-plus">添加</el-button>
  23. <!-- <el-button class="filter-item" v-waves icon="el-icon-download" @click="handleDownLoad">导出</el-button> -->
  24. </div>
  25. <!-- 查询结果 -->
  26. <el-table size="small" :data="list" v-loading="listLoading" element-loading-text="正在查询中。。。" border fit
  27. highlight-current-row>
  28. <el-table-column type="index" label="序号" header-align="center" align="center">
  29. </el-table-column>
  30. <el-table-column align="center" min-width="120px" label="供应商编号" prop="supplierNum">
  31. </el-table-column>
  32. <el-table-column align="center" min-width="200px" label="供应商名称" prop="supplierName">
  33. </el-table-column>
  34. <el-table-column align="center" min-width="80px" label="供应商类别" prop="typeName">
  35. </el-table-column>
  36. <el-table-column align="center" min-width="80px" label="地域" prop="supplierPurchasAddress">
  37. </el-table-column>
  38. <el-table-column align="center" min-width="80px" label="联系人" prop="supplierContact">
  39. </el-table-column>
  40. <el-table-column align="center" min-width="80px" label="申请部门" prop="deptName">
  41. </el-table-column>
  42. <el-table-column align="center" min-width="180px" label="登记时间" prop="addTime">
  43. </el-table-column>
  44. <el-table-column align="center" min-width="100px" label="是否启用">
  45. <template slot-scope="props">
  46. <span v-if="props.row.isEnable == 0" style="color: #67C23A;font-weight: bold;">启用</span>
  47. <span v-if="props.row.isEnable == 1" style="color: #E6A23C;font-weight: bold;">停用</span>
  48. </template>
  49. </el-table-column>
  50. <el-table-column align="center" label="操作" width="240px" class-name="small-padding fixed-width">
  51. <template slot-scope="scope">
  52. <el-button type="primary" size="small" @click="handleUpdate(scope.row)">编辑</el-button>
  53. <el-button type="danger" size="small" @click="handleDelete(scope.row)">删除</el-button>
  54. </template>
  55. </el-table-column>
  56. </el-table>
  57. <!-- 分页 -->
  58. <div class="pagination-container">
  59. <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
  60. :current-page="listQuery.page" :page-sizes="[10, 20, 30, 50]" :page-size="listQuery.limit"
  61. layout="total, sizes, prev, pager, next, jumper" :total="total">
  62. </el-pagination>
  63. </div>
  64. <!-- 添加或修改对话框 -->
  65. <el-dialog :close-on-click-modal="false" :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible"
  66. width="70%">
  67. <el-form :rules="rules" ref="dataForm" :model="dataForm" status-icon label-position="left"
  68. label-width="100px" style='margin: 0 50px;'>
  69. <el-tabs v-model="activeName" @tab-click="handleClick">
  70. <el-tab-pane label="基础信息" name="first">
  71. <el-form-item label="供应商名称" prop="supplierName">
  72. <el-input v-model="dataForm.supplierName" placeholder="请输入"></el-input>
  73. </el-form-item>
  74. <el-form-item v-if="dataForm.supplierNum" label="供应商编号" prop="supplierNum">
  75. <el-input disabled v-model="dataForm.supplierNum"></el-input>
  76. </el-form-item>
  77. <el-form-item label="类别" prop="typeId">
  78. <el-select style="width: 100%" v-model="dataForm.typeId" filterable placeholder="请选择">
  79. <el-option v-for="item in brandOptions" :key="item.value" :label="item.label" :value="item.value">
  80. </el-option>
  81. </el-select>
  82. </el-form-item>
  83. <el-form-item label="地域" prop="supplierPurchasAddress">
  84. <el-input v-model="dataForm.supplierPurchasAddress" placeholder="请输入"></el-input>
  85. </el-form-item>
  86. <el-form-item label="注册资本金" prop="registeredCapital">
  87. <el-input v-model="dataForm.registeredCapital" placeholder="请输入注册资本金(万元)"></el-input>
  88. </el-form-item>
  89. <el-form-item label="银行卡号" prop="bankCardNo">
  90. <el-input v-model="dataForm.bankCardNo" placeholder="请输入"></el-input>
  91. </el-form-item>
  92. <el-form-item label="银行名称" prop="bankCardName">
  93. <el-input v-model="dataForm.bankCardName" placeholder="请输入"></el-input>
  94. </el-form-item>
  95. <el-form-item label="纳税性质" prop="nature">
  96. <el-select style="width: 100%" v-model="dataForm.nature" filterable placeholder="请选择">
  97. <el-option value="一般纳税人">一般纳税人</el-option>
  98. <el-option value="小规模纳税人">小规模纳税人</el-option>
  99. </el-select>
  100. </el-form-item>
  101. <el-form-item label="税率" prop="taxrate">
  102. <el-select style="width: 100%" v-model="dataForm.taxrate" filterable placeholder="请选择">
  103. <el-option value="0%">0%</el-option>
  104. <el-option value="1%">1%</el-option>
  105. <el-option value="3%">3%</el-option>
  106. </el-select>
  107. </el-form-item>
  108. <el-form-item label="联系人" prop="supplierContact">
  109. <el-input v-model="dataForm.supplierContact" placeholder="请输入"></el-input>
  110. </el-form-item>
  111. <el-form-item label="联系电话" prop="supplierPhone">
  112. <el-input v-model="dataForm.supplierPhone" placeholder="请输入"></el-input>
  113. </el-form-item>
  114. <el-form-item label="单位地址" prop="supplierAddress">
  115. <el-input v-model="dataForm.supplierAddress" placeholder="请输入"></el-input>
  116. </el-form-item>
  117. <el-form-item label="申请部门" prop="responsibleDept">
  118. <treeselect default-expand-all v-model="dataForm.responsibleDept" :options="categoryOptions"
  119. :normalizer="normalizer" placeholder="请选择" />
  120. </el-form-item>
  121. <el-form-item label="申请事由" prop="supplierRemark">
  122. <el-input
  123. type="textarea"
  124. :autosize="{ minRows: 2, maxRows: 4}"
  125. placeholder="请输入"
  126. v-model="dataForm.supplierRemark">
  127. </el-input>
  128. </el-form-item>
  129. </el-tab-pane>
  130. <el-tab-pane label="营业执照" name="second">
  131. <el-form-item label="名称" prop="businessName">
  132. <el-input v-model="dataForm.businessName" placeholder="请输入产地"></el-input>
  133. </el-form-item>
  134. <el-form-item label="开始日期" prop="businessStartTime">
  135. <el-date-picker style="width: 100%;" v-model="dataForm.businessStartTime" type="date" value-format="yyyy-MM-dd"
  136. placeholder="选择日期"></el-date-picker>
  137. </el-form-item>
  138. <el-form-item label="结束日期" prop="businessEndTime">
  139. <el-date-picker style="width: 100%;" v-model="dataForm.businessEndTime" type="date" value-format="yyyy-MM-dd"
  140. placeholder="选择日期"></el-date-picker>
  141. </el-form-item>
  142. <el-form-item style="width: 800px" label="附件" prop="businessFile">
  143. <el-upload :limit="1" :action="fileImgUrl" list-type="picture-card"
  144. :file-list="dataForm.businessFiles"
  145. :on-success="(response, file, fileList) => {return handleImgSucess(response, file, fileList, 'businessFiles')}"
  146. :on-exceed="handleExceed"
  147. :before-upload="beforeUploadImg"
  148. :on-remove="(file, fileList) => {return handleRemoveImg(file, fileList, 'businessFiles')}">
  149. <i class="el-icon-plus"></i>
  150. </el-upload>
  151. </el-form-item>
  152. </el-tab-pane>
  153. <el-tab-pane label="财务报表/审计报告" name="third">
  154. <el-form-item label="财务报表" prop="financeFileId">
  155. <el-upload :limit="1" :action="fileImgUrl" :file-list="dataForm.financeFiles"
  156. :on-success="(response, file, fileList) => {return handleFileSuccess(response, file, fileList, 'financeFiles')}"
  157. :before-upload="beforeUploadFile"
  158. :on-remove="(file, fileList) => {return handleRemoveFile(file, fileList, 'financeFiles')}">
  159. <el-button size="small" type="primary">点击上传</el-button>
  160. </el-upload>
  161. </el-form-item>
  162. <el-form-item label="审计报告" prop="auditFileId">
  163. <el-upload :limit="1" :action="fileImgUrl" :file-list="dataForm.auditFiles"
  164. :on-success="(response, file, fileList) => {return handleFileSuccess(response, file, fileList, 'auditFiles')}"
  165. :before-upload="beforeUploadFile"
  166. :on-remove="(file, fileList) => {return handleRemoveFile(file, fileList, 'auditFiles')}">
  167. <el-button size="small" type="primary">点击上传</el-button>
  168. </el-upload>
  169. </el-form-item>
  170. </el-tab-pane>
  171. <el-tab-pane label="供应商资质信息" name="fourth">
  172. <el-form-item label="名称" prop="qualifiedName">
  173. <el-input v-model="dataForm.qualifiedName" placeholder="请输入"></el-input>
  174. </el-form-item>
  175. <el-form-item label="开始日期" prop="qualifiedStartTime">
  176. <el-date-picker style="width: 100%;" v-model="dataForm.qualifiedStartTime" type="date" value-format="yyyy-MM-dd"
  177. placeholder="选择日期"></el-date-picker>
  178. </el-form-item>
  179. <el-form-item label="结束日期" prop="qualifiedEndTime">
  180. <el-date-picker style="width: 100%;" v-model="dataForm.qualifiedEndTime" type="date" value-format="yyyy-MM-dd"
  181. placeholder="选择日期"></el-date-picker>
  182. </el-form-item>
  183. <el-form-item style="width: 800px" label="附件" prop="qualifiedFile">
  184. <el-upload :limit="1" :action="fileImgUrl" list-type="picture-card"
  185. :file-list="dataForm.qualifiedFiles"
  186. :on-success="(response, file, fileList) => {return handleImgSucess(response, file, fileList, 'qualifiedFiles')}"
  187. :on-exceed="handleExceed"
  188. :before-upload="beforeUploadImg"
  189. :on-remove="(file, fileList) => {return handleRemoveImg(file, fileList, 'qualifiedFiles')}">
  190. <i class="el-icon-plus"></i>
  191. </el-upload>
  192. </el-form-item>
  193. </el-tab-pane>
  194. </el-tabs>
  195. </el-form>
  196. <div slot="footer" class="dialog-footer">
  197. <el-button @click="dialogFormVisible = false">取消</el-button>
  198. <el-button v-if="dialogStatus == 'create'" type="primary" @click="createData">确定</el-button>
  199. <el-button v-else type="primary" @click="updateData">确定</el-button>
  200. </div>
  201. </el-dialog>
  202. </div>
  203. </template>
  204. <script>
  205. import { createSupplier, updateSupplier, listSupplier, deleteSupplier, typeListSupplier } from "@/api/supplier";
  206. import { listDept } from "@/api/dept";
  207. import Treeselect from "@riophae/vue-treeselect";
  208. import "@riophae/vue-treeselect/dist/vue-treeselect.css";
  209. import waves from "@/directive/waves"; // 水波纹指令
  210. export default {
  211. components: { Treeselect },
  212. directives: { waves },
  213. data() {
  214. return {
  215. // 树选项
  216. categoryOptions: [],
  217. activeName: 'first',
  218. brandOptions: [],
  219. goodsStatusList: [
  220. {
  221. type: 0,
  222. name: '启用'
  223. },
  224. {
  225. type: 1,
  226. name: '停用'
  227. },
  228. ],
  229. list: [],
  230. total: 0,
  231. listLoading: false,
  232. listQuery: {
  233. page: 1,
  234. limit: 10,
  235. supplierName: '',
  236. supplierNum: '',
  237. typeId: '',
  238. responsibleDept: undefined,
  239. isEnable: '',
  240. },
  241. dataForm: {
  242. supplierName: undefined,
  243. supplierNum: undefined,
  244. supplierNum: undefined,
  245. typeId: undefined,
  246. supplierPurchasAddress: undefined,
  247. registeredCapital: undefined,
  248. bankCardNo: undefined,
  249. bankCardName: undefined,
  250. nature: undefined,
  251. taxrate: undefined,
  252. supplierContact: undefined,
  253. supplierPhone: undefined,
  254. supplierAddress: undefined,
  255. responsibleDept: undefined,
  256. supplierRemark: undefined,
  257. businessName: undefined,
  258. businessStartTime: undefined,
  259. businessEndTime: undefined,
  260. businessFile: undefined,
  261. businessFiles:[],
  262. financeFileId:undefined,
  263. financeFiles: [],
  264. auditFileId:undefined,
  265. auditFiles: [],
  266. qualifiedName: undefined,
  267. qualifiedStartTime: undefined,
  268. qualifiedEndTime: undefined,
  269. qualifiedFile: undefined,
  270. qualifiedFiles:[],
  271. },
  272. dialogFormVisible: false,
  273. dialogStatus: '',
  274. textMap: {
  275. update: "编辑",
  276. create: "创建",
  277. },
  278. rules: {
  279. supplierName: [{ required: true, message: "请填写供应商名称", trigger: "blur" }],
  280. typeId: [{ required: true, message: "请选择供应商类别", trigger: "blur" }],
  281. supplierPurchasAddress: [{ required: true, message: "请填写地域", trigger: "blur" }],
  282. registeredCapital: [
  283. { required: true, message: "请填写注册资本金", trigger: "blur" },
  284. {
  285. pattern: /^(([1-9]{1}\d{0,9})|(0{1}))(\.\d{1,2})?$/,
  286. message: "请输入合法的金额数字,最多两位小数",
  287. trigger: "blur"
  288. }
  289. ],
  290. bankCardNo: [{ required: true, message: "请填写银行卡号", trigger: "blur" }],
  291. bankCardName: [{ required: true, message: "请填写银行名称", trigger: "blur" }],
  292. nature: [{ required: true, message: "请选择纳税性质", trigger: "blur" }],
  293. taxrate: [{ required: true, message: "请选择税率", trigger: "blur" }],
  294. supplierContact: [{ required: true, message: "请填写联系人", trigger: "blur" }],
  295. supplierPhone: [{ required: true, message: "请填写联系电话", trigger: "blur" }],
  296. supplierAddress: [{ required: true, message: "请填写单位地址", trigger: "blur" }],
  297. responsibleDept: [{ required: true, message: "请选择申请部门", trigger: "blur" }],
  298. supplierRemark: [{ required: true, message: "请填写申请事由", trigger: "blur" }],
  299. businessName: [{ required: true, message: "请填写营业执照名称", trigger: "blur" }],
  300. businessStartTime: [{ required: true, message: "请选择开始日期", trigger: "blur" }],
  301. businessEndTime: [{ required: true, message: "请选择结束日期", trigger: "blur" }],
  302. businessFile: [{ required: true, message: "请上传营业执照", trigger: "blur" }],
  303. },
  304. dialogListVisible: false,
  305. fileImgUrl: this.upLoadUrl,
  306. }
  307. },
  308. created() {
  309. this.getListCategory();
  310. this.getTypeList();
  311. this.getList();
  312. },
  313. methods: {
  314. handleDownLoad(){
  315. window.location.href = process.env.BASE_API + '/product/export/category?supplierName=' + this.listQuery.supplierName + '&supplierNum=' + this.listQuery.supplierNum;
  316. },
  317. getListCategory() {
  318. listDept().then(response => {
  319. this.categoryOptions = this.handleTree(response.data.data, "deptId");
  320. });
  321. },
  322. /** 转换部门数据结构 */
  323. normalizer(node) {
  324. if (node.children && !node.children.length) {
  325. delete node.children;
  326. }
  327. return {
  328. id: node.deptId,
  329. label: node.deptName,
  330. children: node.children
  331. };
  332. },
  333. handleClick(tab, event) {
  334. console.log(tab, event);
  335. },
  336. handleRemoveFile(file, fileList, type) {
  337. console.log(file, fileList, type);
  338. if (type == "financeFiles") {
  339. let financeFiles = [];
  340. for (let i in fileList) {
  341. let id = fileList[i].response.data.id;
  342. financeFiles.push(id);
  343. }
  344. this.dataForm.financeFileId = financeFiles.join(",");
  345. }else{
  346. let auditFiles = [];
  347. for (let i in fileList) {
  348. let id = fileList[i].response.data.id;
  349. auditFiles.push(id);
  350. }
  351. this.dataForm.auditFileId = auditFiles.join(",");
  352. }
  353. },
  354. beforeUploadFile(file) {
  355. console.log(file);
  356. const size = file.size / 1024 / 1024;
  357. console.log(size);
  358. if (size > 10) {
  359. this.$message.error("文件大小不能超过10MB!");
  360. return false;
  361. }
  362. },
  363. handleFileSuccess(res, file, fileList, type) {
  364. console.log(res, file, fileList, type);
  365. if (type == "financeFiles") {
  366. let financeFiles = [];
  367. for (let i in fileList) {
  368. let response = fileList[i].response;
  369. if (response.errno && response.errno != "0") {
  370. this.$message.error("该文件上传失败,已被移除,请重新上传!");
  371. // 上传失败移除该 file 对象
  372. financeFiles.splice(i, 1);
  373. }
  374. else {
  375. let id = fileList[i].response.data.id;
  376. financeFiles.push(id);
  377. }
  378. }
  379. this.dataForm.financeFileId = financeFiles.join(",");
  380. }else{
  381. let auditFiles = [];
  382. for (let i in fileList) {
  383. let response = fileList[i].response;
  384. if (response.errno && response.errno != "0") {
  385. this.$message.error("该文件上传失败,已被移除,请重新上传!");
  386. // 上传失败移除该 file 对象
  387. auditFiles.splice(i, 1);
  388. }
  389. else {
  390. let id = fileList[i].response.data.id;
  391. auditFiles.push(id);
  392. }
  393. }
  394. this.dataForm.auditFileId = auditFiles.join(",");
  395. }
  396. },
  397. handleRemoveImg(file, fileList, type) {
  398. console.log(file, fileList, type);
  399. if (type == "qualifiedFiles") {
  400. let qualifiedFiles = [];
  401. for (let i in fileList) {
  402. let id = fileList[i].response.data.id;
  403. qualifiedFiles.push(id);
  404. }
  405. this.dataForm.qualifiedFile = qualifiedFiles.join(",");
  406. }else{
  407. let businessFiles = [];
  408. for (let i in fileList) {
  409. let id = fileList[i].response.data.id;
  410. businessFiles.push(id);
  411. }
  412. this.dataForm.businessFile = businessFiles.join(",");
  413. }
  414. },
  415. beforeUploadImg(file) {
  416. const isJPGs = file.type === "image/jpeg";
  417. console.log(isJPGs);
  418. },
  419. handleExceed(files, fileList) {
  420. this.$message.warning(
  421. `当前限制选择 1 个文件,本次选择了 ${files.length} 个文件!,共选择了 ${files.length + fileList.length
  422. } 个文件`
  423. );
  424. },
  425. handleImgSucess(res, file, fileList, type) {
  426. console.log(res, file, fileList, type);
  427. if (type == "qualifiedFiles") {
  428. let qualifiedFiles = [];
  429. for (let i in fileList) {
  430. let response = fileList[i].response;
  431. if (response.errno && response.errno != "0") {
  432. this.$message.error("该图片上传失败,已被移除,请重新上传!");
  433. // 上传失败移除该 file 对象
  434. fileList.splice(i, 1);
  435. } else {
  436. let id = fileList[i].response.data.id;
  437. qualifiedFiles.push(id);
  438. }
  439. }
  440. this.dataForm.qualifiedFile = qualifiedFiles.join(",");
  441. }else{
  442. let businessFiles = [];
  443. for (let i in fileList) {
  444. let response = fileList[i].response;
  445. if (response.errno && response.errno != "0") {
  446. this.$message.error("该图片上传失败,已被移除,请重新上传!");
  447. // 上传失败移除该 file 对象
  448. businessFiles.splice(i, 1);
  449. } else {
  450. let id = fileList[i].response.data.id;
  451. businessFiles.push(id);
  452. }
  453. }
  454. this.dataForm.businessFile = businessFiles.join(",");
  455. }
  456. },
  457. resetForm() {
  458. this.dataForm = {
  459. supplierName: undefined,
  460. supplierNum: undefined,
  461. supplierNum: undefined,
  462. typeId: undefined,
  463. supplierPurchasAddress: undefined,
  464. registeredCapital: undefined,
  465. bankCardNo: undefined,
  466. bankCardName: undefined,
  467. nature: undefined,
  468. taxrate: undefined,
  469. supplierContact: undefined,
  470. supplierPhone: undefined,
  471. supplierAddress: undefined,
  472. responsibleDept: undefined,
  473. supplierRemark: undefined,
  474. businessName: undefined,
  475. businessStartTime: undefined,
  476. businessEndTime: undefined,
  477. businessFile: undefined,
  478. businessFiles:[],
  479. financeFileId:undefined,
  480. financeFiles: [],
  481. auditFileId:undefined,
  482. auditFiles: [],
  483. qualifiedName: undefined,
  484. qualifiedStartTime: undefined,
  485. qualifiedEndTime: undefined,
  486. qualifiedFile: undefined,
  487. qualifiedFiles:[],
  488. };
  489. },
  490. handleAdd() {
  491. this.activeName = 'first';
  492. this.resetForm();
  493. this.dialogFormVisible = true;
  494. this.dialogStatus = "create";
  495. this.$nextTick(() => {
  496. this.$refs["dataForm"].clearValidate();
  497. });
  498. },
  499. createData() {
  500. this.$refs["dataForm"].validate((valid) => {
  501. if (valid) {
  502. console.log(this.dataForm);
  503. createSupplier(this.dataForm)
  504. .then((response) => {
  505. this.getList();
  506. this.dialogFormVisible = false;
  507. this.$notify({
  508. title: "成功",
  509. message: "创建成功",
  510. type: "success",
  511. duration: 2000,
  512. });
  513. this.reload();
  514. })
  515. .catch(() => { });
  516. }
  517. });
  518. },
  519. handleUpdate(row) {
  520. this.activeName = 'first';
  521. this.dataForm = Object.assign({}, row);
  522. if (this.dataForm.businessFiles) {
  523. let files = this.dataForm.businessFiles;
  524. this.dataForm.businessFiles = [];
  525. for (let i in files) {
  526. let url = files[i].url;
  527. let name = files[i].oldName;
  528. let id = files[i].id;
  529. this.dataForm.businessFiles.push({
  530. name: name,
  531. url: url,
  532. response: { error: "0", data: { url: url,id:id } },
  533. });
  534. }
  535. }
  536. if (this.dataForm.qualifiedFiles) {
  537. let files = this.dataForm.qualifiedFiles;
  538. this.dataForm.qualifiedFiles = [];
  539. for (let i in files) {
  540. let url = files[i].url;
  541. let name = files[i].oldName;
  542. let id = files[i].id;
  543. this.dataForm.qualifiedFiles.push({
  544. name: name,
  545. url: url,
  546. response: { error: "0", data: { url: url,id:id } },
  547. });
  548. }
  549. }
  550. if (this.dataForm.financeFiles) {
  551. let files = this.dataForm.financeFiles;
  552. this.dataForm.financeFiles = [];
  553. for (let i in files) {
  554. let url = files[i].url;
  555. let name = files[i].oldName;
  556. let id = files[i].id;
  557. this.dataForm.financeFiles.push({
  558. name: name,
  559. url: url,
  560. response: { error: "0", data: { url: url,id:id } },
  561. });
  562. }
  563. }
  564. if (this.dataForm.auditFiles) {
  565. let files = this.dataForm.auditFiles;
  566. this.dataForm.auditFiles = [];
  567. for (let i in files) {
  568. let url = files[i].url;
  569. let name = files[i].oldName;
  570. let id = files[i].id;
  571. this.dataForm.auditFiles.push({
  572. name: name,
  573. url: url,
  574. response: { error: "0", data: { url: url,id:id } },
  575. });
  576. }
  577. }
  578. this.dialogStatus = 'update'
  579. this.dialogFormVisible = true
  580. this.$nextTick(() => {
  581. this.$refs['dataForm'].clearValidate()
  582. })
  583. },
  584. updateData() {
  585. this.$refs['dataForm'].validate((valid) => {
  586. if (valid) {
  587. updateSupplier(this.dataForm).then(() => {
  588. this.dialogFormVisible = false
  589. this.$notify({
  590. title: '成功',
  591. message: '更新成功',
  592. type: 'success',
  593. duration: 2000
  594. })
  595. this.getList()
  596. })
  597. }
  598. })
  599. },
  600. handleDelete(row) {
  601. this.$confirm('确认删除吗?', '提示', {
  602. confirmButtonText: '确定',
  603. cancelButtonText: '取消',
  604. type: 'warning'
  605. }).then(() => {
  606. deleteSupplier({ id: row.id }).then(response => {
  607. this.$notify({
  608. title: '成功',
  609. message: '删除成功',
  610. type: 'success',
  611. duration: 2000
  612. })
  613. this.getList();
  614. })
  615. }).catch(() => {
  616. })
  617. },
  618. getTypeList() {
  619. // 获取供应商类别
  620. typeListSupplier().then(response => {
  621. this.brandOptions = response.data.data.map((item) => {
  622. return { value: item.typeId, label: item.typeName }
  623. });
  624. }).catch(() => {
  625. this.brandOptions = [];
  626. })
  627. },
  628. getList() {
  629. this.listLoading = true
  630. listSupplier(this.listQuery).then(response => {
  631. this.list = response.data.data.items
  632. this.total = response.data.data.total
  633. this.listLoading = false
  634. }).catch(() => { })
  635. },
  636. handleQuery() {
  637. this.listQuery.page = 1
  638. this.getList()
  639. },
  640. /** 重置按钮操作 */
  641. resetQuery() {
  642. this.listQuery = {
  643. page: 1,
  644. limit: 10,
  645. supplierName: '',
  646. supplierNum: '',
  647. typeId: '',
  648. responsibleDept: '',
  649. isEnable: '',
  650. };
  651. this.handleQuery();
  652. },
  653. handleSizeChange(val) {
  654. this.listQuery.limit = val
  655. this.getList()
  656. },
  657. handleCurrentChange(val) {
  658. this.listQuery.page = val
  659. this.getList()
  660. },
  661. }
  662. }
  663. </script>
  664. <style>
  665. .good-img {
  666. width: 50px;
  667. height: 50px;
  668. }
  669. .input-with-select .el-input-group__prepend {
  670. background-color: #fff;
  671. }
  672. </style>