Commit dfec8cdb by zhaopanyu

zpy 10.27

parent b3218b57
<template>
<div class="app-container">
<el-form :model="queryForm" ref="queryForm" size="small" :inline="true">
<el-form-item label="仪器名称">
<el-input v-model="queryForm.instrumentName" style="width: 100%" placeholder="请输入" clearable></el-input>
</el-form-item>
<el-form-item label="仪器分类">
<treeselect v-model="queryForm.instrumentTypeId" :options="equiList" :normalizer="normalizer"
placeholder="选择分类编码" clearable style="width: 192px" noOptionsText="暂无数据" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="getList">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<!-- 操作按钮 -->
<el-row class="mb8" :gutter="8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleOption(0)">新增</el-button>
<el-button type="danger" plain icon="el-icon-delete" size="mini" @click="handleDelete()">批量删除</el-button>
</el-col>
</el-row>
<!-- 表格 -->
<el-table stripe :data="tableData" border style="width: 98%" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column align="center" type="index" label="序号" width="55" />
<el-table-column align="center" prop="instrumentName" label="仪器名称" />
<el-table-column align="center" prop="instrumentTypeName" label="仪器分类" />
<el-table-column align="center" prop="instrumentModel" label="仪器型号" />
<el-table-column align="center" prop="instrumentNum" label="仪器数量" />
<el-table-column align="center" fixed="right" label="操作">
<template slot-scope="{ row }">
<div>
<el-button type="text" size="small" @click="handleOption(2, row)">查看</el-button>
<el-button type="text" size="small" @click="handleOption(1, row)">编辑</el-button>
<el-button type="text" size="small" @click="handleDelete(row)">删除</el-button>
<el-button @click="handleOut(row)" type="text" size="small">出库</el-button>
<el-button @click="handleIn(row)" type="text" size="small">入库</el-button>
</div>
</template>
</el-table-column>
</el-table>
<!--仪器新增 弹窗 -->
<el-dialog title="详细信息" :visible.sync="dialogTableVisible" width="30%" show-close>
<el-form :model="form" ref="form" :rules="rules" size="small" label-width="108px">
<el-row>
<el-col :span="20">
<el-form-item label="仪器名称" prop="instrumentName">
<el-input v-model="form.instrumentName" placeholder="请输入" clearable
:disabled="nowType == 2 ? true : false"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="20">
<el-form-item label="仪器分类" prop="instrumentTypeName">
<treeselect v-model="form.instrumentTypeName" :options="equiList" :normalizer="normalizer"
placeholder="选择" clearable style="width: 100%" noOptionsText="暂无数据" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="20">
<el-form-item label="仪器型号" prop="instrumentModel">
<el-input v-model="form.instrumentModel" placeholder="请输入" clearable
:disabled="nowType == 2 ? true : false"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="20">
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入" type="textarea" clearable
:disabled="nowType == 2 ? true : false"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer">
<el-button type="primary" @click="submitparentForm">确定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<!-- 仪器库存修改弹窗 -->
<el-dialog title="仪器库存" :visible.sync="open" width="30%" show-close>
<el-form :model="form" ref="form" size="small" label-width="108px">
<el-row>
<el-col :span="20">
<el-form-item label="仪器名称">
<el-input v-model="postForm.instrumentName" :disabled="true"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="20">
<el-form-item label="旧库存数量">
<el-input v-model="postForm.instrumentNum" :disabled="true"> </el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="20">
<el-form-item label="变动类型">
<el-select v-model="postForm.variationType" clearable placeholder="请选择" :disabled="true">
<el-option v-for="dict in dict.type.variation_type" :key="dict.value" :label="dict.label"
:value="dict.value" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="20">
<el-form-item label="变动数量">
<el-input v-model="postForm.variationNum" @input="updateNewStockNum"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="20">
<el-form-item label="新库存数量">
<el-input v-model="postForm.newStockNum" :disabled="true"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="20">
<el-form-item label="备注">
<el-input v-model="postForm.remark" placeholder="请输入" type="textarea" clearable
:disabled="isEdit"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer">
<el-button type="primary" @click="submitInventory">确定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<!-- 分页 -->
<pagination v-show="total > 0" :total="total" :page.sync="queryForm.pageNum" :limit.sync="queryForm.pageSize"
@pagination="getList" />
</div>
</template>
<script>
import {
addInst,//新增仪器
editInst,//修改仪器
getListyq,//查看仪器列表
getInstxq,
deleteInst,
getListrk,
getInstrumentDetail
} from '@/api/smartSchool/InstrumentDrugAdministration/instrumentManagement'
import {
getList,//查看列表
} from '@/api/smartSchool/InstrumentDrugAdministration/instrumentClassification'
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
name: 'instrumentManagement',
components: { Treeselect },
dicts: ['variation_type'],
data() {
return {
queryForm: {
pageNum: 1,
pageSize: 10,
instrumentName: "",
instrumentTypeId: null,
},
//表格数据
tableData: [
],
isEdit: false,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
equiList: [],
// 列表
assetsList: [],
tablekc: [],
title: '',
// 弹窗
form: {
instrumentName: "",
instrumentTypeId: "",
instrumentTypeName: null,
instrumentModel: "",
instrumentNum: "",
remark: "",
},
postForm: {
instrumentId: "",
variationType: "",
oldStockNum: "",
newStockNum: "",
remark: "",
},
// 总计
total: 0,
rules: {
instrumentName: [
{ required: true, message: "仪器名称不能为空", trigger: "blur" }
],
instrumentTypeId: [
{ required: true, message: "仪器分类不能为空", trigger: "blur" }
],
instrumentTypeName: [
{ required: true, message: "仪器类名不能为空", trigger: "blur" }
],
instrumentModel: [
{ required: true, message: "仪器型号不能为空", trigger: "blur" }
],
instrumentNum: [
{ required: true, message: "仪器数量不能为空", trigger: "blur" }
],
remark: [
{ required: true, message: "备注不能为空", trigger: "blur" }
],
},
//仪器新增/修改弹窗
dialogTableVisible: false,
// 库存弹窗
open: false,
nowType: 0, // 0新增、1编辑、2查看
// 非单个禁用
single: true,
// 非多个禁用
multiple: true
}
},
created() {
this.getListequ();
this.getList();
},
methods: {
// 搜索
getList() {
this.loading = true
getListyq({ ...this.queryForm }).then(res => {
if (res.code == 200) {
this.total = res.total;
this.tableData = res.rows;
console.log(this.tableData);
this.loading = false
}
})
},
//查询表单数据
getListequ() {
this.loading = true;
getList(this.queryForm).then(response => {
this.equiList = this.handleTree(response.rows, "id", 'parentId', 'children');
console.log('this.tableData', this.tableData);
this.loading = false;
})
},
/** 转换分类编码数据结构 */
normalizer(node) {
console.log(node);
if (node.children && !node.children.length) {
delete node.children;
}
return {
id: node.id,
label: node.instrumentTypeName,
children: node.children
};
},
// 重置
resetQuery() {
this.queryForm = {
pageNum: 1,
pageSize: 10,
instrumentName: "",
instrumentTypeId: null,
},
this.getList();
},
// 0新增、1编辑、2查看
handleOption(type, item) {
this.collectionForm = {
id: '',
instrumentName: "",
instrumentTypeId: "",
instrumentTypeName: null,
instrumentModel: "",
instrumentNum: "",
remark: "",
}
this.nowType = type;
if (type != 0) {
const id = item.id;
getInstxq(id).then(res => {
if (res.code == 200) {
Object.keys(this.form).forEach(key => {
if (res.data[key]) {
this.$set(this.form, key, res.data[key]);
}
});
}
})
}
this.dialogTableVisible = true
},
// 计算新库存数量
updateNewStockNum() {
const variationNum = parseFloat(this.postForm.variationNum);
const instrumentNum = parseFloat(this.postForm.instrumentNum);
if (this.postForm.variationType === '2') {
// 入库操作,新库存等于旧库存加上变动数量
this.postForm.newStockNum = isNaN(variationNum) || isNaN(instrumentNum) ? 0 : variationNum + instrumentNum;
} else if (this.postForm.variationType === '1') {
// 出库操作,新库存等于旧库存减去变动数量
this.postForm.newStockNum = isNaN(variationNum) || isNaN(instrumentNum) ? 0 : instrumentNum - variationNum;
}
},
// 入库
handleIn(row) {
this.open = true;
const id = row.id;
getInstxq(id).then(res => {
if (res.code == 200) {
this.postForm = res.data;
this.postForm.variationType = '2';
this.loading = false;
this.isEdit = true;
// 初始化新库存数量
this.updateNewStockNum();
}
})
},
// 出库
handleOut(row) {
this.open = true;
const id = row.id;
getInstxq(id).then(res => {
if (res.code == 200) {
this.postForm = res.data;
console.log(this.postForm);
this.postForm.variationType = '1';
console.log(this.postForm);
this.loading = false
// 初始化新库存数量
this.updateNewStockNum();
}
})
},
// 入库/出库提交
submitInventory() {
if (!this.postForm.variationNum || isNaN(this.postForm.variationNum)) {
this.$message.error('请输入正确的变动数量!');
return;
}
const postData = {
instrumentId: this.postForm.id,
variationType: this.postForm.variationType,
oldStockNum: this.postForm.instrumentNum,
newStockNum: this.postForm.newStockNum,
remark: this.postForm.remark,
};
getInstrumentDetail(postData).then(res => {
if (res.code == 200) {
this.$message.success('操作成功!');
this.open = false;
this.getList();
} else {
this.$message.error(res.msg);
}
})
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id);
this.single = selection.length != 1;
this.multiple = !selection.length;
},
// 仪器确定
submitparentForm: function () {
const useId = this.form.useId
this.form.useName = useId == '' ? '' : this.equiList.find(item => item.userId == useId).userName
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
editInst(this.form).then(response => {
console.log('this.form', this.form);
this.$modal.msgSuccess("修改成功");
this.dialogTableVisible = false;
this.getList();
this.enuqLeader();
});
} else {
addInst(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.dialogTableVisible = false;
this.getList();
});
}
}
});
},
reset() {
// 这里需要重置对话框表单
this.form = {
id: null,
instrumentName: null,
instrumentTypeId: '',
instrumentTypeName: null,
instrumentModel: null,
instrumentNum: null,
remark: null,
};
},
//取消按钮
cancel() {
this.dialogTableVisible = false;
this.open = false;
this.reset();
},
//删除按钮操作
handleDelete(row) {
if (row) {
// 单个删除
this.$modal.confirm('是否确认删除选中数据?').then(() => {
this.$modal.loading('正在处理数据,请稍等...');
return deleteInst(row.id);
}).then(response => {
this.$modal.closeLoading();
this.$modal.msgSuccess("删除成功");
this.getList();
}).catch(error => {
this.$modal.closeLoading();
});
} else {
// 批量删除
if (!this.ids || this.ids.length === 0) {
this.$modal.warning("请选择要删除的数据");
return;
}
this.$modal.confirm('是否确认删除选中数据?').then(() => {
this.$modal.loading('正在处理数据,请稍等...');
const deletePromises = this.ids.map(id => deleteInst(id));
return Promise.all(deletePromises);
}).then(response => {
this.$modal.closeLoading();
this.$modal.msgSuccess("删除成功");
this.getList();
}).catch(error => {
this.$modal.closeLoading();
});
}
}
}
}
</script>
<style scoped></style>
...@@ -56,8 +56,8 @@ ...@@ -56,8 +56,8 @@
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="20"> <el-col :span="20">
<el-form-item label="仪器分类" prop="instrumentTypeName"> <el-form-item label="仪器分类" prop="instrumentTypeId">
<treeselect v-model="form.instrumentTypeName" :options="equiList" :normalizer="normalizer" <treeselect v-model="form.instrumentTypeId" :options="equiList" :normalizer="normalizer"
placeholder="选择" clearable style="width: 100%" noOptionsText="暂无数据" /> placeholder="选择" clearable style="width: 100%" noOptionsText="暂无数据" />
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -90,7 +90,7 @@ ...@@ -90,7 +90,7 @@
<!-- 仪器库存修改弹窗 --> <!-- 仪器库存修改弹窗 -->
<el-dialog title="仪器库存" :visible.sync="open" width="30%" show-close> <el-dialog title="仪器库存" :visible.sync="open" width="30%" show-close>
<el-form :model="form" ref="form" size="small" label-width="108px"> <el-form :model="postForm" ref="postForm" size="small" label-width="108px">
<el-row> <el-row>
<el-col :span="20"> <el-col :span="20">
<el-form-item label="仪器名称"> <el-form-item label="仪器名称">
...@@ -198,7 +198,7 @@ export default { ...@@ -198,7 +198,7 @@ export default {
// 弹窗 // 弹窗
form: { form: {
instrumentName: "", instrumentName: "",
instrumentTypeId: "", instrumentTypeId: null,
instrumentTypeName: null, instrumentTypeName: null,
instrumentModel: "", instrumentModel: "",
instrumentNum: "", instrumentNum: "",
...@@ -296,10 +296,10 @@ export default { ...@@ -296,10 +296,10 @@ export default {
// 0新增、1编辑、2查看 // 0新增、1编辑、2查看
handleOption(type, item) { handleOption(type, item) {
this.collectionForm = { this.form = {
id: '', id: '',
instrumentName: "", instrumentName: "",
instrumentTypeId: "", instrumentTypeId: null,
instrumentTypeName: null, instrumentTypeName: null,
instrumentModel: "", instrumentModel: "",
instrumentNum: "", instrumentNum: "",
...@@ -399,36 +399,40 @@ export default { ...@@ -399,36 +399,40 @@ export default {
}, },
// 仪器确定 // 仪器确定
submitparentForm: function () { submitparentForm: function () {
const useId = this.form.useId
this.form.useName = useId == '' ? '' : this.equiList.find(item => item.userId == useId).userName
this.$refs["form"].validate(valid => { this.$refs["form"].validate(valid => {
if (valid) { if (valid) {
if (this.form.id != null) { if (this.form.id != "") {
// 调用修改接口
editInst(this.form).then(response => { editInst(this.form).then(response => {
console.log('this.form', this.form); console.log('修改成功', response);
this.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess("修改成功");
this.dialogTableVisible = false; this.dialogTableVisible = false;
this.getList(); this.getList();
this.enuqLeader(); this.enuqLeader();
}).catch(error => {
}); });
} else { } else {
// 调用新增接口
addInst(this.form).then(response => { addInst(this.form).then(response => {
console.log('新增成功', response);
this.$modal.msgSuccess("新增成功"); this.$modal.msgSuccess("新增成功");
this.dialogTableVisible = false; this.dialogTableVisible = false;
this.getList(); this.getList();
}).catch(error => {
}); });
} }
} }
}); });
}, },
reset() { reset() {
// 这里需要重置对话框表单 // 这里需要重置对话框表单
this.form = { this.form = {
id: null, id: null,
instrumentName: null, instrumentName: null,
instrumentTypeId: '', instrumentTypeId: null,
instrumentTypeName: null, instrumentTypeName: null,
instrumentModel: null, instrumentModel: null,
instrumentNum: null, instrumentNum: null,
...@@ -454,7 +458,7 @@ export default { ...@@ -454,7 +458,7 @@ export default {
this.$modal.msgSuccess("删除成功"); this.$modal.msgSuccess("删除成功");
this.getList(); this.getList();
}).catch(error => { }).catch(error => {
this.$modal.closeLoading(); // this.$modal.closeLoading();
}); });
} else { } else {
// 批量删除 // 批量删除
......
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="100px">
<el-form-item label="比赛类型" prop="competitionType">
<el-select v-model="queryParams.competitionType" placeholder="请选择" clearable>
<el-option v-for="(item, index) in dict.type.competition_type" :key="index" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="比赛项目名称" prop="competitionName">
<el-input v-model="queryParams.competitionName" placeholder="请输入" clearable />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="getList">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleOption(0)">新增</el-button>
</el-col>
</el-row>
<el-table border v-loading="loading" :data="competitionData" stripe>
<el-table-column fixed="left" label="序号" type="index" width="55" align="center" />
<el-table-column label="学年" align="center" prop="schoolYear" />
<el-table-column label="参赛教师" align="center" prop="teacherName" />
<el-table-column label="参赛课题" align="center" prop="entrySubject" />
<el-table-column label="比赛项目名称" align="center" prop="competitionName" />
<el-table-column align="center" prop="competitionType" label="比赛类型">
<template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.competition_type, row.competitionType) }}</div>
</template>
</el-table-column>
<el-table-column label="比赛级别" align="center" prop="competitionLevel">
<template slot-scope="{ row }">
<div>{{ selectDictLabel(dict.type.competition_level, row.competitionLevel) }}</div>
</template>
</el-table-column>
<el-table-column label="证书照片" align="center">
<template slot-scope="scope">
<div>
<el-image v-for="(accessory, index) in scope.row.schoolAccessoryList" :key="index"
style="width: 100px; height: 100px" :src="accessory.accessoryUrl"
:preview-src-list="[accessory.accessoryUrl]"></el-image>
</div>
</template>
</el-table-column>
<el-table-column label="备注1" align="center" prop="remark1" />
<el-table-column label="备注2" align="center" prop="remark2" />
<el-table-column label="备注3" align="center" prop="remark3" />
<el-table-column fixed="right" label="操作" align="center" prop="orgname" width="150">
<template slot-scope="{ row }">
<el-button type="text" size="small" @click="handleOption(1, row)">编辑</el-button>
<el-button type="text" size="small" @click="handleOption(2, row)">查看</el-button>
<el-button type="text" size="small" @click="handleDelete(row.id)">删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination ref="pageBlock" v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" @pagination="getList" />
<!-- 新增、编辑、查看弹窗 -->
<el-dialog title="详细信息" :visible.sync="dialogVisible" width="50%">
<el-form :model="form" ref="form" size="small" label-width="108px" :disabled="isEdit" :rules="rules">
<el-row>
<el-col :span="10">
<el-form-item label="学年" prop="schoolYear">
<el-input v-model="form.schoolYear" placeholder="请输入" clearable
:disabled="nowType == 2 ? true : false"></el-input>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="参赛老师" prop="teacherId">
<el-select v-model="form.teacherId" placeholder="请选择" clearable style="width: 100%;"
:disabled="nowType == 2 ? true : false">
<el-option v-for="(item, index) in teacherList" :key="index" :label="item.userName"
:value="item.userId"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="10">
<el-form-item label="参赛课题" prop="entrySubject">
<el-input v-model="form.entrySubject" placeholder="请输入" clearable
:disabled="nowType == 2 ? true : false"></el-input>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="比赛项目名称" prop="competitionName">
<el-input v-model="form.competitionName" placeholder="请输入" clearable
:disabled="nowType == 2 ? true : false"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="10">
<el-form-item label="比赛类型" prop="competitionType">
<el-select v-model="form.competitionType" placeholder="请选择" clearable style="width: 100%;"
:disabled="nowType == 2 ? true : false">
<el-option v-for="dict in dict.type.competition_type" :key="dict.value" :label="dict.label"
:value="dict.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="比赛级别" prop="competitionLevel">
<el-select v-model="form.competitionLevel" placeholder="请选择" clearable style="width: 100%;"
:disabled="nowType == 2 ? true : false">
<el-option v-for="dict in dict.type.competition_level" :key="dict.value" :label="dict.label"
:value="dict.value" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="10">
<el-form-item prop="schoolAccessoryList" label="证书照片">
<el-upload v-loading="uploadLoading" class="avatar-uploader" action="#" accept="image/*"
:show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload"
:http-request="uploadImage">
<img v-for="item in form.schoolAccessoryList" :key="item.accessoryUrl" :src="item.accessoryUrl"
class="avatar" />
<i v-if="form.schoolAccessoryList.length === 0" class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="备注1">
<el-input v-model="form.remark1" placeholder="请输入" clearable
:disabled="nowType == 2 ? true : false"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="10">
<el-form-item label="备注2">
<el-input v-model="form.remark2" placeholder="请输入" clearable
:disabled="nowType == 2 ? true : false"></el-input>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="备注3">
<el-input v-model="form.remark3" placeholder="请输入" clearable
:disabled="nowType == 2 ? true : false"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<el-dialog ref="previewDialog" title="预览图片" :visible.sync="previewDialogVisible">
<el-image style="width: 100%; max-height: 80vh; object-fit: contain" :src="previewImageUrl"
fit="contain"></el-image>
</el-dialog>
</div>
</template>
<script>
import {
addCompetition,
updateCompetition,
getCompetition,
getCompetitionxq,
deleteCompetition,
getTeacher
} from '@/api/smartSchool/laboratoryManagement/laboratoryCompetition'
import ListImage from "@/components/ListImage";
import { uploadImage as commonUpload } from '@/api/common'
import picAvatar from '@/views/smartSchool/schoolManage/introduce/schoolInfo/profile/picAvatar'
export default {
dicts: ['competition_type', 'competition_type',
'competition_level'],
components: { picAvatar },
data() {
return {
//缩略图
srcList: [],
// 图片路径
imageUrl: undefined,
pev: process.env.VUE_APP_BASE_API,
queryParams: {
pageNum: 1,
pageSize: 10,
},
previewImageUrl: '',
//获取子组件传来的信息
pic: [],
isEdit: false,
nowType: 0, // 0新增、1修改、2查看
uploadLoading: false,
loading: false,
total: 0,
competitionData: [],
isMultiple: false, // table是否有选择
dialogTitle: '', //弹窗标题
dialogVisible: false,
nowOption: null,
uploadedFiles: [],
form: {
schoolYear: '',
teacherId: '',
teacherName: '',
entrySubject: '',
competitionName: '',
competitionType: '',
competitionLevel: '',
remark1: '',
remark2: '',
remark3: '',
schoolAccessoryList: [],
},
rules: {
schoolYear: [
{ required: true, message: "学年不能为空", trigger: "change" }
],
teacherName: [
{ required: true, message: "教师名称不能为空", trigger: "change" }
],
entrySubject: [
{ required: true, message: "参赛课题不能为空", trigger: "change" }
],
competitionType: [
{ required: true, message: "比赛类型不能为空", trigger: "change" }
],
competitionLevel: [
{ required: true, message: "比赛级别不能为空", trigger: "change" }
],
// schoolAccessoryList: [
// { required: true, message: "证书照片不能为空", trigger: "change" }
// ],
competitionName: [
{ required: true, message: "比赛项目名称不能为空", trigger: "change" }
],
},
previewDialogVisible: false,
teacherList: [],
nowType: 0, // 0新增、1编辑、2查看
}
},
watch: {
pic: {
handler(newValue, oldValue) {
console.log('watch----oldValue', oldValue)
console.log('watch----newValue', newValue)
this.isUploadPic = newValue[3]
}
}
},
mounted() {
this.getList();
this.getTeacher();
},
methods: {
handlePreview(url) {
this.previewImageUrl = url;
this.$refs.previewDialog.open();
},
//获取列表数据
getList() {
getCompetition(this.queryForm).then(response => {
this.competitionData = response.rows;
console.log('response', response);
this.total = response.total;
this.loading = false;
this.competitionData.forEach(item => {
if (item.schoolAccessoryList) {
item.previewUrls = [item.schoolAccessoryList.map(accessory => accessory.accessoryUrl)];
item.pictureUrl = item.schoolAccessoryList.map(accessory => accessory.accessoryUrl);
} else {
item.previewUrls = [];
item.pictureUrl = [];
}
});
});
},
//获取图片信息
getSchoolInfoPic(val) {
this.pic = val
},
// 移除图片
handleRemove() {
this.imageUrl = undefined
},
// 上传成功回调
handleAvatarSuccess(response, file) {
// 处理上传成功的逻辑
console.log(response, 'response');
console.log(file, 'file');
const accessoryUrl = response.data.url; // 假设响应中包含了图片的访问URL
const accessoryName = file.name; // 获取上传文件的名称
this.form.schoolAccessoryList.push({
accessoryUrl: accessoryUrl,
accessoryName: accessoryName
});
},
// 上传前格式和图片大小限制
beforeAvatarUpload(file) {
const type = file.type === 'image/jpeg' || 'image/jpg' || 'image/webp' || 'image/png'
const isLt2M = file.size / 1024 / 1024 < 2
if (!type) {
this.$message.error('图片格式不正确!(只能包含jpg,png,webp,JPEG)')
}
if (!isLt2M) {
this.$message.error('上传图片大小不能超过 2MB!')
}
return type && isLt2M
},
// 上传图片
uploadImage(file) {
const fileData = file.file
const formData = new FormData()
formData.append('file', fileData)
this.uploadLoading = true
commonUpload(formData)
.then(response => {
this.uploadLoading = false
this.$modal.msgSuccess('上传成功')
this.imageUrl = process.env.VUE_APP_BASE_API + response.url
// 添加以下代码将文件信息添加到 uploadedFiles 数组中
this.uploadedFiles.push({
accessoryUrl: process.env.VUE_APP_BASE_API + response.url,
accessoryName: fileData.name
})
})
.catch(error => {
this.uploadLoading = false
})
},
//重置
resetQuery() {
this.queryParams = {
pageNum: 1,
pageSize: 10,
competitionType: "",
competitionName: "",
},
this.getList();
},
//删除
handleDelete(row) {
this.$modal.confirm('是否确认删除选中数据?').then(() => {
this.$modal.loading('正在处理数据,请稍等...');
return deleteCompetition(row);
}).then(response => {
this.$modal.closeLoading();
this.$modal.msgSuccess("删除班级成功");
this.getList();
}).catch(error => {
this.$modal.closeLoading();
})
},
//编辑 0新增 1编辑 2查看
handleOption(type, row) {
this.imageUrl = '';
this.form = {
id: '',
schoolYear: '',
teacherId: '',
teacherName: '',
entrySubject: '',
competitionName: '',
competitionType: '',
competitionLevel: '',
remark1: '',
remark2: '',
remark3: '',
schoolAccessoryList: [],
}
this.nowType = type;
if (type != 0) {
const id = row.id
getCompetitionxq(id).then(response => {
if (response.code == 200) {
Object.keys(this.form).forEach(key => {
if (response.data[key]) {
this.$set(this.form, key, response.data[key]);
}
if (response.data.schoolAccessoryList && response.data.schoolAccessoryList.length > 0) {
this.imageUrls = response.data.schoolAccessoryList.map(item => item.accessoryUrl); // 将所有证书照片的地址赋值给 imageUrls
}
})
}
})
}
this.dialogVisible = true;
},
//查询老师
getTeacher() {
getTeacher().then(response => {
this.loading = false;
this.teacherList = response.data;
});
},
/** 提交按钮 */
submitForm: function () {
const teacherId = this.form.teacherId
this.form.teacherName = teacherId == '' ? '' : this.teacherList.find(item => item.userId == teacherId).userName
this.$refs['form'].validate(valid => {
if (valid) {
if (this.form.id != "") {
// 清空原有图片
this.form.schoolAccessoryList.splice(0);
for (let i = 0; i < this.uploadedFiles.length; i++) {
const file = this.uploadedFiles[i];
this.form.schoolAccessoryList.push({
accessoryUrl: file.accessoryUrl,
accessoryName: file.accessoryName
});
}
updateCompetition(this.form).then(({ code }) => {
if (code == 200) {
this.$modal.msgSuccess('修改成功')
this.dialogVisible = false
this.getList()
}
}).catch(() => {
this.$modal.msgError("修改失败");
});
} else {
// 清空原有图片
this.form.schoolAccessoryList = [];
for (let i = 0; i < this.uploadedFiles.length; i++) {
const file = this.uploadedFiles[i];
this.form.schoolAccessoryList.push({
accessoryUrl: file.accessoryUrl,
accessoryName: file.accessoryName
});
}
addCompetition(this.form).then(response => {
console.log(this.form, 'this.form');
this.$modal.msgSuccess('新增成功')
this.dialogVisible = false
this.getList()
}).catch(() => {
this.$modal.msgError("新增失败");
});
}
}
});
},
cancel() {
this.dialogVisible = false;
},
},
}
</script>
<style lang="scss" scoped></style>
...@@ -73,8 +73,8 @@ ...@@ -73,8 +73,8 @@
</el-col> </el-col>
<el-col :span="10"> <el-col :span="10">
<el-form-item label="参赛老师" prop="teacherId"> <el-form-item label="参赛老师" prop="teacherId">
<el-select v-model="form.teacherId" placeholder="请选择" clearable style="width: 100%;" <el-select v-model="form.teacherId
:disabled="nowType == 2 ? true : false"> " placeholder="请选择" clearable style="width: 100%;" :disabled="nowType == 2 ? true : false">
<el-option v-for="(item, index) in teacherList" :key="index" :label="item.userName" <el-option v-for="(item, index) in teacherList" :key="index" :label="item.userName"
:value="item.userId"></el-option> :value="item.userId"></el-option>
</el-select> </el-select>
...@@ -125,8 +125,8 @@ ...@@ -125,8 +125,8 @@
class="avatar" /> class="avatar" />
<i v-if="form.schoolAccessoryList.length === 0" class="el-icon-plus avatar-uploader-icon"></i> <i v-if="form.schoolAccessoryList.length === 0" class="el-icon-plus avatar-uploader-icon"></i>
</el-upload> </el-upload>
</el-form-item>
</el-form-item>
</el-col> </el-col>
<el-col :span="10"> <el-col :span="10">
<el-form-item label="备注1"> <el-form-item label="备注1">
...@@ -386,26 +386,35 @@ export default { ...@@ -386,26 +386,35 @@ export default {
remark2: '', remark2: '',
remark3: '', remark3: '',
schoolAccessoryList: [], schoolAccessoryList: [],
} };
this.nowType = type; this.nowType = type;
if (type != 0) { if (type != 0) {
const id = row.id const id = row.id;
getCompetitionxq(id).then(response => { getCompetitionxq(id).then(response => {
console.log(response.data, 'chakan');
if (response.code == 200) { if (response.code == 200) {
Object.keys(this.form).forEach(key => { Object.keys(this.form).forEach(key => {
if (response.data[key]) { if (response.data[key]) {
this.$set(this.form, key, response.data[key]); this.$set(this.form, key, response.data[key]);
const teacherId = this.form.teacherId
this.form.teacherName = teacherId == '' ? '' : this.teacherList.find(item => item.userId == teacherId).userName
console.log(this.form.teacherName, 'this.form.teacherName');
} }
if (response.data.schoolAccessoryList && response.data.schoolAccessoryList.length > 0) { if (response.data.schoolAccessoryList && response.data.schoolAccessoryList.length > 0) {
this.imageUrls = response.data.schoolAccessoryList.map(item => item.accessoryUrl); // 将所有证书照片的地址赋值给 imageUrls this.imageUrls = response.data.schoolAccessoryList.map(item => item.accessoryUrl);
} }
}) });
} }
}) });
} }
this.dialogVisible = true; this.dialogVisible = true;
}, },
//查询老师 //查询老师
getTeacher() { getTeacher() {
getTeacher().then(response => { getTeacher().then(response => {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment