moldList.vue 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460
  1. <template>
  2. <section>
  3. <!--工具条-->
  4. <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
  5. <el-form :inline="true" :model="filters">
  6. <el-col :span="3">
  7. <el-form-item>
  8. <el-select v-model="filters.projectId" clearable placeholder="请选择项目">
  9. <el-option v-for="item in projects" :key="item.id" :label="item.projectName" :value="item.id"></el-option>
  10. </el-select>
  11. </el-form-item>
  12. </el-col>
  13. <el-col :span="2">
  14. <el-form-item>
  15. <el-select v-model="filters.searchType" placeholder="请选择查询条件">
  16. <el-option label="编号" value="0"></el-option>
  17. <el-option label="名称" value="1"></el-option>
  18. </el-select>
  19. </el-form-item>
  20. </el-col>
  21. <el-form-item>
  22. <el-input v-model="filters.keyName" placeholder="请输入编号或名称进行搜索"></el-input>
  23. </el-form-item>
  24. <el-form-item>
  25. <el-button type="primary" @click="getMoldList">查询</el-button>
  26. </el-form-item>
  27. <el-form-item style="float: right" v-if="user.parentId == 1 && user.subordinateType == 0">
  28. <el-button type="primary" @click="showAdd">新建</el-button>
  29. </el-form-item>
  30. </el-form>
  31. </el-col>
  32. <!--列表-->
  33. <el-table :data="molds" :height="tableHeight" highlight-current-row v-loading="listLoading" style="width: 100%;">
  34. <el-table-column type="index" width="40"></el-table-column>
  35. <el-table-column prop="modelName" label="模具名称" width="140" sortable>
  36. <template slot-scope="scope">
  37. <el-link :underline="false" type="primary" @click="toDetail(scope.row)">{{scope.row.modelName}}</el-link>
  38. </template>
  39. </el-table-column>
  40. <el-table-column prop="modelNo" label="模具编号" width="120" sortable></el-table-column>
  41. <el-table-column prop="equipmentNo" label="云模盒编号" width="180" sortable></el-table-column>
  42. <el-table-column prop="equipmentName" label="产品编号" width="180" sortable></el-table-column>
  43. <!-- <el-table-column prop="hillNumber" label="电量" align="center" width="100" sortable></el-table-column>
  44. <el-table-column prop="diffTime" label="倒计时" align="center" width="100" sortable></el-table-column> -->
  45. <el-table-column prop="projectName" label="所属项目" width="140" sortable></el-table-column>
  46. <el-table-column prop="companyName" label="所属资产方" width="300" sortable></el-table-column>
  47. <el-table-column prop="produceCompany" label="所属生产方" width="200" sortable></el-table-column>
  48. <el-table-column prop="initialModulus" label="初始模次" width="100" align="center" sortable></el-table-column>
  49. <el-table-column prop="settingLife" label="模次寿命" width="100" align="center" sortable></el-table-column>
  50. <el-table-column prop="holes" label="穴数" width="100" align="center" sortable></el-table-column>
  51. <el-table-column prop="rfid" label="对应RFID码" width="120" align="center" sortable></el-table-column>
  52. <el-table-column label="状态" width="100" align="center" sortable>
  53. <template slot-scope="scope">
  54. <span v-if="scope.row.state == 1" style="color:#00CD66;">运行</span>
  55. <span v-else style="color:#999999;">静止</span>
  56. </template>
  57. </el-table-column>
  58. <el-table-column label="操作" width="150" align="center" sortable v-if="user.parentId == 1 && user.subordinateType == 0">
  59. <template slot-scope="scope">
  60. <el-button size="small" type="danger" @click="handleDel(scope.row)">删除</el-button>
  61. </template>
  62. </el-table-column>
  63. </el-table>
  64. <!--工具条-->
  65. <el-col :span="24" class="toolbar">
  66. <el-pagination
  67. @size-change="handleSizeChange"
  68. @current-change="handleCurrentChange"
  69. :page-sizes="[20 , 50 , 80 , 100]"
  70. :page-size="20"
  71. layout="total, sizes, prev, pager, next"
  72. :total="total"
  73. style="float:right;"
  74. ></el-pagination>
  75. </el-col>
  76. <!--新增界面-->
  77. <el-dialog title="新建模具" v-if="addFormVisible" :visible.sync="addFormVisible" :close-on-click-modal="false" customClass="customWidth">
  78. <el-form :model="addForm" label-width="100px" :rules="formRules" ref="addForm" :inline="true" class="demo-form-inline">
  79. <el-form-item label="模具名称" prop="modelName">
  80. <el-input v-model="addForm.modelName" autocomplete="off" placeholder="请输入模具名称" style="width:202px"></el-input>
  81. </el-form-item>
  82. <el-form-item label="模具编号" prop="modelNo">
  83. <el-input v-model="addForm.modelNo" autocomplete="off" placeholder="请输入模具编号" style="width:202px"></el-input>
  84. </el-form-item>
  85. <el-form-item label="云模盒编号" prop="equipmentId">
  86. <el-select v-model="addForm.equipmentId" clearable filterable placeholder="请选择云模盒编号" style="width:202px">
  87. <el-option v-for="item in boxes" :key="item.id" :label="item.equipmentNo" :value="item.id"></el-option>
  88. </el-select>
  89. </el-form-item>
  90. <el-form-item label="初始模次" prop="initialModulus">
  91. <el-input v-model="addForm.initialModulus" autocomplete="off" placeholder="请输入初始模次" style="width:202px"></el-input>
  92. </el-form-item>
  93. <el-form-item label="模次寿命" prop="settingLife">
  94. <el-input v-model="addForm.settingLife" autocomplete="off" placeholder="请输入模次寿命" style="width:202px"></el-input>
  95. </el-form-item>
  96. <el-form-item label="RIFD码" prop="rfid">
  97. <el-input v-model="addForm.rfid" autocomplete="off" placeholder="请输入RIFD码" style="width:202px"></el-input>
  98. </el-form-item>
  99. <el-form-item label="穴数" prop="holes">
  100. <el-input v-model="addForm.holes" autocomplete="off" placeholder="请输入穴数" style="width:202px"></el-input>
  101. </el-form-item>
  102. <el-form-item label="所属生产方" prop="produceCompanyId">
  103. <el-select v-model="addForm.produceCompanyId" clearable filterable placeholder="请选择所属生产方" style="width:202px">
  104. <el-option v-for="item in companys" :key="item.id" :label="item.companyName" :value="item.id"></el-option>
  105. </el-select>
  106. </el-form-item>
  107. <el-form-item label="保养次数" prop="maintainCount">
  108. <el-select v-model="addForm.maintainCount" clearable multiple allow-create filterable default-first-option placeholder="请选择保养次数" style="width:515px">
  109. <el-option v-for="item in maintainCount" :key="item" :label="item" :value="item"></el-option>
  110. </el-select>
  111. </el-form-item>
  112. </el-form>
  113. <div slot="footer" class="dialog-footer">
  114. <el-button @click.native="addFormVisible = false">取消</el-button>
  115. <el-button type="primary" @click.native="addSubmit" :loading="addLoading">提交</el-button>
  116. </div>
  117. </el-dialog>
  118. </section>
  119. </template>
  120. <script>
  121. import util from "../../common/js/util";
  122. export default {
  123. data() {
  124. const checkInitialModulus = (rule, value, callback) => {
  125. if (!value) {
  126. return callback(new Error('请输入初始模次'));
  127. } else {
  128. if((/^[+]{0,1}(\d+)$|^[+]{0,1}(\d+\.\d+)$/).test(value) == false){
  129. callback(new Error("请填写大于0的数字"));
  130. }else{
  131. if (value > 100000000) {
  132. callback(new Error("请填写小于等于1亿的数字"));
  133. }else{
  134. callback();
  135. }
  136. }
  137. }
  138. };
  139. const checkSettingLife = (rule, value, callback) => {
  140. if (!value) {
  141. return callback(new Error('请输入模次寿命'));
  142. } else {
  143. if((/^[+]{0,1}(\d+)$|^[+]{0,1}(\d+\.\d+)$/).test(value) == false){
  144. callback(new Error("请填写大于0的数字"));
  145. }else{
  146. if (value > 100000000) {
  147. callback(new Error("请填写小于等于1亿的数字"));
  148. }else{
  149. callback();
  150. }
  151. }
  152. }
  153. };
  154. return {
  155. user: JSON.parse(sessionStorage.getItem("user")),
  156. molds: [],
  157. filters: {
  158. keyName: "",
  159. searchType: "编号",
  160. projectId: ""
  161. },
  162. team: [{label:'资产方',value:0},{label:'生产方',value:1}],
  163. formRules: {
  164. modelNo: [
  165. { required: true, message: "请输入模具编号", trigger: "blur" }
  166. ],
  167. modelName: [
  168. { required: true, message: "请输入模具名称", trigger: "blur" }
  169. ],
  170. equipmentId: [
  171. { required: true, message: "请选择云模盒编号", trigger: ["blur", "change"] }
  172. ],
  173. initialModulus: [
  174. // { required: true, message: "请输入初始模次", trigger: "blur" }
  175. { required: true, validator: checkInitialModulus, trigger: 'blur'}
  176. ],
  177. settingLife: [
  178. // { required: true, message: "请输入模次寿命", trigger: "blur" }
  179. { required: true, validator: checkSettingLife, trigger: 'blur'}
  180. ],
  181. rfid: [
  182. { required: true, message: "请输入RIFD码", trigger: "blur" }
  183. ],
  184. holes: [
  185. { required: true, message: "请输入穴数", trigger: "blur" }
  186. ],
  187. produceCompanyId: [
  188. { required: true, message: "请选择所属生产方", trigger: ["blur", "change"] }
  189. ],
  190. maintainCount: [
  191. { required: true, message: "请输入保养次数", trigger: ["blur", "change"] }
  192. ]
  193. },
  194. listLoading: false,
  195. total: 0,
  196. size: 20,
  197. tableHeight: 0,
  198. boxes: [],
  199. companys: [],
  200. projects: [],
  201. maintainCount: [5000,10000,15000,20000,25000],
  202. addLoading: false,
  203. addFormVisible: false,
  204. addForm: {
  205. modelNo: "",
  206. modelName: "",
  207. equipmentId: "",
  208. initialModulus: "",
  209. settingLife: "",
  210. maintainCount: [],
  211. rfid: "",
  212. holes: "",
  213. produceCompanyId: ""
  214. }
  215. };
  216. },
  217. methods: {
  218. //获取模具
  219. getMoulds(){
  220. this.http.post( this.port.base.moulds, {
  221. belongCompanyId: this.user.companyId
  222. },
  223. res => {
  224. if (res.code == "ok") {
  225. this.boxes = res.data;
  226. } else {
  227. this.$message({
  228. message: res.msg,
  229. type: "error"
  230. });
  231. }
  232. },
  233. error => {
  234. this.listLoading = false;
  235. this.$message({
  236. message: error,
  237. type: "error"
  238. });
  239. });
  240. },
  241. getMsg() {
  242. //获取模具
  243. this.getMoulds();
  244. //新版获取公司
  245. this.http.post(this.port.base.relationList, {
  246. companyType: 1
  247. }, res => {
  248. if (res.code == "ok") {
  249. this.companys = res.data;
  250. } else {
  251. this.$message({
  252. message: res.msg,
  253. type: 'error'
  254. });
  255. }
  256. }, error => {
  257. this.$message({
  258. message: error,
  259. type: 'error'
  260. });
  261. });
  262. },
  263. getPro() {
  264. //获取项目
  265. this.http.post( this.port.project.projects, {},
  266. res => {
  267. if (res.code == "ok") {
  268. this.projects = res.data;
  269. } else {
  270. this.$message({
  271. message: res.msg,
  272. type: "error"
  273. });
  274. }
  275. },
  276. error => {
  277. this.listLoading = false;
  278. this.$message({
  279. message: error,
  280. type: "error"
  281. });
  282. });
  283. },
  284. //分页
  285. handleCurrentChange(val) {
  286. this.page = val;
  287. this.getMoldList();
  288. },
  289. handleSizeChange(val) {
  290. this.size = val;
  291. this.getMoldList();
  292. },
  293. //获取模具列表
  294. getMoldList() {
  295. this.listLoading = true;
  296. this.http.post( this.port.mold.molds, {
  297. keyName: this.filters.keyName,
  298. pageNum: this.page,
  299. pageSize: this.size,
  300. projectId: this.filters.projectId == "" ? -1 : this.filters.projectId,
  301. searchType: this.filters.searchType == "编号"? 0:1
  302. },
  303. res => {
  304. this.listLoading = false;
  305. if (res.code == "ok") {
  306. var list = res.data.list
  307. for(var i in list){
  308. if(list[i].endTime == null){
  309. list[i].diffTime = "";
  310. } else {
  311. list[i].diffTime = util.formatDate.dateDiff(
  312. // util.formatDate.format(new Date(list[i].endTime), 'yyyy-MM-dd'),
  313. list[i].endTime,
  314. util.formatDate.format(new Date(new Date()), 'yyyy-MM-dd')
  315. );
  316. }
  317. }
  318. this.molds = list;
  319. this.total = res.data.total;
  320. } else {
  321. this.$message({
  322. message: res.msg,
  323. type: "error"
  324. });
  325. }
  326. },
  327. error => {
  328. this.listLoading = false;
  329. this.$message({
  330. message: error,
  331. type: "error"
  332. });
  333. });
  334. },
  335. //详情
  336. toDetail(row) {
  337. this.$router.push("/moldList/" + row.id + "/0");
  338. },
  339. //删除
  340. handleDel: function (row) {
  341. this.$confirm('确认删除该模具吗?', '提示', {
  342. type: 'warning'
  343. }).then(() => {
  344. this.http.post(this.port.mold.delMold, {
  345. id: row.id
  346. }, res => {
  347. if (res.code == "ok") {
  348. this.$message({
  349. message: '删除成功',
  350. type: 'success'
  351. });
  352. this.getMoldList();
  353. } else {
  354. this.$message({
  355. message: res.msg,
  356. type: 'error'
  357. });
  358. }
  359. }, error => {
  360. this.$message({
  361. message: error,
  362. type: 'error'
  363. });
  364. })
  365. });
  366. },
  367. //添加界面
  368. showAdd() {
  369. this.getMoulds();
  370. this.addFormVisible = true;
  371. this.addForm = {
  372. modelNo: "",
  373. modelName: "",
  374. equipmentId: "",
  375. initialModulus: "",
  376. settingLife: "",
  377. maintainCount: [],
  378. rfid: "",
  379. holes: "",
  380. produceCompanyId: ""
  381. };
  382. },
  383. addSubmit() {
  384. this.$refs.addForm.validate(valid => {
  385. if (valid) {
  386. this.addLoading = true;
  387. var maintainCount = this.addForm.maintainCount , str = "";
  388. for(var i in maintainCount) {
  389. if(i == maintainCount.length-1){
  390. str += maintainCount[i]
  391. } else {
  392. str += maintainCount[i] + ","
  393. }
  394. }
  395. this.addForm.maintainCount = str;
  396. this.http.post( this.port.mold.addMold, this.addForm,
  397. res => {
  398. this.addLoading = false;
  399. if (res.code == "ok") {
  400. this.addFormVisible = false;
  401. this.$message({
  402. message: "创建成功",
  403. type: "success"
  404. });
  405. this.getMoldList();
  406. } else {
  407. this.$message({
  408. message: res.msg,
  409. type: "error"
  410. });
  411. }
  412. },
  413. error => {
  414. this.addLoading = false;
  415. this.addFormVisible = false;
  416. this.$message({
  417. message: error,
  418. type: "error"
  419. });
  420. });
  421. }
  422. });
  423. },
  424. },
  425. created() {
  426. let height = window.innerHeight;
  427. this.tableHeight = height - 210;
  428. const that = this;
  429. window.onresize = function temp() {
  430. that.tableHeight = window.innerHeight - 210;
  431. };
  432. },
  433. mounted() {
  434. var user = JSON.parse(sessionStorage.getItem("user"));
  435. if(user.parentId == 1 && user.subordinateType == 0){
  436. this.getMsg();
  437. }
  438. this.getPro()
  439. this.getMoldList();
  440. }
  441. };
  442. </script>
  443. <style scoped>
  444. </style>