| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> |
| | | <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px"> |
| | | <el-form-item label="项目名称" prop="name"> |
| | | <el-input |
| | | v-model="queryParams.name" |
| | | placeholder="请输入项目名称" |
| | | clearable |
| | | @keyup.enter.native="handleQuery" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="公司名称" prop="companyName"> |
| | | <el-input |
| | | v-model="queryParams.companyName" |
| | | placeholder="请输入公司名称" |
| | | clearable |
| | | @keyup.enter.native="handleQuery" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="项目负责人" prop="createPerson"> |
| | | <el-input |
| | | v-model="queryParams.createPerson" |
| | | placeholder="请输入项目负责人" |
| | | clearable |
| | | @keyup.enter.native="handleQuery" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> |
| | | <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> |
| | |
| | | v-hasPermi="['system:projectName:export']" |
| | | >导出</el-button> |
| | | </el-col> |
| | | |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="warning" |
| | | plain |
| | | icon="el-icon-download" |
| | | size="mini" |
| | | @click="handleExportTemplate" |
| | | v-hasPermi="['system:category:export']" |
| | | >导入模板下载</el-button> |
| | | </el-col> |
| | | |
| | | <el-col :span="1.5"> |
| | | |
| | | <el-upload |
| | | action="" |
| | | |
| | | class="upload-demo" |
| | | :show-file-list="false" |
| | | :http-request="handleImport" |
| | | accept=".xlsx,.xls" |
| | | |
| | | > |
| | | <el-button size="mini" type="primary" |
| | | plain |
| | | icon="el-icon-top">导入</el-button> |
| | | |
| | | </el-upload> |
| | | </el-col> |
| | | <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> |
| | | </el-row> |
| | | |
| | |
| | | <el-table-column type="selection" width="55" align="center" /> |
| | | <!-- <el-table-column label="${comment}" align="center" prop="id" /> --> |
| | | <el-table-column label="项目名称" align="center" prop="name" /> |
| | | <el-table-column label="公司名称" align="center" prop="companyName" /> |
| | | <el-table-column label="项目负责人" align="center" prop="createPerson" /> |
| | | |
| | | <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | |
| | | <!-- 添加或修改【请填写功能名称】对话框 --> |
| | | <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body> |
| | | <el-form ref="form" :model="form" :rules="rules" label-width="80px"> |
| | | <el-form-item label="项目名称" prop="name"> |
| | | <el-input v-model="form.name" placeholder="请输入内容" /> |
| | | <el-form-item label="项目名称" prop="name" required> |
| | | <el-input v-model="form.name" placeholder="请输入内容" /> |
| | | </el-form-item> |
| | | <el-form-item label="公司名称" prop="companyName" required> |
| | | <el-input v-model="form.companyName" placeholder="请输入公司名称" /> |
| | | </el-form-item> |
| | | <el-form-item label="项目负责人" prop="createPerson" required> |
| | | <el-input v-model="form.createPerson" placeholder="请输入项目负责人" /> |
| | | </el-form-item> |
| | | </el-form> |
| | | <div slot="footer" class="dialog-footer"> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { listName, getName, delName, addName, updateName } from "@/api/system/projectName" |
| | | import { listName, getName, enload,delName, addName, updateName } from "@/api/system/projectName" |
| | | |
| | | export default { |
| | | name: "Name", |
| | |
| | | queryParams: { |
| | | pageNum: 1, |
| | | pageSize: 10, |
| | | name: null |
| | | name: null, |
| | | companyName: null, |
| | | createPerson: null |
| | | }, |
| | | // 表单参数 |
| | | form: {}, |
| | | // 表单校验 |
| | | rules: { |
| | | name: [ |
| | | { required: true, message: '请输入项目名称', trigger: 'blur' } |
| | | ], |
| | | companyName: [ |
| | | { required: true, message: '请输入公司名称', trigger: 'blur' } |
| | | ], |
| | | createPerson: [ |
| | | { required: true, message: '请输入项目负责人', trigger: 'blur' } |
| | | ] |
| | | } |
| | | } |
| | | }, |
| | |
| | | this.loading = true |
| | | listName(this.queryParams).then(response => { |
| | | this.nameList = response.data.data |
| | | console.log(response.data.data) |
| | | this.total = response.data.total |
| | | this.loading = false |
| | | }) |
| | |
| | | reset() { |
| | | this.form = { |
| | | id: null, |
| | | name: null |
| | | name: null, |
| | | companyName: null, |
| | | createPerson: null |
| | | } |
| | | this.resetForm("form") |
| | | }, |
| | |
| | | this.form = response.data |
| | | console.log(response) |
| | | this.open = true |
| | | this.title = "修改项目名称" |
| | | this.title = "修改项目内容" |
| | | }) |
| | | }, |
| | | /** 提交按钮 */ |
| | |
| | | this.download('system/projectName/export', { |
| | | ...this.queryParams |
| | | }, `name_${new Date().getTime()}.xlsx`) |
| | | }, |
| | | /** 导入模板下载操作*/ |
| | | handleExportTemplate() |
| | | { |
| | | this.download('/system/projectName/model', { |
| | | |
| | | }, `projectName_${new Date().getTime()}.xlsx`) |
| | | }, |
| | | |
| | | /** 导入操作*/ |
| | | async handleImport({file}){ |
| | | // 检查文件类型是否为xlsx |
| | | // if (!params.file.name.endsWith('.xlsx')) { |
| | | // this.$message.error('请上传.xlsx格式的文件'); |
| | | // return; |
| | | // } |
| | | const formData = new FormData(); |
| | | formData.append('file', file); |
| | | console.log(file) |
| | | |
| | | // 显示加载中状态 |
| | | const loading = this.$loading({ |
| | | lock: true, |
| | | text: '上传中...', |
| | | spinner: 'el-icon-loading', |
| | | background: 'rgba(0, 0, 0, 0.7)' |
| | | }); |
| | | |
| | | enload(formData, { |
| | | headers: { |
| | | 'Content-Type': 'multipart/form-data' |
| | | } |
| | | }).then(response => { |
| | | loading.close(); |
| | | this.$message.success('导入成功'); |
| | | this.getList(); |
| | | }).catch(error => { |
| | | loading.close(); |
| | | this.$message.error('导入失败: ' + (error.message || '未知错误')); |
| | | }); |
| | | |
| | | } |
| | | } |
| | | } |