Merge remote-tracking branch 'origin/master'

value

2023-09-07 523d7a54fb07fdf756fbc4faa5eb7fef7263a556

 src/views/CNAS/nonConformanceManage/index.vue

@@ -1,5 +1,216 @@
<template>
    <div>
        不符合项管理
    <div class="content-main">
        <div class="top-bar">
            <el-form ref="form" :inline="true" :model="searchData" style="margin-top: 10px;">
              <el-form-item label="录入日期:" style="margin-right: 20px;">
                <el-date-picker
                    size="small"
                    v-model="searchData.entry_date"
                    type="date"
                    placeholder="请选择录入日期">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="审核日期:" style="margin-right: 20px;">
                <el-date-picker
                    size="small"
                    v-model="searchData.check_date"
                    type="date"
                    placeholder="请选择审核日期">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="状态:" style="margin-right: 20px;">
                <el-select size="small" v-model="searchData.state" placeholder="全部" style="width: 100px;">
                  <el-option
                    v-for="item in stateoptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="部门:" style="margin-right: 20px;">
                <el-input size="small" v-model="searchData.department" placeholder="请输入部门">
                </el-input>
              </el-form-item>
              <el-form-item>
                <el-button size="small" type="primary" @click="searchInspections">查询</el-button>
                <el-button size="small" type="primary" plain @click="reset">重置</el-button>
              </el-form-item>
            </el-form>
            <el-form class="rightBtn" style="margin-top: 10px;">
              <el-form-item class="createBtn">
                <el-button size="small" type="primary" icon="el-icon-document-add" style="margin-right: 10px;">新增记录</el-button>
              </el-form-item>
              <el-form-item class="getDataBtn">
                <el-button size="small" type="primary" icon="el-icon-download">导出</el-button>
              </el-form-item>
            </el-form>
        </div>
        <div class="library-table">
      <div class="table-header">
        <el-radio-group v-model="radioValue" @change="radioclick">
          <el-radio-button v-for="item in conditionsOptions" :key="item.value" :label="item.value">
            {{ item.label }}
          </el-radio-button>
        </el-radio-group>
      </div>
      <div class="table-box">
        <el-table
                ref="recordTable"
                :max-height="800"
                :cell-style="{textAlign: 'left'}"
                :header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'left'}"
                :data="recordTable"
                style="width: 100%"
              >
                <el-table-column
                  label="序号"
                  min-width="10%">
                  <template slot-scope="scope">
                    <el-checkbox v-model="checked"></el-checkbox>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="title"
                  label="标题"
                  min-width="12%"
                />
                <el-table-column
                  prop="content"
                  label="内容"
                  min-width="12%"
                />
                <el-table-column
                  prop="level"
                  label="等级"
                  min-width="12%"
                />
                <el-table-column
                  prop="type"
                  label="类型"
                  min-width="8%"
                />
                <el-table-column
                  prop="state"
                  label="状态"
                  min-width="12%">
                  <template slot-scope="scope">
                    <span v-if="scope.row.state === 1" style="color: red;">未读</span>
                    <span v-if="scope.row.state === 2" style="color: green;">已读</span>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="sender"
                  label="发件人"
                  min-width="8%"
                />
                <el-table-column
                  prop="create_time"
                  label="创建时间"
                  min-width="12%"
                />
                <el-table-column
                  label="操作"
                  min-width="10%"
                >
                  <template slot-scope="scope">
                    <el-button type="text" size="small" @click="deleteRow(scope.row)">删除</el-button>
                    <el-button type="text" size="small" @click="readRow(scope.row)">标为已读</el-button>
                  </template>
                </el-table-column>
              </el-table>
              <!-- 分页器 -->
              <div>
                <el-pagination
                  @size-change="handleSizeChange"
                  @current-change="handleCurrentChange"
                  :current-page="currentPage"
                  :page-sizes="[5, 10, 15, 20]"
                  :page-size="pageSize"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="total">
                </el-pagination>
              </div>
      </div>
    </div>
    </div>
</template>

<script>
export default {
    data(){
        return {
            searchData:{
                entry_date: '',
                check_date: '',
                state: 0,
                department: ''
            },
            stateoptions:[{
                value: 0,
                label: '已关闭'
            },{
                value: 1,
                label: '待关闭'
            }],
            recordTable:[],
            currentPage: 0,
            pageSize:5,
            total: 20
        }
    }
}
</script>

<style lang="scss" scoped>
.content-main{
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: column;
    .top-bar{
      margin: -25px -15px;
      background: #fff;
      display: flex;
      justify-content: space-between;
      padding: 5px 24px 0px 24px;
      .rightBtn{
        display: flex;
        justify-content: space-between;
      }
    }
    .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: 0px;
          flex: 1;
          background: #fff;
          /* padding: 20px 20px 10px 20px; */
          display: flex;
          flex-direction: column;
          .el-table {
            flex: 1;
          }
          >div:nth-child(2){
            display: flex;
            justify-content: end;
            margin: 10px 0;
          }
      }
    }
}
</style>