样式修改

zhanghua

2022-12-05 1f5ed9769113223526a190d243e8834524e3554d

样式修改

 src/views/operate/viewEvent/index.vue

@@ -4,27 +4,39 @@
            <div class="headerTitle">运营管理 >> 案卷查询</div>
            <div class="headerContent">
                <div class="contentItem">
                    <div style="width: 80px;">按编号: </div>
          <div style="width: 80px">按编号:</div>
                    <div>
                        <el-input placeholder=" 请输入编号" v-model="searchData.number"></el-input>
            <el-input
              placeholder=" 请输入编号"
              v-model="searchData.number"
            ></el-input>
                    </div>
                </div>
                <div class="contentItem">
                    <div style="width: 80px;">按类型: </div>
          <div style="width: 80px">按类型:</div>
                    <div class="search">
                        <el-input placeholder=" 请输入类型" v-model="searchData.categories"></el-input>
            <el-input
              placeholder=" 请输入类型"
              v-model="searchData.categories"
            ></el-input>
                    </div>
                </div>
                <div class="contentItem">
                    <div style="width: 80px;">按社区: </div>
          <div style="width: 80px">按社区:</div>
                    <div class="search">
                        <el-input placeholder=" 请输入社区" v-model="searchData.communityId"></el-input>
            <el-input
              placeholder=" 请输入社区"
              v-model="searchData.communityId"
            ></el-input>
                    </div>
                </div>
                <div class="contentItem">
                    <div style="width: 150px;">按事发地点: </div>
          <div style="width: 150px">按事发地点:</div>
                    <div class="search">
                        <el-input placeholder=" 请输入事发地点" v-model="searchData.site"></el-input>
            <el-input
              placeholder=" 请输入事发地点"
              v-model="searchData.site"
            ></el-input>
                    </div>
                </div>
              <div class="btn">
@@ -32,7 +44,10 @@
              </div>
            </div>
            <div class="headerContent">
                <div style="width: 60px;">时间: </div>
        <div class="contentItem">
          <div style="width: 60px">时间:</div>

          <div class="search">
                <el-date-picker
                    v-model="datepick"
                    type="daterange"
@@ -40,16 +55,29 @@
                    value-format="yyyy-MM-dd HH:mm:ss"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期">
              end-placeholder="结束日期"
            >
                </el-date-picker>
          </div>
        </div>
            </div>
        </header>
        <main>
            <div class="mainContent">
                <!-- 数据展示 -->
                <el-table ref="multipleTable"
                    :header-cell-style="{ background: '#06122c', 'font-size': '12px', color: '#4b9bb7', 'font-weight': '650', 'line-height': '45px' }"
                    :data="tableData" style="width: 100%" :row-class-name="tableRowClassName">
        <el-table
          ref="multipleTable"
          :header-cell-style="{
            background: '#06122c',
            'font-size': '12px',
            color: '#4b9bb7',
            'font-weight': '650',
            'line-height': '45px',
          }"
          :data="tableData"
          style="width: 100%"
          :row-class-name="tableRowClassName"
        >
                    <el-table-column prop="code" label="事件编号" min-width="18">
                        <template slot-scope="scope">
                            <el-link>{{ scope.row.code }}</el-link>
@@ -62,40 +90,85 @@
                    </el-table-column>
                    <el-table-column prop="eventSource" label="问题来源" min-width="8">
                        <template v-if="scope.row.eventSource" slot-scope="scope">
                            <span>{{ scope.row.eventSource === 2 ? '人工上报' : '视频上传' }}</span>
              <span>{{
                scope.row.eventSource === 2 ? "人工上报" : "视频上传"
              }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column prop="communityText" label="社区" min-width="8">
                    </el-table-column>
                    <el-table-column prop="alarmTime" label="报警时间" min-width="15" v-if="myproblem === 1">
          <el-table-column
            prop="alarmTime"
            label="报警时间"
            min-width="15"
            v-if="myproblem === 1"
          >
                        <template slot-scope="scope">
                            <span>{{ filterTime(scope.row.alarmTime) }}</span>
                        </template>
                    </el-table-column>
                </el-table>
                <!-- 审核页面 -->
                <el-dialog :visible.sync="dialogExamine" width="80%" title="基础信息(人工)"
                    :before-close="handleClose">
                    <MyExamine :info="info" v-if="myproblem === 1" @closeDialog="closeDialog"></MyExamine>
                    <MyIllExamine :info="info" v-else @closeDialog="closeDialog"></MyIllExamine>
        <el-dialog
          :visible.sync="dialogExamine"
          width="80%"
          title="基础信息(人工)"
          :before-close="handleClose"
        >
          <MyExamine
            :info="info"
            v-if="myproblem === 1"
            @closeDialog="closeDialog"
          ></MyExamine>
          <MyIllExamine
            :info="info"
            v-else
            @closeDialog="closeDialog"
          ></MyIllExamine>
                </el-dialog>
                <!-- 结案页面 -->
                <el-dialog :visible.sync="dialogClosure" width="80%" title="基础信息(人工)"
                    :before-close="handleClose">
                    <MyClosure :info="info" v-if="myproblem === 1" @closeDialog="closeDialog"></MyClosure>
                    <MyIllClosure :info="info" v-else @closeDialog="closeDialog"></MyIllClosure>
        <el-dialog
          :visible.sync="dialogClosure"
          width="80%"
          title="基础信息(人工)"
          :before-close="handleClose"
        >
          <MyClosure
            :info="info"
            v-if="myproblem === 1"
            @closeDialog="closeDialog"
          ></MyClosure>
          <MyIllClosure
            :info="info"
            v-else
            @closeDialog="closeDialog"
          ></MyIllClosure>
                </el-dialog>
                <!-- 详情页面 -->
                <el-dialog :visible.sync="dialogView" width="80%" title="基础信息(人工)"
                    :before-close="handleNoClose">
                    <MyDetail :info=info v-if="myproblem === 1" :mycode='number'></MyDetail>
                    <MyIllDetail :info=info v-else :mycode="number"></MyIllDetail>
        <el-dialog
          :visible.sync="dialogView"
          width="80%"
          title="基础信息(人工)"
          :before-close="handleNoClose"
        >
          <MyDetail
            :info="info"
            v-if="myproblem === 1"
            :mycode="number"
          ></MyDetail>
          <MyIllDetail :info="info" v-else :mycode="number"></MyIllDetail>
                </el-dialog>
                <!-- tools -->
                <div class="tools">
                    <div class="pagination">
                        <el-pagination background :current-page="currentPage" layout="prev, pager, next"
                            :total="totalNum" :page-size="pageSize" @current-change="changeCurrentPage">
            <el-pagination
              background
              :current-page="currentPage"
              layout="prev, pager, next"
              :total="totalNum"
              :page-size="pageSize"
              @current-change="changeCurrentPage"
            >
                        </el-pagination>
                    </div>
                </div>
@@ -104,19 +177,24 @@
    </div>
</template>
<script>
import MyExamine from './components/examine'
import MyClosure from './components/closure'
import MyIllExamine from './components/illExamine'
import MyIllClosure from './components/illclosure'
import MyDetail from '@/components/detail'
import MyIllDetail from '@/components/illdetail'
import helper from '@/utils/mydate'
import MyExamine from "./components/examine";
import MyClosure from "./components/closure";
import MyIllExamine from "./components/illExamine";
import MyIllClosure from "./components/illclosure";
import MyDetail from "@/components/detail";
import MyIllDetail from "@/components/illdetail";
import helper from "@/utils/mydate";
import casequery from "@/api/operate/basecase";
import { CATEGOTY } from "@/utils/helper";

export default {
    components: {
        MyExamine, MyClosure, MyDetail, MyIllDetail, MyIllExamine, MyIllClosure
    MyExamine,
    MyClosure,
    MyDetail,
    MyIllDetail,
    MyIllExamine,
    MyIllClosure,
    },
    data() {
        return {
@@ -131,50 +209,54 @@
            currentPage: 1,
            typeList: [
                {
                    name: '违规',
          name: "违规",
                    value: 1,
                    checked: true
          checked: true,
                },
                {
                    name: '违建',
          name: "违建",
                    value: 2,
                    checked: false,
                },
            ],
            myproblem: 1,
            number: '',
      number: "",
          searchData: {
            categories: null,
            number: null,
            communityId: null,
            endTime: null,
            site: null,
            startTime: null
          }
        }
        startTime: null,
      },
    };
    },
    created() {
        this.getList();
    },
    methods: {

        // 获取列表
        getList() {
          casequery.baseCaseQuery({  current: this.currentPage, pageSize: this.pageSize, ...this.searchData })
      casequery
        .baseCaseQuery({
          current: this.currentPage,
          pageSize: this.pageSize,
          ...this.searchData,
        })
              .then((res) => {
                this.tableData = res.records;
                this.totalNum=res.total;
              })
              .catch(err => {
        .catch((err) => {
                    this.tableData = [];
                })
        });
        },
        // 设置表格斑马纹
        tableRowClassName({ row, rowIndex }) {
            if ((rowIndex + 1) % 2 === 0) {
                return 'warning-row';
        return "warning-row";
            } else {
                return 'success-row';
        return "success-row";
            }
        },
        // 当前页改变触发事件
@@ -185,16 +267,19 @@

        datepickChange() {
          this.searchData.startTime = this.datepick[0];
          this.searchData.endTime = this.datepick[1].replace('00:00:00', '23:59:59');
      this.searchData.endTime = this.datepick[1].replace(
        "00:00:00",
        "23:59:59"
      );
        },

        handleClose(done) {
            this.$confirm('确认关闭？')
                .then(_ => {
      this.$confirm("确认关闭？")
        .then((_) => {
                    this.dialogExamine = false;
                    done();
                })
                .catch(_ => { });
        .catch((_) => {});
        },
        handleNoClose(done) {
            done();
@@ -212,10 +297,10 @@
        },

      getCategoryLabel(data) {
        return CATEGOTY.find(item => item.value === data).label;
      }
    }
}
      return CATEGOTY.find((item) => item.value === data).label;
    },
  },
};
</script>
<style lang="scss" scoped>
.userList {
@@ -296,7 +381,6 @@
                        color: #4b9bb7;
                    }
                }

            }

            .pagination {
@@ -306,7 +390,6 @@
                justify-content: center;

                .el-pagination {

                    &::v-deep li,
                    &::v-deep .btn-prev,
                    &::v-deep .btn-next {