Merge remote-tracking branch 'origin/ecp' into ecp

.gitignore

@@ -23,3 +23,4 @@ yarn-error.log*
 *.sln
 *.sw*
 *.lock
+.prettierrc

src/api/claimSettlement/index.js

@@ -0,0 +1,73 @@
+import request from '@/router/axios';
+/**
+ * 理赔分页查询
+ * @param {number} current - 当前页码
+ * @param {number} size - 每页大小     
+ * @param {any} params
+ */
+export const getList = (current, size, params) => {
+    return request({
+        url: '/api/gubersail-admin/bladeclaim/list',
+        method: 'get',
+        params: {
+            ...params,
+            current,
+            size,
+        }
+    })
+}
+/**
+ * 理赔保存
+ * @param {any} data
+ */
+export const submit = (data) => {
+    return request({
+        url: '/api/gubersail-admin/bladeclaim/submit',
+        method: 'post',
+        data: data
+    })
+}
+/**
+ * 理赔详情
+ * @param {any} data
+ */
+export const detail = (data) => {
+    return request({
+        url: '/api/gubersail-admin/bladeclaim/detail',
+        method: 'post',
+        data: data
+    })
+}
+/**
+ * 理赔删除
+ * @param {any} data
+ */
+export const remove = (data) => {
+    return request({
+        url: '/api/gubersail-admin/bladeclaim/remove',
+        method: 'post',
+        params: data
+    })
+}
+/**
+ * 理赔提交审批
+ * @param {any} params
+ */
+export const submitApprova = (params) => {
+    return request({
+        url: '/api/gubersail-admin/bladeclaim/submitApprova',
+        method: 'get',
+        params: params
+    })
+}
+/**
+ * 理赔提交审批
+ * @param {any} params
+ */
+export const revokeApproval = (params) => {
+    return request({
+        url: '/api/gubersail-admin/bladeclaim/revokeApproval',
+        method: 'get',
+        params: params
+    })
+}

src/components/basic-container/main.vue

@@ -1,99 +1,117 @@
 <template>
-  <div
-    class="basic-container"
-    :style="styleName"
-    :class="{ 'basic-container--block': block }"
-  >
-    <el-card class="basic-container__card">
-      <div v-show="show">
-        <slot></slot>
-      </div>
-      <div v-if="showBtn" class="basic-container-foot" @click="show = !show" @mouseenter="enter" @mouseleave="leave">
-        <div v-show="show" style="height: 20px">
-          <span class="el-button--text"><i class="el-icon-caret-top" /><span v-show="showSpan">隐藏</span></span>
-        </div>
-        <div v-show="!show" style="height: 20px">
-          <span class="el-button--text"><i class="el-icon-caret-bottom" /><span v-show="showSpan">显示</span></span>
-        </div>
-      </div>
-    </el-card>
-  </div>
+    <div
+        class="basic-container"
+        :style="styleName"
+        :class="{ 'basic-container--block': block }"
+    >
+        <el-card class="basic-container__card">
+            <div v-show="show">
+                <slot></slot>
+            </div>
+            <div
+                v-if="showBtn"
+                class="basic-container-foot"
+                @click="show = !show"
+                @mouseenter="enter"
+                @mouseleave="leave"
+            >
+                <div v-show="show" style="height: 20px">
+                    <span class="el-button--text"
+                        ><i class="el-icon-caret-top" /><span v-show="showSpan"
+                            >隐藏</span
+                        ></span
+                    >
+                </div>
+                <div v-show="!show" style="height: 20px">
+                    <span class="el-button--text"
+                        ><i class="el-icon-caret-bottom" /><span
+                            v-show="showSpan"
+                            >显示</span
+                        ></span
+                    >
+                </div>
+            </div>
+        </el-card>
+    </div>
 </template>
 
 <script>
 export default {
-  name: "basicContainer",
-  data() {
-    return {
-      show: true,
-      showSpan: false
-    };
-  },
-  props: {
-    radius: {
-      type: [String, Number],
-      default: 10
+    name: "basicContainer",
+    data() {
+        return {
+            show: true,
+            showSpan: false
+        };
     },
-    background: {
-      type: String
+    props: {
+        radius: {
+            type: [String, Number],
+            default: 10
+        },
+        background: {
+            type: String
+        },
+        block: {
+            type: Boolean,
+            default: false
+        },
+        showBtn: {
+            type: Boolean,
+            default: false
+        }
     },
-    block: {
-      type: Boolean,
-      default: false
+    methods: {
+        enter() {
+            this.showSpan = true;
+        },
+        leave() {
+            this.showSpan = false;
+        }
     },
-    showBtn: {
-      type: Boolean,
-      default: false
+    computed: {
+        styleName() {
+            return {
+                borderRadius: this.setPx(this.radius),
+                background: this.background
+            };
+        }
     }
-  },
-  methods: {
-    enter() {
-      this.showSpan = true;
-    },
-    leave() {
-      this.showSpan = false;
-    }
-  },
-  computed: {
-    styleName() {
-      return {
-        borderRadius: this.setPx(this.radius),
-        background: this.background
-      };
-    }
-  }
 };
 </script>
 
 <style lang="scss">
 .basic-container {
-  padding: 5px 6px;
-  box-sizing: border-box;
-  &--block {
-    height: 100%;
-    .basic-container__card {
-      height: 100%;
+    padding: 5px 6px;
+    box-sizing: border-box;
+    &--block {
+        height: 100%;
+        .basic-container__card {
+            height: 100%;
+        }
+    }
+    .el-card .el-card__body {
+        padding: 10px !important;
+    }
+    &__card {
+        width: 100%;
+    }
+    &:first-child {
+        padding-top: 6px;
+    }
+    &-foot {
+        cursor: pointer;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        color: #d3dce6;
+        span {
+            margin-left: 4px;
+            font-size: 14px;
+        }
     }
-  }
-  &__card {
-    width: 100%;
-  }
-  &:first-child {
-    padding-top: 6px;
-  }
-  &-foot {
-    cursor: pointer;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    color: #d3dce6;
-    span {
-      margin-left: 4px;
-      font-size: 14px;
+    &-foot:hover {
+        color: #409eff;
     }
-  }
-  &-foot:hover {
-    color: #409eff;
-  }
 }
 </style>

src/components/trade-card/main.vue

@@ -7,14 +7,18 @@
       </div>
       <div v-if="showBtn" class="container-foot" @click="open">
         <div v-show="show" style="height: 20px">
-          <span><i class="el-icon-arrow-up" :style="styleIocup" /></span>
+          <span><i class="el-icon-arrow-up" :style="styleIocup"/></span>
         </div>
         <div v-show="!show" style="height: 20px">
-          <span><i class="el-icon-arrow-down" /></span>
+          <span><i class="el-icon-arrow-down"/></span>
         </div>
       </div>
     </div>
-    <div class="basic-container" :style="styleName" :class="{ 'basic-container--block': block }">
+    <div
+      class="basic-container"
+      :style="styleName"
+      :class="{ 'basic-container--block': block }"
+    >
       <el-card class="basic-container__card" style="padding: 0;">
         <el-collapse-transition>
           <div v-show="show">
@@ -24,16 +28,13 @@
       </el-card>
     </div>
   </div>
-
 </template>
 
 <script>
 export default {
-  name: "basicContainer",
+  name: 'basicContainer',
   data() {
-    return {
-
-    };
+    return {};
   },
   props: {
     radius: {
@@ -58,15 +59,15 @@ export default {
       type: Boolean,
       default: true
     },
-    styleIocup:{
-      type:String,
-      default:''
-    },
+    styleIocup: {
+      type: String,
+      default: ''
+    }
   },
   methods: {
-    open(){
-      this.show = !this.show
-      this.$emit("openClose",this.show)
+    open() {
+      this.show = !this.show;
+      this.$emit('openClose', this.show);
     }
   },
   computed: {
@@ -80,7 +81,7 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .container {
   display: flex;
   justify-content: space-between;
@@ -128,6 +129,9 @@ export default {
     }
   }
 
+  ::v-deep .el-card .el-card__body {
+    padding: 5px !important;
+  }
   &__card {
     width: 100%;
   }
@@ -136,7 +140,4 @@ export default {
     padding-top: 6px;
   }
 }
-::v-deep .el-card__body{
-    padding: 0px;
-}
 </style>

src/components/uploadFile/index.vue

@@ -0,0 +1,209 @@
+<template>
+  <div>
+    <avue-crud
+      :option="option"
+      :data="data"
+      id="out-table"
+      ref="crud"
+      :header-cell-class-name="headerClassName"
+      :row-style="{ height: '20px', padding: '0px' }"
+      :cell-style="{ height: '20px', padding: '0px' }"
+      @selection-change="selectionChange"
+    >
+      <template slot="menuLeft">
+        <div style="display: flex;">
+          <el-upload
+            :headers="headers"
+            action="/api/blade-resource/oss/endpoint/put-file"
+            :on-success="onSuccess"
+            :on-error="onError"
+          >
+            <el-button icon="el-icon-upload" type="primary" size="mini"
+              >点击上传
+            </el-button>
+          </el-upload>
+        </div>
+      </template>
+    </avue-crud>
+  </div>
+</template>
+
+<script>
+import { getToken } from '@/util/auth';
+export default {
+  name: 'detailsPage',
+  data() {
+    return {
+      headers: { 'Blade-Auth': 'Bearer ' + getToken() },
+      option: {
+        maxHeight: 340,
+        calcHeight: 30,
+        menuWidth: 60,
+        searchMenuSpan: 18,
+        tip: false,
+        border: true,
+        index: true,
+        addBtn: false,
+        viewBtn: false,
+        editBtn: false,
+        delBtn: false,
+        refreshBtn: false,
+        selection: true,
+        align: 'center',
+        menu: false,
+        column: [
+          {
+            label: '原始文件名',
+            prop: 'fileName',
+            overHidden: true
+          },
+          {
+            label: '文件地址',
+            prop: 'fileUrl',
+            overHidden: true
+          },
+          {
+            label: '文件类型',
+            prop: 'fileType',
+            overHidden: true
+          },
+          {
+            label: '制单人',
+            prop: 'createUserName',
+            overHidden: true
+          },
+          {
+            label: '制单日期',
+            prop: 'createTime',
+            type: 'date',
+            overHidden: true,
+            width: 120,
+            format: 'yyyy-MM-dd',
+            valueFormat: 'yyyy-MM-dd HH:mm:ss'
+          },
+          {
+            label: '修改人',
+            prop: 'updateUserName',
+            overHidden: true
+          },
+          {
+            label: '修改日期',
+            prop: 'updateTime',
+            type: 'date',
+            overHidden: true,
+            width: 120,
+            format: 'yyyy-MM-dd',
+            valueFormat: 'yyyy-MM-dd HH:mm:ss'
+          },
+          {
+            label: '备注',
+            prop: 'remarks',
+            cell: true,
+            width: 150,
+            overHidden: true
+          }
+        ]
+      }
+    };
+  },
+  components: {},
+  props: {
+    data: {
+      type: Array,
+      default: function() {
+        return [];
+      }
+    },
+    linkKey: {
+      type: String,
+      default: 'link'
+    },
+    delUrl: {
+      type: String,
+      default: '/api/blade-los/tradingBoxFiles/remove'
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    }
+  },
+  created() {},
+  methods: {
+    /**
+     * @param {any} list
+     */
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    /**
+     * @param {any} res
+     * @param {any} file
+     * @param {any} fileList
+     */
+    onSuccess(res, file, fileList) {
+      this.data.push({
+        pid: this.pId ? this.pId : null,
+        fileName: res.data.originalName,
+        url: res.data[this.linkKey]
+      });
+    },
+    /**
+     * @param {any} err
+     * @param {any} file
+     * @param {any} fileList
+     */
+    onError(err, file, fileList) {
+        console.log(err)
+      this.$message.error(err);
+    },
+    /**
+     * @param {{ columnIndex: number; column: { level: number; }; }} tab
+     */
+    headerClassName(tab) {
+      //颜色间隔
+      let back = '';
+      if (tab.columnIndex >= 0 && tab.column.level === 1) {
+        if (tab.columnIndex % 2 === 0) {
+          back = 'back-one';
+        } else if (tab.columnIndex % 2 === 1) {
+          back = 'back-two';
+        }
+      }
+      return back;
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+::v-deep .el-table .cell {
+  padding: 0 2px !important;
+  .el-form-item {
+    margin-bottom: 0px !important;
+  }
+}
+
+::v-deep .avue-crud .el-table .el-form-item__label {
+  left: -1px;
+}
+::v-deep #out-table .back-one {
+  background: #ecf5ff !important;
+  text-align: center;
+  padding: 4px 0;
+}
+
+::v-deep #out-table .back-two {
+  background: #ecf5ff !important;
+  text-align: center;
+  padding: 4px 0;
+}
+
+::v-deep .el-table--small td,
+.el-table--small th {
+  padding: 2px !important;
+}
+
+::v-deep .el-upload-list {
+  display: none;
+}
+</style>

src/main.js

@@ -24,6 +24,7 @@ import crudCommon from '@/mixins/crud';
 import format from 'vue-text-format'; //v-format
 import basicBlock from './components/basic-block/main';
 import basicContainer from './components/basic-container/main';
+import uploadFile from './components/uploadFile/index';
 import {
     getWorkDicts
 } from '@/api/system/dictbiz'
@@ -35,6 +36,7 @@ import tradeCard from './components/trade-card/main.vue';
 Vue.component('tradeCard', tradeCard);
 Vue.component('basicContainer', basicContainer);
 Vue.component('basicBlock', basicBlock);
+Vue.component('uploadFile', uploadFile);
 Vue.use(Avue);
 Vue.use(avueUeditor)
 

src/styles/variables.scss

@@ -97,4 +97,7 @@ p{
 }
 .el-form-item--mini.el-form-item, .el-form-item--small.el-form-item {
   margin-bottom: 2px !important;
+}
+.avue-crud .avue-crud__menu {
+    padding: 0 !important;
 }

src/views/claimSettlement/detailsPage.vue

@@ -0,0 +1,388 @@
+<template>
+  <div>
+    <div class="customer-head">
+      <div class="customer-back">
+        <el-button
+          type="danger"
+          style="border: none;background: none;color: red"
+          icon="el-icon-arrow-left"
+          @click="goBack()"
+          >返回列表
+        </el-button>
+      </div>
+      <div class="add-customer-btn">
+        <el-button
+          class="el-button--small-yh"
+          style="margin-left: 6px;"
+          type="primary"
+          size="small"
+          v-if="editBtn"
+          @click="inEdit"
+          >编 辑
+        </el-button>
+        <el-button
+          class="el-button--small-yh"
+          v-else
+          style="margin-left: 6px;"
+          type="primary"
+          size="small"
+          :disabled="editDis"
+          @click="submit"
+          >保 存
+        </el-button>
+      </div>
+    </div>
+    <div style="margin-top: 50px">
+      <el-tab-pane label="基础信息">
+        <trade-card title="基础信息">
+          <avue-form :option="optionForm" v-model="form" ref="form">
+          </avue-form>
+        </trade-card>
+        <trade-card title="文件中心">
+          <upload-file :data="[]" :disabled="editDis"></upload-file>
+        </trade-card>
+        <trade-card title="反馈表">
+          <avue-crud
+            :option="option"
+            :data="data"
+            id="out-table"
+            ref="crud"
+            :header-cell-class-name="headerClassName"
+            :row-style="{ height: '20px', padding: '0px' }"
+            :cell-style="{ height: '20px', padding: '0px' }"
+            @selection-change="selectionChange"
+          >
+          </avue-crud>
+        </trade-card>
+        <trade-card title="操作记录">
+          <avue-form :option="optionForm2" v-model="form" ref="form2">
+          </avue-form>
+        </trade-card>
+      </el-tab-pane>
+    </div>
+  </div>
+</template>
+
+<script>
+import {
+  submit,
+  detail,
+  submitApprova,
+  revokeApproval
+} from '@/api/claimSettlement/index';
+export default {
+  name: 'detailsPage',
+  data() {
+    return {
+      editBtn: false,
+      editDis: false,
+      form: {},
+      oldForm: {},
+      optionForm: {
+        menuBtn: false,
+        span: 6,
+        disabled: false,
+        labelWidth: 100,
+        column: [
+          {
+            label: '理赔单号',
+            prop: 'claimNo',
+            disabled: true
+          },
+          {
+            label: '来源类型',
+            prop: 'claimSourceType',
+            type: 'select',
+            dicData: [
+              {
+                label: '经销商',
+                value: 1
+              },
+              {
+                label: '门店',
+                value: 2
+              },
+              {
+                label: '终端消费者',
+                value: 3
+              }
+            ]
+          },
+          {
+            label: '来源方名称',
+            prop: 'sourceName'
+          },
+          {
+            label: '消费者姓名',
+            prop: 'consumerName'
+          },
+          {
+            label: '消费者电话',
+            prop: 'consumerPhone'
+          },
+          {
+            label: '胎号',
+            prop: 'tyreNo'
+          },
+          {
+            label: '规格型号',
+            prop: 'tyreSpecs'
+          },
+          {
+            label: '购买日期',
+            prop: 'purchaseDate',
+            type: 'date',
+            format: 'yyyy-MM-dd',
+            valueFormat: 'yyyy-MM-dd'
+          },
+          {
+            label: '装车日期',
+            prop: 'mountDate',
+            type: 'date',
+            format: 'yyyy-MM-dd',
+            valueFormat: 'yyyy-MM-dd'
+          },
+          {
+            label: '行驶里程(km)',
+            prop: 'runMileage'
+          },
+          {
+            label: '索赔金额',
+            prop: 'claimAmount'
+          },
+          {
+            label: '理赔原因',
+            prop: 'claimReason',
+            type: 'textarea',
+            span: 12,
+            minRows: 2
+          },
+          {
+            label: '备注',
+            prop: 'remark',
+            type: 'textarea',
+            span: 12,
+            minRows: 2
+          }
+        ]
+      },
+      optionForm2: {
+        menuBtn: false,
+        span: 6,
+        disabled: false,
+        labelWidth: 100,
+        column: [
+          {
+            label: '审核状态',
+            prop: 'auditStatus',
+            type: 'select',
+            dicData: [
+              {
+                label: '待审核',
+                value: 0
+              },
+              {
+                label: '审核中',
+                value: 1
+              },
+              {
+                label: '已通过',
+                value: 2
+              },
+              {
+                label: '已拒绝',
+                value: 3
+              }
+            ],
+            disabled: true
+          },
+          {
+            label: '制单人',
+            prop: 'createUserName',
+            disabled: true
+          },
+          {
+            label: '制单日期',
+            prop: 'createTime',
+            disabled: true
+          },
+          {
+            label: '修改人',
+            prop: 'updateUserName',
+            disabled: true
+          },
+          {
+            label: '修改日期',
+            prop: 'updateTime',
+            disabled: true
+          }
+        ]
+      },
+      option: {
+        maxHeight: 340,
+        calcHeight: 30,
+        menuWidth: 60,
+        searchMenuSpan: 18,
+        tip: false,
+        border: true,
+        addBtn: false,
+        viewBtn: false,
+        editBtn: false,
+        delBtn: false,
+        refreshBtn: false,
+        selection: true,
+        align: 'center',
+        menu: false,
+        column: [
+          {
+            label: 'index',
+            prop: 'index',
+            width: '55',
+            fixed: true,
+            headerslot: true
+          },
+          {
+            label: '原始文件名',
+            prop: 'fileName',
+            overHidden: true
+          },
+          {
+            label: '文件地址',
+            prop: 'fileUrl',
+            overHidden: true
+          },
+          {
+            label: '文件类型',
+            prop: 'fileType',
+            overHidden: true
+          },
+          {
+            label: '制单人',
+            prop: 'createUserName',
+            overHidden: true
+          },
+          {
+            label: '制单日期',
+            prop: 'createTime',
+            type: 'date',
+            overHidden: true,
+            width: 120,
+            format: 'yyyy-MM-dd',
+            valueFormat: 'yyyy-MM-dd HH:mm:ss'
+          },
+          {
+            label: '修改人',
+            prop: 'updateUserName',
+            overHidden: true
+          },
+          {
+            label: '修改日期',
+            prop: 'updateTime',
+            type: 'date',
+            overHidden: true,
+            width: 120,
+            format: 'yyyy-MM-dd',
+            valueFormat: 'yyyy-MM-dd HH:mm:ss'
+          },
+          {
+            label: '备注',
+            prop: 'remarks',
+            cell: true,
+            width: 150,
+            overHidden: true
+          }
+        ]
+      }
+    };
+  },
+  components: {},
+  props: {
+    detailData: Object
+  },
+  created() {
+    if (this.detailData && this.detailData.id) {
+      this.editBtn = true;
+      this.editDis = true;
+      this.optionForm.disabled = true;
+      this.getDetail(this.detailData.id);
+    }
+  },
+  methods: {
+    inEdit() {
+      this.editBtn = false;
+      if (this.form.status == '录入') {
+        this.editDis = false;
+        this.optionForm.disabled = false;
+      }
+    },
+    /**
+     * @param {any} id
+     */
+    getDetail(id) {
+      const loading = this.$loading({
+        lock: true,
+        text: '加载中',
+        spinner: 'el-icon-loading',
+        background: 'rgba(255,255,255,0.7)'
+      });
+      detail({ id: id })
+        .then(res => {
+          this.form = res.data.data;
+        })
+        .finally(() => {
+          loading.close();
+        });
+    },
+     // 更改表格颜色
+    /**
+     * @param {{ columnIndex: number; column: { level: number; }; }} tab
+     */
+    headerClassName(tab) {
+      //颜色间隔
+      let back = ""
+      if (tab.columnIndex >= 0 && tab.column.level === 1) {
+        if (tab.columnIndex % 2 === 0) {
+          back = "back-one"
+        } else if (tab.columnIndex % 2 === 1) {
+          back = "back-two"
+        }
+      }
+      return back;
+    },
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+::v-deep .el-form-item__error {
+  display: none !important;
+}
+
+::v-deep .el-form-item {
+  margin-bottom: 8px !important;
+}
+
+::v-deep .el-table .cell {
+  padding: 0 2px !important;
+
+  .el-form-item {
+    margin-bottom: 0px !important;
+  }
+}
+::v-deep #out-table .back-one {
+  background: #ecf5ff !important;
+  text-align: center;
+  padding: 4px 0;
+}
+
+::v-deep #out-table .back-two {
+  background: #ecf5ff !important;
+  text-align: center;
+  padding: 4px 0;
+}
+
+::v-deep .el-table--small td,
+.el-table--small th {
+  padding: 2px !important;
+}
+</style>

src/views/claimSettlement/index.vue

@@ -0,0 +1,391 @@
+<template>
+  <div>
+    <basic-container v-if="isShow">
+      <avue-crud
+        ref="crud"
+        id="out-table"
+        :option="option"
+        :table-loading="loading"
+        :data="data"
+        :page.sync="page"
+        :search.sync="query"
+        :header-cell-class-name="headerClassName"
+        @search-change="searchChange"
+        @search-reset="searchReset"
+        @selection-change="selectionChange"
+        @current-change="currentChange"
+        @size-change="sizeChange"
+        @refresh-change="refreshChange"
+        @on-load="onLoad"
+      >
+        <template slot="menuLeft">
+          <el-button
+            type="primary"
+            size="small"
+            icon="el-icon-plus"
+            @click="addButton"
+            >创建单据
+          </el-button>
+        </template>
+        <template slot="menu" slot-scope="{ row, index }">
+          <el-button
+            size="small"
+            icon="el-icon-edit"
+            type="text"
+            @click="rowEdit(row)"
+            >编辑
+          </el-button>
+          <el-button
+            size="small"
+            icon="el-icon-delete"
+            type="text"
+            @click="rowDel(row, index)"
+            :disabled="row.count > 0"
+            >删 除
+          </el-button>
+        </template>
+        <template slot="contractNo" slot-scope="{ row }">
+          <span style="color: #1e9fff;cursor: pointer;" @click="rowEdit(row)">
+            {{ row.contractNo }}
+          </span>
+        </template>
+      </avue-crud>
+    </basic-container>
+    <detailsPage
+      v-if="!isShow"
+      :detailData="detailData"
+      @goBack="goBack"
+    ></detailsPage>
+  </div>
+</template>
+
+<script>
+import { getList, remove } from '@/api/claimSettlement/index';
+import detailsPage from './detailsPage.vue';
+import { getToken } from '@/util/auth';
+export default {
+  data() {
+    return {
+      isShow: true,
+      form: {},
+      query: {},
+      loading: false,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      option: {
+        height: 'auto',
+        calcHeight: 30,
+        menuWidth: 140,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 24,
+        border: true,
+        index: true,
+        addBtn: false,
+        viewBtn: false,
+        editBtn: false,
+        delBtn: false,
+        selection: true,
+        searchIcon: true,
+        align: 'center',
+        searchIndex: 3,
+        column: [
+          {
+            label: '理赔单号',
+            prop: 'claimNo',
+            search: true,
+            overHidden: true
+          },
+          {
+            label: '来源类型',
+            prop: 'claimSourceType',
+            search: true,
+            type: 'select',
+            dicData: [
+              {
+                label: '经销商',
+                value: 1
+              },
+              {
+                label: '门店',
+                value: 2
+              },
+              {
+                label: '终端消费者',
+                value: 3
+              }
+            ],
+            overHidden: true
+          },
+          {
+            label: '来源方名称',
+            prop: 'sourceName',
+            width: 90,
+            search: true,
+            overHidden: true
+          },
+          {
+            label: '消费者姓名',
+            prop: 'consumerName',
+            width: 90,
+            search: true,
+            overHidden: true
+          },
+          {
+            label: '消费者电话',
+            prop: 'consumerPhone',
+            width: 90,
+            overHidden: true
+          },
+          {
+            label: '胎号',
+            prop: 'tyreNo',
+            overHidden: true
+          },
+          {
+            label: '规格型号',
+            prop: 'tyreSpecs',
+            overHidden: true
+          },
+          {
+            label: '购买日期',
+            prop: 'purchaseDate',
+            overHidden: true
+          },
+          {
+            label: '装车日期',
+            prop: 'mountDate',
+            overHidden: true
+          },
+          {
+            label: '行驶里程(km)',
+            prop: 'runMileage',
+            width: 100,
+            overHidden: true
+          },
+          {
+            label: '理赔原因',
+            prop: 'claimReason',
+            overHidden: true
+          },
+          {
+            label: '索赔金额',
+            prop: 'claimAmount',
+            overHidden: true
+          },
+          {
+            label: '审核状态',
+            prop: 'auditStatus',
+            type: 'select',
+            dicData: [
+              {
+                label: '待审核',
+                value: 0
+              },
+              {
+                label: '审核中',
+                value: 1
+              },
+              {
+                label: '已通过',
+                value: 2
+              },
+              {
+                label: '已拒绝',
+                value: 3
+              }
+            ],
+            overHidden: true
+          },
+          {
+            label: '提交时间',
+            prop: 'submitTime',
+            overHidden: true
+          },
+          {
+            label: '备注',
+            prop: 'remark',
+            overHidden: true
+          },
+          {
+            label: '制单人',
+            prop: 'createUserName',
+            overHidden: true,
+            width: 80
+          },
+          {
+            label: '制单日期',
+            prop: 'createTime',
+            type: 'date',
+            overHidden: true,
+            width: 100,
+            format: 'yyyy-MM-dd',
+            valueFormat: 'yyyy-MM-dd HH:mm:ss'
+          },
+          {
+            label: '修改人',
+            prop: 'updateUserName',
+            overHidden: true,
+            width: 80
+          },
+          {
+            label: '修改日期',
+            prop: 'updateTime',
+            type: 'date',
+            overHidden: true,
+            width: 100,
+            format: 'yyyy-MM-dd',
+            valueFormat: 'yyyy-MM-dd HH:mm:ss'
+          }
+        ]
+      },
+      data: []
+    };
+  },
+  components: {
+    detailsPage
+  },
+  created() {
+  },
+  methods: {
+    addButton() {
+      this.isShow = false;
+    },
+    /**
+     * @param {{ id: any; }} row
+     */
+    rowEdit(row) {
+      this.detailData = {
+        id: row.id
+      };
+      this.isShow = false;
+    },
+    // 删除
+    /**
+     * @param {{ item: number; id: any; }} row
+     * @param {any} index
+     */
+    rowDel(row, index) {
+      if (row.item == 1) {
+        return this.$message.error('存在明细不允许删除');
+      }
+      this.$confirm('确定将选择数据删除?', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        remove({ ids: row.id }).then(res => {
+          this.onLoad(this.page, this.query);
+          this.$message.success('成功删除');
+        });
+      });
+    },
+    searchReset() {
+      this.query = this.$options.data().query;
+      this.onLoad(this.page);
+    },
+    // 搜索按钮点击
+    /**
+     * @param {any} params
+     * @param {() => void} done
+     */
+    searchChange(params, done) {
+      this.page.currentPage = 1;
+      this.onLoad(this.page, this.query);
+      done();
+    },
+    /**
+     * @param {any} list
+     */
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    /**
+     * @param {any} currentPage
+     */
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage;
+    },
+    /**
+     * @param {any} pageSize
+     */
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    /**
+     * @param {{ currentPage: any; pageSize: any; }} page
+     */
+    onLoad(page, params = {}) {
+      let obj = {};
+      obj = {
+        ...Object.assign(params, this.query)
+      };
+      this.loading = true;
+      getList(page.currentPage, page.pageSize, obj)
+        .then(res => {
+          this.data = res.data.data.records;
+          this.page.total = res.data.data.total;
+          this.$nextTick(() => {
+            this.$refs.crud.doLayout();
+            // this.$refs.crud.dicInit();
+          });
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+    // 详情的返回列表
+    goBack() {
+      // 初始化数据
+      if (JSON.stringify(this.$route.query) != '{}') {
+        this.$router.$avueRouter.closeTag();
+        this.$router.push({
+          path: '/boxManagement/buyContainer/index'
+        });
+      }
+      this.detailData = {};
+      this.isShow = true;
+      this.onLoad(this.page, this.query);
+    },
+    // 更改表格颜色
+    /**
+     * @param {{ columnIndex: number; column: { level: number; }; }} tab
+     */
+    headerClassName(tab) {
+      //颜色间隔
+      let back = '';
+      if (tab.columnIndex >= 0 && tab.column.level === 1) {
+        if (tab.columnIndex % 2 === 0) {
+          back = 'back-one';
+        } else if (tab.columnIndex % 2 === 1) {
+          back = 'back-two';
+        }
+      }
+      return back;
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+::v-deep #out-table .back-one {
+  background: #ecf5ff !important;
+  text-align: center;
+}
+
+::v-deep #out-table .back-two {
+  background: #ecf5ff !important;
+  text-align: center;
+}
+
+::v-deep .el-col-md-8 {
+  width: 24.33333%;
+}
+</style>