java_project
/
mangaer_page
4
0
Fork 0
Code Issues Pull Requests Activity
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.
10 Commits
2 Branches
0 Tags
27 KiB
 
 
 
 
 
Tree: 9656182c9d
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '9656182c9d'
${ noResults }
mangaer_page/src/views/basic/pda/basicPda.vue

490 lines
17 KiB
Raw Blame History

<template>
<basic-container>
<div class="avue-crud">
<el-row :hidden="!search" style="padding:5px">
<!-- 查询模块 -->
<el-form :inline="true" :size="option.size" :model="query">
<template>
<el-form-item label="产品名称">
<el-input v-model="query.name" placeholder="请输入产品名称"></el-input>
</el-form-item>
<el-form-item label="型号">
<el-input v-model="query.model" placeholder="请输入型号"></el-input>
</el-form-item>
<el-form-item label="序列号">
<el-input v-model="query.deviceSerialNumber" placeholder="请输入设备序列号S/N"></el-input>
</el-form-item>
<el-form-item label="状态">
<el-select v-model="query.state" clearable placeholder="请选择设备当前状态" >
<el-option
v-for="item in stateData"
:key="item.dictKey"
:label="item.dictValue"
:value="item.dictKey">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="当前使用仓">
<el-select v-model="query.currentUsageWarehouse" placeholder="请选择当前使用仓"></el-select>
</el-form-item>
<!-- <el-form-item label="使用人">-->
<!-- <el-input v-model="query.user" placeholder="请输入使用人"></el-input>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="字段">-->
<!-- <el-input v-model="query.userPositionId" placeholder="请输入使用人岗位id"></el-input>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="字段">-->
<!-- <el-input v-model="query.isDeposit" placeholder="请输入是否收取押金;1-没有,2-有"></el-input>-->
<!-- </el-form-item>-->
</template>
<!-- 查询按钮 -->
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="searchChange">搜索</el-button>
<el-button icon="el-icon-delete" @click="searchReset()">清空</el-button>
</el-form-item>
</el-form>
</el-row>
<el-row>
<div class="avue-crud__menu">
<!-- 头部左侧按钮模块 -->
<div class="avue-crud__left">
<el-button :size="option.size" type="primary" icon="el-icon-plus" @click="handleAdd">新增</el-button>
<el-button :size="option.size" type="danger" icon="el-icon-delete" @click="handleDelete" plain>删除
</el-button>
</div>
<!-- 头部右侧按钮模块 -->
<div class="avue-crud__right">
<el-button :size="option.size" icon="el-icon-refresh" @click="searchChange" circle></el-button>
<el-button :size="option.size" icon="el-icon-search" @click="searchHide" circle></el-button>
</div>
</div>
</el-row>
<el-row>
<!-- 列表模块 -->
<el-table ref="table" v-loading="loading" :size="option.size" @selection-change="selectionChange" :data="data"
style="width: 100%"
:border="option.border">
<el-table-column type="selection" v-if="option.selection" width="55" align="center"></el-table-column>
<el-table-column type="expand" v-if="option.expand" align="center"></el-table-column>
<el-table-column v-if="option.index" label="序号" type="index" width="50" align="center">
</el-table-column>
<template v-for="(item,index) in option.column">
<!-- table字段 -->
<el-table-column v-if="item.hide!==true"
:prop="item.prop"
:label="item.label"
:width="item.width"
:key="index">
</el-table-column>
</template>
<!-- 操作栏模块 -->
<el-table-column prop="menu" label="操作" :width="180" align="center">
<template slot-scope="{row}">
<el-button :size="option.size" type="text" icon="el-icon-view" @click="handleView(row)">查看</el-button>
<el-button :size="option.size" type="text" icon="el-icon-view" @click="handleViewrecords(row)">查看维修记录</el-button>
<el-button :size="option.size" type="text" icon="el-icon-edit" @click="handleEdit(row)">编辑</el-button>
<el-button :size="option.size" type="text" icon="el-icon-delete" @click="rowDel(row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-row>
<el-row>
<!-- 分页模块 -->
<el-pagination
align="right" background
@size-change="sizeChange"
@current-change="currentChange"
:current-page="page.currentPage"
:page-sizes="[10, 20, 30, 40, 50, 100]"
:page-size="page.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="page.total">
</el-pagination>
</el-row>
<!-- 表单模块 -->
<el-dialog :title="title" :visible.sync="box" width="50%" :before-close="beforeClose" append-to-body>
<el-form :disabled="view" :size="option.size" ref="form" :model="form" label-width="50px">
<!-- 表单字段 -->
<el-row>
<el-col :span="11">
<el-form-item label="产品名称" prop="name" label-width="80px">
<el-input v-model="form.name" placeholder="请输入产品名称:" size="mini"/>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="型号" prop="model" label-width="100px">
<el-input v-model="form.model" placeholder="请输入型号:" size="mini"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="序列号S/N" prop="deviceSerialNumber" label-width="80px">
<el-input v-model="form.deviceSerialNumber" placeholder="序列号S/N" size="mini"/>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="购买金额" prop="purchaseAmount" label-width="100px">
<el-input v-model="form.purchaseAmount" placeholder="请输入购买金额" size="mini"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="状态" prop="state" label-width="80px">
<el-select v-model="form.state" clearable placeholder="请选择设备当前状态" >
<el-option
v-for="item in stateData"
:key="item.dictKey"
:label="item.dictValue"
:value="item.dictKey">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="使用仓" prop="currentUsageWarehouse" label-width="100px">
<el-input v-model="form.currentUsageWarehouse" placeholder="请输入当前使用仓" size="mini"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="使用人" prop="user" label-width="80px">
<el-input v-model="form.user" placeholder="请输入使用人"/>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="使用人岗位" prop="userPosition" label-width="100px">
<el-input v-model="form.userPosition" placeholder="请选择使用人岗位"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="收取押金" prop="isDeposit" label-width="80px">
<el-select v-model="form.isDeposit" clearable placeholder="请选择是否收取押金">
<el-option
v-for="item in isDepositData"
:key="item.dictKey"
:label="item.dictValue"
:value="item.dictKey">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="押金金额" prop="deposit" label-width="100px">
<el-input v-model="form.deposit" placeholder="请输入押金金额,单位（元）"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="保修截止时间" prop="warrantyPeriodEndTime" label-width="80px">
<el-date-picker v-model="form.warrantyPeriodEndTime" type="date" value-format="yyyy-MM-dd" placeholder="请选择保修截止时间"></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="购买时间" prop="buyingTime" label-width="100px">
<el-date-picker v-model="form.buyingTime" type="date" value-format="yyyy-MM-dd" placeholder="请选择购买时间"></el-date-picker>
</el-form-item>
</el-col>
</el-row>
<!-- <el-form-item label="使用人岗位id" prop="userPositionId">-->
<!-- <el-input v-model="form.userPositionId" placeholder="请输入使用人岗位id"/>-->
<!-- </el-form-item>-->
<el-row>
<el-col :span="11">
<el-form-item label="采购公司" prop="purchasingCompany" label-width="80px">
<el-input v-model="form.purchasingCompany" placeholder="请输入采购公司"/>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="备注" prop="notes" label-width="100px">
<el-input v-model="form.notes" placeholder="请输入备注"/>
</el-form-item>
</el-col>
</el-row>
<!-- <el-form-item label="图片" prop="photo">-->
<!-- <el-input v-model="form.photo" placeholder="请输入图片"/>-->
<!-- </el-form-item>-->
</el-form>
<!-- 表单按钮 -->
<span v-if="!view" slot="footer" class="dialog-footer">
<el-button type="primary" icon="el-icon-circle-check" :size="option.size" @click="handleSubmit">提 交</el-button>
<el-button icon="el-icon-circle-close" :size="option.size" @click="box = false">取 消</el-button>
</span>
</el-dialog>
<!-- 查看维修记录 -->
<!-- <el-dialog :title="title" :visible.sync="recordbox" width="80%" :before-close="beforeClose" >-->
<!-- <el-table ref="table" :size="optionrecords.size" @selection-change="selectionChange" :data="datarecords"-->
<!-- style="width: 100%"-->
<!-- :border="optionrecords.border">-->
<!-- <el-table-column v-if="optionrecords.index" label="序号" type="index" width="50" align="center">-->
<!-- </el-table-column>-->
<!-- <template v-for="(item,index) in optionrecords.column">-->
<!-- &lt;!&ndash; table字段 &ndash;&gt;-->
<!-- <el-table-column v-if="item.hide!==true"-->
<!-- :prop="item.prop"-->
<!-- :label="item.label"-->
<!-- :width="item.width"-->
<!-- :key="index">-->
<!-- </el-table-column>-->
<!-- </template>-->
<!-- </el-table>-->
<!-- </el-dialog>-->
</div>
</basic-container>
</template>
<script>
import {getList, getDetail, add, update, remove} from "@/api/basic/basicdataPda";
import option from "@/option/basic/basicdataPda";
import optionrecords from "@/option/basic/basicPdarecords";
import {mapGetters} from "vuex";
import {getDictionaryBiz} from '@/api/system/dict'
export default {
data() {
return {
// 弹框标题
title: '',
// 是否展示弹框
box: false,
//是否显示维修记录
recordbox:false,
// 是否显示查询
search: true,
// 加载中
loading: true,
// 是否为查看模式
view: false,
// 查询信息
query: {},
// 分页信息
page: {
currentPage: 1,
pageSize: 10,
total: 40
},
// 表单数据
form: {},
// 选择行
selectionList: [],
//状态
stateData:[],
//是否收取押金
isDepositData:[],
// 表单配置
option: option,
// 表单配置
optionrecords: optionrecords,
// 表单列表
data: [],
datarecords: [],
}
},
mounted() {
this.init();
this.onLoad(this.page);
},
created() {
//查询字典
this.queryDictionary();
},
computed: {
...mapGetters(["permission"]),
ids() {
let ids = [];
this.selectionList.forEach(ele => {
ids.push(ele.id);
});
return ids.join(",");
}
},
methods: {
queryDictionary(){
getDictionaryBiz("yes_no").then(res=>{
this.isDepositData =res.data.data
})
getDictionaryBiz("basic_pad_state").then(res=>{
this.stateData =res.data.data
})
},
init() {
},
searchHide() {
this.search = !this.search;
},
searchChange() {
this.onLoad(this.page);
},
searchReset() {
this.query = {};
this.page.currentPage = 1;
this.onLoad(this.page);
},
handleSubmit() {
if (!this.form.id) {
add(this.form).then(() => {
this.box = false;
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
});
} else {
update(this.form).then(() => {
this.box = false;
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
})
}
},
handleAdd() {
this.title = '新增'
this.form = {}
this.box = true
},
handleEdit(row) {
this.title = '编辑'
this.box = true
getDetail(row.id).then(res => {
this.form = res.data.data;
});
},
handleView(row) {
this.title = '查看'
this.view = true;
this.box = true;
getDetail(row.id).then(res => {
this.form = res.data.data;
});
},
handleViewrecords(row) {
console.log("row.id>>>>>>>>>",row.id);
this.$router.push({
path: '/basic/pdarecords/basicPdarecords',
query: {
data:row.id
}
})
},
handleDelete() {
if (this.selectionList.length === 0) {
this.$message.warning("请选择至少一条数据");
return;
}
this.$confirm("确定将选择数据删除?", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
return remove(this.ids);
})
.then(() => {
this.selectionClear();
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
});
},
rowDel(row) {
this.$confirm("确定将选择数据删除?", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
return remove(row.id);
})
.then(() => {
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
});
},
beforeClose(done) {
done()
this.form = {};
this.view = false;
},
selectionChange(list) {
this.selectionList = list;
},
selectionClear() {
this.selectionList = [];
this.$refs.table.clearSelection();
},
currentChange(currentPage) {
this.page.currentPage = currentPage;
this.onLoad(this.page);
},
sizeChange(pageSize) {
this.page.pageSize = pageSize;
this.onLoad(this.page);
},
onLoad(page, params = {}) {
this.loading = true;
getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
const data = res.data.data;
// eslint-disable-next-line no-empty
for (let i = 0; i < data.records.length; i++) {
// eslint-disable-next-line no-empty
for (let j = 0; j < this.stateData.length; j++) {
// eslint-disable-next-line no-empty
if (data.records[i].state == this.stateData[j].dictKey){
data.records[i].state=this.stateData[j].dictValue;
}
}
}
this.page.total = data.total;
this.data = data.records;
this.loading = false;
this.selectionClear();
});
}
}
};
</script>
<style lang="scss" scoped>
.el-pagination {
margin-top: 20px;
}
</style>