You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

488 lines
16 KiB

3 years ago
3 years ago
3 years ago
  1. <template>
  2. <div class="mod-config">
  3. <el-form :inline="true" label-position="top" :model="searchData" @keyup.enter.native="getDataList()">
  4. <el-form-item :label="'工厂编码'">
  5. <el-input v-model="searchData.site" style="width: 120px"></el-input>
  6. </el-form-item>
  7. <el-form-item :label="'制造商编码'">
  8. <el-input v-model="searchData.manufacturerID" style="width: 120px"></el-input>
  9. </el-form-item>
  10. <el-form-item :label="'制造商名称'">
  11. <el-input v-model="searchData.manufacturerName" style="width: 120px"></el-input>
  12. </el-form-item>
  13. <el-form-item :label="'在用'">
  14. <el-select filterable v-model="searchData.active" style="width: 130px">
  15. <el-option label="全部" value=""></el-option>
  16. <el-option label="是" value="Y"></el-option>
  17. <el-option label="否" value="N"></el-option>
  18. </el-select>
  19. </el-form-item>
  20. <el-form-item :label="' '">
  21. <el-button @click="getDataList()">查询</el-button>
  22. <el-button type="primary" @click="addModal()">新增</el-button>
  23. <!-- <el-button type="danger" @click="deleteManufacturer()" :disabled="dataListSelections.length <= 0">批量删除</el-button>-->
  24. </el-form-item>
  25. </el-form>
  26. <el-table
  27. :height="height"
  28. :data="dataList"
  29. border
  30. v-loading="dataListLoading"
  31. style="width: 100%;">
  32. <!-- <el-table-column-->
  33. <!-- type="selection"-->
  34. <!-- header-align="center"-->
  35. <!-- align="center"-->
  36. <!-- width="50">-->
  37. <!-- </el-table-column>-->
  38. <el-table-column
  39. v-for="(item,index) in columnList" :key="index"
  40. :sortable="item.columnSortable"
  41. :prop="item.columnProp"
  42. :header-align="item.headerAlign"
  43. :show-overflow-tooltip="item.showOverflowTooltip"
  44. :align="item.align"
  45. :fixed="item.fixed==''?false:item.fixed"
  46. :min-width="item.columnWidth"
  47. :label="item.columnLabel">
  48. <template slot-scope="scope">
  49. <span v-if="!item.columnHidden"> {{ scope.row[item.columnProp] }}</span>
  50. <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]"
  51. style="width: 100px; height: 80px"/></span>
  52. </template>
  53. </el-table-column>
  54. <el-table-column
  55. fixed="right"
  56. header-align="center"
  57. align="center"
  58. width="100"
  59. label="操作">
  60. <template slot-scope="scope">
  61. <a type="text" size="small" @click="updateModal(scope.row)">修改</a>
  62. <a type="text" size="small" @click="deleteManufacturer(scope.row)">删除</a>
  63. </template>
  64. </el-table-column>
  65. </el-table>
  66. <el-pagination
  67. @size-change="sizeChangeHandle"
  68. @current-change="currentChangeHandle"
  69. :current-page="pageIndex"
  70. :page-sizes="[20, 50, 100, 1000]"
  71. :page-size="pageSize"
  72. :total="totalPage"
  73. layout="total, sizes, prev, pager, next, jumper">
  74. </el-pagination>
  75. <el-dialog title="制造商" :close-on-click-modal="false" v-drag :visible.sync="modalFlag" width="430px">
  76. <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: -5px;">
  77. <el-form-item label="制造商编码:">
  78. <el-input v-model="modalData.manufacturerID" :disabled="modalDisableFlag" style="width: 120px"></el-input>
  79. </el-form-item>
  80. <el-form-item label="制造商名称:">
  81. <el-input v-model="modalData.manufacturerName" style="width: 120px"></el-input>
  82. </el-form-item>
  83. <el-form-item label="是否在用:">
  84. <el-select filterable v-model="modalData.active" style="width: 120px">
  85. <el-option label="是" value="Y"></el-option>
  86. <el-option label="否" value="N"></el-option>
  87. </el-select>
  88. </el-form-item>
  89. </el-form>
  90. <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: 0px;">
  91. <el-form-item label="联系人:">
  92. <el-input v-model="modalData.contact" style="width: 120px"></el-input>
  93. </el-form-item>
  94. <el-form-item label="电话:">
  95. <el-input v-model="modalData.phone" style="width: 120px"></el-input>
  96. </el-form-item>
  97. <el-form-item label="邮箱:">
  98. <el-input v-model="modalData.email" style="width: 120px"></el-input>
  99. </el-form-item>
  100. </el-form>
  101. <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: 0px;">
  102. <el-form-item label="地址:">
  103. <el-input v-model="modalData.address" style="width: 375px"></el-input>
  104. </el-form-item>
  105. </el-form>
  106. <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: 0px;">
  107. <el-form-item label="备注:">
  108. <el-input v-model="modalData.remark" style="width: 375px"></el-input>
  109. </el-form-item>
  110. </el-form>
  111. <el-footer style="height:40px;margin-top: 10px;text-align:center">
  112. <el-button type="primary" @click="saveData()">保存</el-button>
  113. <el-button type="primary" @click="modalFlag = false">关闭</el-button>
  114. </el-footer>
  115. </el-dialog>
  116. </div>
  117. </template>
  118. <script>
  119. import {
  120. eamManufacturerSearch,
  121. eamManufacturerSave,
  122. eamManufacturerEdit,
  123. eamManufacturerDelete,
  124. } from "@/api/eam/eam.js"
  125. export default {
  126. data () {
  127. return {
  128. searchData: {
  129. site: this.$store.state.user.site,
  130. manufacturerID: '',
  131. manufacturerName: '',
  132. active: 'Y',
  133. page: 1,
  134. limit: 10,
  135. },
  136. height: 200,
  137. pageIndex: 1,
  138. pageSize: 100,
  139. totalPage: 0,
  140. dataList: [],
  141. dataListLoading: false,
  142. dataListSelections: [],
  143. modalFlag:false,
  144. modalDisableFlag:false,
  145. modalData:{
  146. flag:'',
  147. site: this.$store.state.user.site,
  148. manufacturerID:'',
  149. manufacturerName:'',
  150. active:'',
  151. contact:'',
  152. phone:'',
  153. address:'',
  154. email:'',
  155. remark:'',
  156. },
  157. departmentList:[],
  158. // 展示列集
  159. columnList: [
  160. {
  161. userId: this.$store.state.user.name,
  162. functionId: 101005,
  163. serialNumber: '101005TableSite',
  164. tableId: "101005Table",
  165. tableName: "common",
  166. columnProp: 'site',
  167. headerAlign: "center",
  168. align: "left",
  169. columnLabel: '工厂编码',
  170. columnHidden: false,
  171. columnImage: false,
  172. columnSortable: false,
  173. sortLv: 0,
  174. status: true,
  175. fixed: '',
  176. columnWidth: 80,
  177. },
  178. {
  179. userId: this.$store.state.user.name,
  180. functionId: 101005,
  181. serialNumber: '101005TableManufacturerID',
  182. tableId: "101005Table",
  183. tableName: "common",
  184. columnProp: 'manufacturerID',
  185. headerAlign: "center",
  186. align: "left",
  187. columnLabel: '制造商编码',
  188. columnHidden: false,
  189. columnImage: false,
  190. columnSortable: false,
  191. sortLv: 0,
  192. status: true,
  193. fixed: '',
  194. columnWidth: 120,
  195. },
  196. {
  197. userId: this.$store.state.user.name,
  198. functionId: 101005,
  199. serialNumber: '101005TableManufacturerName',
  200. tableId: "101005Table",
  201. tableName: "common",
  202. columnProp: 'manufacturerName',
  203. headerAlign: "center",
  204. align: "left",
  205. columnLabel: '制造商名称',
  206. columnHidden: false,
  207. columnImage: false,
  208. columnSortable: false,
  209. sortLv: 0,
  210. status: true,
  211. fixed: '',
  212. columnWidth: 140,
  213. },
  214. {
  215. userId: this.$store.state.user.name,
  216. functionId: 101005,
  217. serialNumber: '101005TableActive',
  218. tableId: "101005Table",
  219. tableName: "common",
  220. columnProp: 'active',
  221. headerAlign: "center",
  222. align: "left",
  223. columnLabel: '在用',
  224. columnHidden: false,
  225. columnImage: false,
  226. columnSortable: false,
  227. sortLv: 0,
  228. status: true,
  229. fixed: '',
  230. columnWidth: 40,
  231. },
  232. {
  233. userId: this.$store.state.user.name,
  234. functionId: 101005,
  235. serialNumber: '101005TableContact',
  236. tableId: "101005Table",
  237. tableName: "common",
  238. columnProp: 'contact',
  239. headerAlign: "center",
  240. align: "left",
  241. columnLabel: '联系人',
  242. columnHidden: false,
  243. columnImage: false,
  244. columnSortable: false,
  245. sortLv: 0,
  246. status: true,
  247. fixed: '',
  248. columnWidth: 60,
  249. },
  250. {
  251. userId: this.$store.state.user.name,
  252. functionId: 101005,
  253. serialNumber: '101005TablePhone',
  254. tableId: "101005Table",
  255. tableName: "common",
  256. columnProp: 'phone',
  257. headerAlign: "center",
  258. align: "left",
  259. columnLabel: '电话',
  260. columnHidden: false,
  261. columnImage: false,
  262. columnSortable: false,
  263. sortLv: 0,
  264. status: true,
  265. fixed: '',
  266. columnWidth: 100,
  267. },
  268. {
  269. userId: this.$store.state.user.name,
  270. functionId: 101005,
  271. serialNumber: '101005TableAddress',
  272. tableId: "101005Table",
  273. tableName: "common",
  274. columnProp: 'address',
  275. headerAlign: "center",
  276. align: "left",
  277. columnLabel: '地址',
  278. columnHidden: false,
  279. columnImage: false,
  280. columnSortable: false,
  281. sortLv: 0,
  282. status: true,
  283. fixed: '',
  284. columnWidth: 250,
  285. },
  286. {
  287. userId: this.$store.state.user.name,
  288. functionId: 101005,
  289. serialNumber: '101005TableEmail',
  290. tableId: "101005Table",
  291. tableName: "common",
  292. columnProp: 'email',
  293. headerAlign: "center",
  294. align: "left",
  295. columnLabel: '邮箱',
  296. columnHidden: false,
  297. columnImage: false,
  298. columnSortable: false,
  299. sortLv: 0,
  300. status: true,
  301. fixed: '',
  302. columnWidth: 100,
  303. },
  304. {
  305. userId: this.$store.state.user.name,
  306. functionId: 101005,
  307. serialNumber: '101005TableRemark',
  308. tableId: "101005Table",
  309. tableName: "common",
  310. columnProp: 'remark',
  311. headerAlign: "center",
  312. align: "left",
  313. columnLabel: '备注',
  314. columnHidden: false,
  315. columnImage: false,
  316. columnSortable: false,
  317. sortLv: 0,
  318. status: true,
  319. fixed: '',
  320. columnWidth: 150,
  321. },
  322. ],
  323. levelList:[],
  324. }
  325. },
  326. mounted () {
  327. this.$nextTick(() => {
  328. this.height = window.innerHeight - 210
  329. })
  330. },
  331. created () {
  332. this.getDataList()
  333. },
  334. methods: {
  335. // 获取数据列表
  336. getDataList () {
  337. this.searchData.limit = this.pageSize
  338. this.searchData.page = this.pageIndex
  339. eamManufacturerSearch(this.searchData).then(({data}) => {
  340. if (data.code == 0) {
  341. this.dataList = data.page.list
  342. this.pageIndex = data.page.currPage
  343. this.pageSize = data.page.pageSize
  344. this.totalPage = data.page.totalCount
  345. }
  346. this.dataListLoading = false
  347. })
  348. },
  349. // 每页数
  350. sizeChangeHandle (val) {
  351. this.pageSize = val
  352. this.pageIndex = 1
  353. this.getDataList()
  354. },
  355. // 当前页
  356. currentChangeHandle (val) {
  357. this.pageIndex = val
  358. this.getDataList()
  359. },
  360. // 多选
  361. selectionChangeHandle (val) {
  362. this.dataListSelections = val
  363. },
  364. addModal(){
  365. this.modalData={
  366. flag:'1',
  367. site: this.$store.state.user.site,
  368. manufacturerID:'',
  369. manufacturerName:'',
  370. active:'',
  371. contact:'',
  372. phone:'',
  373. address:'',
  374. email:'',
  375. remark:'',
  376. };
  377. this.modalDisableFlag=false;
  378. this.modalFlag=true;
  379. },
  380. updateModal(row){
  381. this.modalData={
  382. flag:'2',
  383. site: row.site,
  384. manufacturerID:row.manufacturerID,
  385. manufacturerName:row.manufacturerName,
  386. active:row.active,
  387. contact:row.contact,
  388. phone:row.phone,
  389. address:row.address,
  390. email:row.email,
  391. remark:row.remark,
  392. };
  393. this.modalDisableFlag=true;
  394. this.modalFlag=true;
  395. },
  396. // 删除
  397. deleteManufacturer (row) {
  398. this.$confirm(`是否删除这个制造商?`, '提示', {
  399. confirmButtonText: '确定',
  400. cancelButtonText: '取消',
  401. type: 'warning'
  402. }).then(() => {
  403. eamManufacturerDelete(row).then(({data}) => {
  404. if (data && data.code === '0') {
  405. this.getDataList()
  406. this.$message({
  407. message: '操作成功',
  408. type: 'success',
  409. duration: 1500,
  410. onClose: () => {
  411. }
  412. })
  413. } else {
  414. this.$alert(data.msg, '错误', {
  415. confirmButtonText: '确定'
  416. })
  417. }
  418. })
  419. }).catch(() => {
  420. })
  421. },
  422. saveData(){
  423. if (this.modalData.manufacturerID == '' || this.modalData.manufacturerID == null) {
  424. this.$alert('请输入制造商编码!', '错误', {
  425. confirmButtonText: '确定'
  426. })
  427. return false
  428. }
  429. if (this.modalData.manufacturerName == '' || this.modalData.manufacturerName == null) {
  430. this.$alert('请输入制造商名称!', '错误', {
  431. confirmButtonText: '确定'
  432. })
  433. return false
  434. }
  435. if (this.modalData.active == '' || this.modalData.active == null) {
  436. this.$alert('选择是否在用!', '错误', {
  437. confirmButtonText: '确定'
  438. })
  439. return false
  440. }
  441. if(this.modalData.flag=='1'){
  442. eamManufacturerSave(this.modalData).then(({data}) => {
  443. if (data && data.code === '0') {
  444. this.getDataList()
  445. this.modalFlag=false
  446. this.$message({
  447. message: '操作成功',
  448. type: 'success',
  449. duration: 1500,
  450. onClose: () => {
  451. }
  452. })
  453. } else {
  454. this.$alert(data.msg, '错误', {
  455. confirmButtonText: '确定'
  456. })
  457. }
  458. })
  459. }else {
  460. eamManufacturerEdit(this.modalData).then(({data}) => {
  461. if (data && data.code === '0') {
  462. this.getDataList()
  463. this.modalFlag=false
  464. this.$message({
  465. message: '操作成功',
  466. type: 'success',
  467. duration: 1500,
  468. onClose: () => {
  469. }
  470. })
  471. } else {
  472. this.$alert(data.msg, '错误', {
  473. confirmButtonText: '确定'
  474. })
  475. }
  476. })
  477. }
  478. },
  479. }
  480. }
  481. </script>