| | |
| | | <template> |
| | | <div> |
| | | 满意度调查 |
| | | <div class="content-main survey"> |
| | | <div class="top-bar"> |
| | | <el-form ref="form" style="width: 1000px;" :inline="true"> |
| | | <!-- <el-input v-model="input" class="input-form" placeholder="请直接输入样式编号/样品名称/型号规格/进行搜索或下拉选择进行组合查询" |
| | | @keyup.enter.native="getData" /> --> |
| | | <el-form-item style="width: 800px;"> |
| | | <el-col style="display: flex; justify-content: space-around;" :span="8"> |
| | | <el-row>调查日期:</el-row> |
| | | <el-row><el-input type="date" style="width: 130px;" v-model="materialCode" placeholder="请选择调查日期"></el-input></el-row> |
| | | </el-col> |
| | | <el-col style="display: flex; justify-content: space-around;" :span="8"> |
| | | <el-row>录入日期:</el-row> |
| | | <el-row><el-input style="width: 130px;" v-model="materialName" placeholder="请选择录入日期"></el-input></el-row> |
| | | </el-col> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" size="small" @click="getData()">查询</el-button> |
| | | <el-button type="primary" size="small" plain @click="resetData()">清空</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | <el-form> |
| | | <el-button size="40" icon="el-icon-document-add" type="primary">新增记录</el-button> |
| | | </el-form> |
| | | </div> |
| | | <div class="library-table"> |
| | | <div class="table-box"> |
| | | <el-table ref="tableData" :max-height="800" :cell-style="{ textAlign: 'center' }" |
| | | :header-cell-style="{ border: '0px', background: '#f5f7fa', color: '#606266', boxShadow: 'inset 0 1px 0 #ebeef5', textAlign: 'center' }" |
| | | :data="tableData" style="width: 100%"> |
| | | <el-table-column type="selection" label="" min-width="5%" /> |
| | | <el-table-column label="样品编号" min-width="10%"> |
| | | <template slot-scope="scope"> |
| | | <a style="color: #3894d1;">{{ scope.row.materialCode }}</a> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="materialName" label="样品名称" min-width="10%" /> |
| | | <el-table-column label="申请单号" min-width="10%" > |
| | | <template slot-scope="scope"> |
| | | <a style="color: #3894d1;">{{ scope.row.inspectionCode }}</a> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="createTime" label="登记日期" min-width="10%" /> |
| | | <el-table-column prop="testManager" label="检验负责人" min-width="10%" /> |
| | | <el-table-column prop="specifications" label="规格型号" min-width="10%" /> |
| | | <el-table-column prop="inspectionStatus" label="结论" min-width="10%"> |
| | | <template slot-scope="scope"> |
| | | <el-tag type="danger">不合格</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" min-width="8%"> |
| | | <template slot-scope="scope"> |
| | | <el-button type="text" size="small">操作</el-button> |
| | | <el-button type="text" size="small">作废</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <!-- 分页器 --> |
| | | <div> |
| | | <el-pagination :current-page="page" :page-sizes="[10, 20, 30, 40]" :page-size="pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange" /> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | </template> |
| | | |
| | | <script> |
| | | import { get, post } from '@/api/util/requestUtil'; |
| | | import urlInfo from '../../../api/urlEnum/nonConformanceReview.js' |
| | | export default { |
| | | data() { |
| | | return { |
| | | input: '', |
| | | tableData: [], |
| | | page: 1, |
| | | total: 0, |
| | | pageSize: 10, |
| | | materialCode: null, |
| | | materialName: null, |
| | | inspectionCode: null |
| | | } |
| | | }, |
| | | created() { |
| | | |
| | | }, |
| | | mounted() { |
| | | this.getData() |
| | | }, |
| | | methods: { |
| | | handleCurrentChange() { |
| | | this.getData(); |
| | | }, |
| | | handleSizeChange() { |
| | | |
| | | }, |
| | | exportData() { |
| | | |
| | | }, |
| | | // 重置按钮 |
| | | resetData() { |
| | | this.page = 1 |
| | | this.pageSize = 10 |
| | | this.materialCode=null |
| | | this.materialName=null |
| | | this.inspectionCode=null |
| | | this.getData() |
| | | }, |
| | | async getData() { |
| | | let param = { |
| | | "currentPage": this.page, |
| | | 'pageNum': this.pageSize, |
| | | "inspectionCode": this.inspectionCode, |
| | | "materialCode": this.materialCode, |
| | | "materialName": this.materialName |
| | | } |
| | | let res = await get(urlInfo.url.getNonConformanceReview, param) |
| | | this.tableData = res.data.nonConformanceReviewList |
| | | this.total = res.data.total |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .top-bar { |
| | | margin: -25px -15px; |
| | | background: #fff; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | padding: 5px 24px 0px 24px; |
| | | |
| | | .input-form { |
| | | width: 800px; |
| | | } |
| | | |
| | | .el-dropdown-link { |
| | | cursor: pointer; |
| | | color: #409EFF !important; |
| | | } |
| | | |
| | | .el-icon-arrow-down { |
| | | font-size: 12px !important; |
| | | } |
| | | |
| | | |
| | | } |
| | | |
| | | .library-table { |
| | | background-color: #fff; |
| | | flex: 1; |
| | | margin: 0px -15px; |
| | | margin-top: 40px; |
| | | display: flex; |
| | | flex-direction: column; |
| | | |
| | | .table-header { |
| | | padding: 20px; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | |
| | | .el-form-item { |
| | | margin-bottom: 30px !important; |
| | | } |
| | | } |
| | | |
| | | .table-box { |
| | | padding: 0px 20px; |
| | | margin-top: 20px; |
| | | flex: 1; |
| | | background: #fff; |
| | | display: flex; |
| | | flex-direction: column; |
| | | |
| | | >div:nth-child(2) { |
| | | display: flex; |
| | | justify-content: end; |
| | | margin: 10px 0; |
| | | } |
| | | |
| | | } |
| | | } |
| | | </style> |
| | | <style > |
| | | .content-main { |
| | | .el-form .el-form-item .el-form-item__content { |
| | | width: 100% !important; |
| | | } |
| | | } |
| | | </style> |