358 lines
13 KiB
Vue
358 lines
13 KiB
Vue
|
|
<template>
|
|||
|
|
<div class="app-container">
|
|||
|
|
<el-row :gutter="10" class="mb8">
|
|||
|
|
<el-col :span="1.5">
|
|||
|
|
<el-button
|
|||
|
|
type="primary" size="mini"
|
|||
|
|
icon="el-icon-back" @click="backList"
|
|||
|
|
>取消</el-button>
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="1.5">
|
|||
|
|
<el-button
|
|||
|
|
type="warning" plain
|
|||
|
|
icon="el-icon-download" size="mini"
|
|||
|
|
>存草稿</el-button>
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="1.5">
|
|||
|
|
<el-button
|
|||
|
|
type="success"
|
|||
|
|
icon="el-icon-check"
|
|||
|
|
size="mini"
|
|||
|
|
>上架</el-button>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
|
|||
|
|
<el-form :model="formData" ref="formData" size="small" :inline="true" label-width="130px" style="margin-left: 40px;">
|
|||
|
|
<el-row :gutter="24" class="mb8">
|
|||
|
|
<el-form-item label="装备名称:" prop="equipmentName">
|
|||
|
|
<el-input
|
|||
|
|
v-model="formData.equipmentName"
|
|||
|
|
placeholder="请输入装备名称"
|
|||
|
|
clearable maxlength="20"
|
|||
|
|
style="width: 1100px;"
|
|||
|
|
/>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-row>
|
|||
|
|
<el-row :gutter="24" class="mb8">
|
|||
|
|
<el-form-item label="装备类目:" prop="typeId1">
|
|||
|
|
<el-select v-model="formData.typeId1"
|
|||
|
|
placeholder="一级分类" clearable>
|
|||
|
|
<el-option v-for="dict in equipmentTypeList"
|
|||
|
|
:key="dict.value"
|
|||
|
|
:label="dict.label"
|
|||
|
|
:value="dict.value"/>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="" prop="typeId2">
|
|||
|
|
<el-select v-model="formData.typeId2"
|
|||
|
|
placeholder="二级分类" clearable>
|
|||
|
|
<el-option v-for="dict in equipmentTypeList"
|
|||
|
|
:key="dict.value"
|
|||
|
|
:label="dict.label"
|
|||
|
|
:value="dict.value"/>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="" prop="typeId3">
|
|||
|
|
<el-select v-model="formData.typeId3"
|
|||
|
|
placeholder="三级分类" clearable>
|
|||
|
|
<el-option v-for="dict in equipmentTypeList"
|
|||
|
|
:key="dict.value"
|
|||
|
|
:label="dict.label"
|
|||
|
|
:value="dict.value"/>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="" prop="typeId4">
|
|||
|
|
<el-select v-model="formData.typeId4"
|
|||
|
|
placeholder="四级分类" clearable>
|
|||
|
|
<el-option v-for="dict in equipmentTypeList"
|
|||
|
|
:key="dict.value"
|
|||
|
|
:label="dict.label"
|
|||
|
|
:value="dict.value"/>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-row>
|
|||
|
|
<el-row :gutter="24" class="mb8">
|
|||
|
|
<el-form-item label="装备所在地:" prop="local1">
|
|||
|
|
<el-select v-model="formData.local1"
|
|||
|
|
placeholder="所在省份" clearable>
|
|||
|
|
<el-option v-for="dict in equipmentTypeList"
|
|||
|
|
:key="dict.value"
|
|||
|
|
:label="dict.label"
|
|||
|
|
:value="dict.value"/>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="" prop="local2">
|
|||
|
|
<el-select v-model="formData.local2"
|
|||
|
|
placeholder="所在市" clearable>
|
|||
|
|
<el-option v-for="dict in equipmentTypeList"
|
|||
|
|
:key="dict.value"
|
|||
|
|
:label="dict.label"
|
|||
|
|
:value="dict.value"/>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="" prop="local3">
|
|||
|
|
<el-select v-model="formData.local3"
|
|||
|
|
placeholder="所在县" clearable>
|
|||
|
|
<el-option v-for="dict in equipmentTypeList"
|
|||
|
|
:key="dict.value"
|
|||
|
|
:label="dict.label"
|
|||
|
|
:value="dict.value"/>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-row>
|
|||
|
|
<el-row :gutter="24" class="mb8">
|
|||
|
|
<el-col :span="10">
|
|||
|
|
<el-form-item label="装备编号:" prop="equipmentCode">
|
|||
|
|
<el-input
|
|||
|
|
v-model="formData.equipmentCode"
|
|||
|
|
placeholder="请输入装备编号"
|
|||
|
|
clearable maxlength="20"
|
|||
|
|
style="width: 400px;"
|
|||
|
|
/>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="10">
|
|||
|
|
<el-form-item label="装备品牌:" prop="equipmentBrand">
|
|||
|
|
<el-input
|
|||
|
|
v-model="formData.equipmentBrand"
|
|||
|
|
placeholder="请输入装备品牌"
|
|||
|
|
clearable maxlength="20"
|
|||
|
|
style="width: 400px;"
|
|||
|
|
/>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<el-row :gutter="24" class="mb8">
|
|||
|
|
<el-col :span="10">
|
|||
|
|
<el-form-item label="出厂日期:" prop="productionTime">
|
|||
|
|
<el-date-picker
|
|||
|
|
v-model="formData.productionTime"
|
|||
|
|
placeholder="请选择出厂日期"
|
|||
|
|
value-format="yyyy-MM-dd HH:mm:ss"
|
|||
|
|
type="datetime" style="width: 400px;">
|
|||
|
|
</el-date-picker>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="10">
|
|||
|
|
<el-form-item label="租赁价格(天/元):" prop="leasePrice">
|
|||
|
|
<el-input
|
|||
|
|
v-model="formData.leasePrice"
|
|||
|
|
placeholder="请输入租赁价格"
|
|||
|
|
clearable maxlength="20"
|
|||
|
|
style="width: 400px;"
|
|||
|
|
/>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<el-row :gutter="24" class="mb8">
|
|||
|
|
<el-col :span="10">
|
|||
|
|
<el-form-item label="联系人:" prop="userName">
|
|||
|
|
<el-input
|
|||
|
|
v-model="formData.userName"
|
|||
|
|
placeholder="请输入联系人"
|
|||
|
|
clearable maxlength="20"
|
|||
|
|
style="width: 400px;"
|
|||
|
|
/>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="10">
|
|||
|
|
<el-form-item label="联系电话:" prop="phone">
|
|||
|
|
<el-input
|
|||
|
|
v-model="formData.phone"
|
|||
|
|
placeholder="请输入联系电话"
|
|||
|
|
clearable maxlength="20"
|
|||
|
|
style="width: 400px;"
|
|||
|
|
/>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<el-row :gutter="24" class="mb8">
|
|||
|
|
<el-col :span="10">
|
|||
|
|
<el-form-item label="整机重量(KG):" prop="weight">
|
|||
|
|
<el-input
|
|||
|
|
v-model="formData.weight"
|
|||
|
|
placeholder="请输入整机重量"
|
|||
|
|
clearable maxlength="20"
|
|||
|
|
style="width: 400px;"
|
|||
|
|
/>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
|
|||
|
|
<el-row :gutter="24" class="mb8">
|
|||
|
|
<span style="color: #606266;font-size: 14px;font-weight: 600;margin-left: 20px;">添加描述:</span>
|
|||
|
|
<span style="color: rgb(255, 59, 48);font-size: 12px;margin-left: 10px;">注:添加不少于2个关于装备性能、外观等相关的描述,如档位、标定功率、规格等</span>
|
|||
|
|
</el-row>
|
|||
|
|
|
|||
|
|
<el-row :gutter="24" class="mb8">
|
|||
|
|
<el-col :span="10">
|
|||
|
|
<div v-for="(item,index) in describeList" :key="index">
|
|||
|
|
<el-input
|
|||
|
|
v-model="item.label"
|
|||
|
|
placeholder="描述名称"
|
|||
|
|
clearable maxlength="20"
|
|||
|
|
style="width: 120px;"
|
|||
|
|
/>
|
|||
|
|
<span>:</span>
|
|||
|
|
<el-input
|
|||
|
|
v-model="item.describe"
|
|||
|
|
placeholder="描述详情"
|
|||
|
|
clearable maxlength="20"
|
|||
|
|
style="width: 400px;"
|
|||
|
|
/>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
|
|||
|
|
|
|||
|
|
</el-form>
|
|||
|
|
|
|||
|
|
<!-- 图片查看弹窗 -->
|
|||
|
|
<el-dialog :visible.sync="dialogVisible" width="500px" height="500px">
|
|||
|
|
<img width="100%" height="500px" :src="dialogImageUrl" />
|
|||
|
|
</el-dialog>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import { getToken } from "@/utils/auth";
|
|||
|
|
export default {
|
|||
|
|
name: "",
|
|||
|
|
// dicts: ["purchase_task_status"],
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
Id:"",
|
|||
|
|
isView: false,
|
|||
|
|
equipmentTypeList: [], //下拉
|
|||
|
|
materialModelList: [], //规格型号下拉
|
|||
|
|
supplierList: [], //厂家下拉
|
|||
|
|
fixCodeList: ["否", "是"],
|
|||
|
|
formData: {
|
|||
|
|
typeId: undefined,
|
|||
|
|
supplierId: undefined,
|
|||
|
|
productionTime: undefined,
|
|||
|
|
},
|
|||
|
|
describeList:[
|
|||
|
|
{label:"",describe:""},{label:"",describe:""}
|
|||
|
|
],//描述
|
|||
|
|
//图片查看弹窗
|
|||
|
|
dialogImageUrl: "",
|
|||
|
|
dialogVisible: false,
|
|||
|
|
//上传
|
|||
|
|
upload: {
|
|||
|
|
// 设置上传的请求头部
|
|||
|
|
headers: { Authorization: "Bearer " + getToken() },
|
|||
|
|
// 上传的地址
|
|||
|
|
url: process.env.VUE_APP_BASE_API + "/file/upload",
|
|||
|
|
},
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
mounted() {
|
|||
|
|
// const Id = this.$route.query && this.$route.query.Id;
|
|||
|
|
// const isView = this.$route.query && this.$route.query.isView;
|
|||
|
|
// this.Id = Id;
|
|||
|
|
// if (isView == "true") {
|
|||
|
|
// this.isView = true;
|
|||
|
|
// } else {
|
|||
|
|
// this.isView = false;
|
|||
|
|
// }
|
|||
|
|
// this.resetForm("formData");
|
|||
|
|
// console.log(this.isView);
|
|||
|
|
// this.getSupplierList()
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
// 返回列表页
|
|||
|
|
backList() {
|
|||
|
|
const obj = { path: "/lessor/equipment" };
|
|||
|
|
this.$tab.closeOpenPage(obj);
|
|||
|
|
},
|
|||
|
|
// getDeviceType() {
|
|||
|
|
// getDeviceType({ level: 4, skipPermission: 1 }).then((response) => {
|
|||
|
|
// let matModelRes = response.data;
|
|||
|
|
// this.materialModelList = matModelRes.map((item) => {
|
|||
|
|
// return {
|
|||
|
|
// label: item.typeName,
|
|||
|
|
// value: item.typeId,
|
|||
|
|
// };
|
|||
|
|
// });
|
|||
|
|
// });
|
|||
|
|
// },
|
|||
|
|
// getSupplierList() {
|
|||
|
|
// getManufacturerSelect().then((response) => {
|
|||
|
|
// let arrRes = response.rows;
|
|||
|
|
// this.supplierList = arrRes.map((item) => {
|
|||
|
|
// return {
|
|||
|
|
// label: item.supplier,
|
|||
|
|
// value: item.supplierId,
|
|||
|
|
// };
|
|||
|
|
// });
|
|||
|
|
// });
|
|||
|
|
// },
|
|||
|
|
|
|||
|
|
//上传
|
|||
|
|
beforeFileUpload(row) {
|
|||
|
|
this.rowData.fileType = row.fileType;
|
|||
|
|
},
|
|||
|
|
// 文件上传成功处理
|
|||
|
|
handleFileSuccess(response, file, fileList) {
|
|||
|
|
if (response.code == 200) {
|
|||
|
|
let param = {
|
|||
|
|
taskId: this.taskId,
|
|||
|
|
taskType: "0",
|
|||
|
|
name: response.data.name,
|
|||
|
|
url: response.data.url,
|
|||
|
|
modelId: this.rowData.typeId,
|
|||
|
|
fileType: this.rowData.fileType,
|
|||
|
|
};
|
|||
|
|
console.log(param);
|
|||
|
|
uploadPurchaseFile(param)
|
|||
|
|
.then((response) => {
|
|||
|
|
this.$modal.msgSuccess("上传成功");
|
|||
|
|
this.getFileData();
|
|||
|
|
})
|
|||
|
|
.catch(() => {
|
|||
|
|
this.$modal.msgError("上传失败");
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//查看
|
|||
|
|
picturePreview(file) {
|
|||
|
|
this.dialogImageUrl = file.url;
|
|||
|
|
const parts = file.name.split(".");
|
|||
|
|
const extension = parts.pop();
|
|||
|
|
if (extension === "doc" || extension === "docx" || extension === "pdf") {
|
|||
|
|
const windowName = file.name;
|
|||
|
|
window.open(file.url, windowName);
|
|||
|
|
} else {
|
|||
|
|
this.dialogVisible = true;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
};
|
|||
|
|
</script>
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.uploadImg {
|
|||
|
|
padding-top: 20px;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
}
|
|||
|
|
.deviceCode {
|
|||
|
|
margin-top: 10px;
|
|||
|
|
padding-bottom: 20px;
|
|||
|
|
font-size: 18px;
|
|||
|
|
}
|
|||
|
|
::v-deep.el-table .fixed-width .el-button--mini {
|
|||
|
|
width: 60px !important;
|
|||
|
|
margin-bottom: 10px;
|
|||
|
|
}
|
|||
|
|
//隐藏图片上传框的css
|
|||
|
|
::v-deep.disabled {
|
|||
|
|
.el-upload--picture-card {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|