From 4ba346e72aaad7e3b14ccf26da1cdda939c889b9 Mon Sep 17 00:00:00 2001
From: liuye <liuye@sinoecare.com>
Date: Tue, 17 Oct 2023 13:39:06 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AE=A2=E5=8D=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../AppIntegratingOrder.vue                   | 116 ++++++++
 .../components/GirdDetail.vue                 | 172 ++++++++++++
 .../components/GirdList.vue                   | 252 +++++++++++++++++
 .../components/ResidentDetail.vue             | 172 ++++++++++++
 .../components/ResidentList.vue               | 265 ++++++++++++++++++
 5 files changed, 977 insertions(+)
 create mode 100644 project/lulong/AppIntegratingOrder/AppIntegratingOrder.vue
 create mode 100644 project/lulong/AppIntegratingOrder/components/GirdDetail.vue
 create mode 100644 project/lulong/AppIntegratingOrder/components/GirdList.vue
 create mode 100644 project/lulong/AppIntegratingOrder/components/ResidentDetail.vue
 create mode 100644 project/lulong/AppIntegratingOrder/components/ResidentList.vue

diff --git a/project/lulong/AppIntegratingOrder/AppIntegratingOrder.vue b/project/lulong/AppIntegratingOrder/AppIntegratingOrder.vue
new file mode 100644
index 00000000..ffed4121
--- /dev/null
+++ b/project/lulong/AppIntegratingOrder/AppIntegratingOrder.vue
@@ -0,0 +1,116 @@
+<template>
+  <ai-list v-if="!isShowDetail">
+    <template slot="title">
+      <ai-title title="订单管理" :isShowBottomBorder="false" v-model="areaId" :isShowArea="currIndex != '1'" :hideLevel="hideLevel - 1" @change="onAreaChange">
+      </ai-title>
+    </template>
+    <template slot="tabs">
+      <el-tabs v-model="currIndex">
+        <el-tab-pane v-for="(tab,i) in tabs" :key="i" :label="tab.label">
+          <component :areaId="areaId" :ref="String(i)" v-if="currIndex == i" :is="tab.comp" @change="onChange" lazy :instance="instance" :dict="dict" :permissions="permissions"/>
+        </el-tab-pane>
+      </el-tabs>
+    </template>
+  </ai-list>
+  <ResidentDetail v-else-if="componentName === 'ResidentDetail'" :areaId="areaId" :params="params" :instance="instance" :dict="dict" @change="onChange"></ResidentDetail>
+  <GirdDetail v-else-if="componentName === 'GirdDetail'" :areaId="areaId" :params="params" :instance="instance" :dict="dict" @change="onChange"></GirdDetail>
+</template>
+
+<script>
+  import ResidentDetail from './components/ResidentDetail'
+  import GirdDetail from './components/GirdDetail'
+  import GirdList from './components/GirdList'
+  import ResidentList from './components/ResidentList'
+  import { mapState } from 'vuex'
+
+  export default {
+    name: 'AppIntegratingOrder',
+    label: '订单管理',
+
+    components: {
+      ResidentList,
+      GirdList,
+      ResidentDetail,
+      GirdDetail
+    },
+
+    props: {
+      instance: Function,
+      dict: Object,
+      permissions: Function
+    },
+
+    computed: {
+      ...mapState(['user']),
+
+      hideLevel () {
+        return this.user.info.areaList?.length || 0
+      },
+
+      tabs () {
+        const tabList = [
+          {label: '居民积分订单', name: 'ResidentList', comp: ResidentList, permission: ''},
+          {label: '网格积分订单', name: 'GirdList', comp: GirdList, permission: ''}
+        ].filter(item => {
+          return true
+        })
+
+        return tabList
+      }
+    },
+
+    data () {
+      return {
+        activeName: 'GoodsList',
+        currIndex: '0',
+        componentName: '',
+        params: {},
+        areaName: '',
+        areaId: '',
+        isShowDetail: false
+      }
+    },
+
+    created () {
+      this.areaId = this.user.info.areaId
+    },
+
+    methods: {
+      onAreaChange () {
+        if (this.currIndex != '1') {
+          this.$nextTick(() => {
+            this.$refs[this.currIndex][0].getList()
+          })
+        }
+      },
+
+      onChange (data) {
+        if (data.type === 'GirdList') {
+          this.componentName = 'GirdList'
+          this.isShowDetail = false
+          this.params = data.params
+        }
+        if (data.type === 'ResidentList') {
+          this.componentName = 'ResidentList'
+          this.isShowDetail = false
+          this.params = data.params
+        }
+
+        if (data.type === 'GirdDetail') {
+          this.componentName = 'GirdDetail'
+          this.isShowDetail = true
+          this.params = data.params
+        }
+
+        if (data.type === 'ResidentDetail') {
+          this.componentName = 'ResidentDetail'
+          this.isShowDetail = true
+          this.params = data.params
+        }
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/project/lulong/AppIntegratingOrder/components/GirdDetail.vue b/project/lulong/AppIntegratingOrder/components/GirdDetail.vue
new file mode 100644
index 00000000..166e84f7
--- /dev/null
+++ b/project/lulong/AppIntegratingOrder/components/GirdDetail.vue
@@ -0,0 +1,172 @@
+<template>
+  <ai-detail class="AppDynamicDetail">
+    <template slot="title">
+      <ai-title title="详情" isShowBack isShowBottomBorder @onBackClick="cancel(false)">
+      </ai-title>
+    </template>
+    <template slot="content">
+      <ai-card title="基本信息">
+        <template #right>
+          <el-button type="primary" v-if="info.status === '0'" @click="isShow = true">订单核销</el-button>
+          <el-button type="danger" v-if="info.status === '0' || info.status === '1'" @click="cancelOrder">取消订单</el-button>
+        </template>
+        <template #content>
+          <ai-wrapper
+            label-width="120px">
+            <ai-info-item label="订单编号" :value="info.serialNumber"></ai-info-item>
+            <ai-info-item label="订单状态"  :value="dict.getLabel('integralSGOStatus', info.status)"></ai-info-item>
+            <ai-info-item label="兑换人"  :value="info.integralUserName"></ai-info-item>
+            <ai-info-item label="创建时间" :value="info.createTime"></ai-info-item>
+            <ai-info-item label="备注" :value="info.remarks" isLine></ai-info-item>
+          </ai-wrapper>
+        </template>
+      </ai-card>
+      <ai-card title="操作信息" v-if="info.status === '1'">
+        <template #content>
+          <ai-wrapper
+            label-width="120px">
+            <ai-info-item label="核销人" :value="info.examineUserName"></ai-info-item>
+            <ai-info-item label="时间" :value="info.examineTime"></ai-info-item>
+          </ai-wrapper>
+        </template>
+      </ai-card>
+      <ai-card title="商品信息">
+        <template #content>
+          <ai-table
+            :isShowPagination="false"
+            :tableData="[info]"
+            :col-configs="colConfigs"
+            @getList="() => {}">
+            <el-table-column
+              label="商品"
+              slot="goods"
+              align="left"
+              width="250">
+              <template v-slot="{ row }">
+                <div class="goods">
+                  <ai-uploader
+                    :disabled="true"
+                    :instance="instance"
+                    :value="[{url: row.goodsPicUrl}]"
+                    :limit="1">
+                  </ai-uploader>
+                  <p>{{ row.goodsTitle }}</p>
+                </div>
+              </template>
+            </el-table-column>
+          </ai-table>
+        </template>
+      </ai-card>
+      <ai-dialog
+        title="订单核销"
+        :visible.sync="isShow"
+        :destroyOnClose="true"
+        width="650px"
+        @onConfirm="onConfirm"
+        @close="form.verificationCode = '', id = ''">
+        <el-form style="height: 200px" class="ai-form" ref="form" :model="form" label-width="120px">
+          <el-form-item label="核销码" style="width: 100%" prop="verificationCode" :rules="[{required: true, message: '请输入核销码', trigger: 'blur'}]">
+            <el-input v-model="form.verificationCode" placeholder="请输入核销码" size="small"></el-input>
+          </el-form-item>
+        </el-form>
+      </ai-dialog>
+    </template>
+  </ai-detail>
+</template>
+
+<script>
+  export default {
+    name: 'GirdDetail',
+
+    props: {
+      instance: Function,
+      dict: Object,
+      params: Object
+    },
+
+    data () {
+      return {
+        info: {},
+        isShow: false,
+        id: '',
+        form: {
+          verificationCode: ''
+        },
+        colConfigs: [
+          { prop: 'goodsSerialNumber', label: '商品ID', align: 'left' },
+          { slot: 'goods' },
+          { prop: 'goodsType',  label: '商品类型', align: 'center', format: v => this.dict.getLabel('integralSGType', v) },
+          { prop: 'goodsIntegralPrice', label: '兑换所需积分', align: 'center' },
+          { prop: 'payMoney', label: '兑换后补差价金额', align: 'center' },
+          { prop: 'quantity', label: '数量', align: 'center' },
+          { prop: 'usedIntegral', label: '消耗积分', align: 'center' }
+        ]
+      }
+    },
+
+    created () {
+      if (this.params && this.params.id) {
+        this.id = this.params.id
+        this.getInfo(this.params.id)
+      }
+    },
+
+    methods: {
+      getInfo (id) {
+        this.instance.post(`/app/appintegralsupermarketorder/queryDetailById?id=${id}`).then(res => {
+          if (res.code === 0) {
+            this.info = {
+              ...res.data
+            }
+          }
+        })
+      },
+
+      cancelOrder () {
+        this.$confirm('确定取消该订单吗？').then(() => {
+          this.instance.post(`/app/appintegralsupermarketorder/cancel?id=${this.params.id}`).then(res => {
+            if (res.code == 0) {
+              this.$message.success('取消成功！')
+              this.getInfo(this.params.id)
+            }
+          })
+        })
+      },
+
+      onConfirm () {
+        this.$refs.form.validate((valid)=> {
+          if(valid) {
+            this.instance.post(`/app/appintegralsupermarketorder/examine`, null, {
+              params: {
+                ...this.form,
+                id: this.params.id
+              }
+            }).then(res => {
+              if(res.code == 0) {
+                this.isShow = false
+                this.getInfo(this.params.id)
+                this.$message.success('核销成功')
+              }
+            })
+          }
+        })
+      },
+
+      cancel (isRefresh) {
+        this.$emit('change', {
+          type: 'GirdList',
+          isRefresh: !!isRefresh
+        })
+      }
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .AppDynamicDetail {
+    .goods {
+      display: flex;
+      align-items: center;
+    }
+  }
+</style>
diff --git a/project/lulong/AppIntegratingOrder/components/GirdList.vue b/project/lulong/AppIntegratingOrder/components/GirdList.vue
new file mode 100644
index 00000000..ee551ee0
--- /dev/null
+++ b/project/lulong/AppIntegratingOrder/components/GirdList.vue
@@ -0,0 +1,252 @@
+<template>
+  <ai-list isTabs class="GoodsList">
+    <template slot="content">
+      <ai-search-bar>
+        <template slot="left">
+          <ai-select
+            v-model="search.goodsType"
+            @change="(search.current = 1), getList()"
+            placeholder="请选择商品类型"
+            :selectList="dict.getDict('integralSGType')">
+          </ai-select>
+          <ai-select
+            v-model="search.status"
+            @change="(search.current = 1), getList()"
+            placeholder="请选择订单状态"
+            :selectList="dict.getDict('integralSGOStatus')">
+          </ai-select>
+          <el-date-picker
+            v-model="search.startTime"
+            type="date"
+            size="small"
+            value-format="yyyy-MM-dd"
+            placeholder="选择订单开始日期"
+            @change="search.current = 1, getList()">
+          </el-date-picker>
+          <el-date-picker
+            v-model="search.endTime"
+            type="date"
+            size="small"
+            value-format="yyyy-MM-dd"
+            placeholder="选择订单结束日期"
+            @change="search.current = 1, getList()">
+          </el-date-picker>
+          <ai-download
+            v-if="permissions('app_appintegralsupermarketorder_export')"
+            :instance="instance"
+            url="/app/appintegralsupermarketorder/export"
+            :params="search"
+            fileName="订单列表"
+            :disabled="tableData.length == 0">
+          </ai-download>
+        </template>
+        <template slot="right">
+          <el-input
+            v-model="search.goodsTitle"
+            class="search-input"
+            size="small"
+            v-throttle="() => {search.current = 1, getList()}"
+            placeholder="请输入商品名称、兑换人"
+            clearable
+            @clear="search.current = 1, search.goodsTitle = '', getList()"
+            suffix-icon="iconfont iconSearch">
+          </el-input>
+        </template>
+      </ai-search-bar>
+      <ai-table
+        style="margin-top: 8px;"
+        :tableData="tableData"
+        :col-configs="colConfigs"
+        :total="total"
+        :current.sync="search.current"
+        :size.sync="search.size"
+        @getList="getList">
+        <el-table-column
+          label="商品"
+          slot="goods"
+          align="left"
+          width="350">
+          <template v-slot="{ row }">
+            <div class="goods">
+              <div class="img-content">
+                <img :src="row.goodsPicUrl" alt="" v-viewer>
+
+                <!-- <span class="type type0" v-if="row.goodsType === '0'">积分兑换</span>
+                <span class="type type1" v-else>京东低价商品</span> -->
+                <span class="type" :class="`type${row.typeText}`">{{dict.getLabel('integralSGTypeText', row.typeText)}}</span>
+              </div>
+              <p>{{ row.goodsTitle }}</p>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" slot="options" align="center" width="210" fixed="right">
+          <template v-slot="{ row }">
+            <div class="table-options">
+              <el-button type="text" title="取消订单" v-if="row.status === '0' || row.status === '1'" @click="cancel(row.id)">取消订单</el-button>
+              <el-button type="text" title="订单核销" v-if="row.status === '0'" @click="id = row.id, isShow = true">订单核销</el-button>
+              <el-button type="text" title="详情" @click="toDetail(row.id)">详情</el-button>
+            </div>
+          </template>
+        </el-table-column>
+      </ai-table>
+      <ai-dialog
+        title="订单核销"
+        :visible.sync="isShow"
+        :destroyOnClose="true"
+        width="650px"
+        @onConfirm="onConfirm"
+        @close="form.verificationCode = '', id = ''">
+        <el-form style="height: 200px" class="ai-form" ref="form" :model="form" label-width="120px">
+          <el-form-item label="核销码" style="width: 100%" prop="verificationCode" :rules="[{required: true, message: '请输入核销码', trigger: 'blur'}]">
+            <el-input v-model="form.verificationCode" placeholder="请输入核销码" size="small"></el-input>
+          </el-form-item>
+        </el-form>
+      </ai-dialog>
+    </template>
+  </ai-list>
+</template>
+
+<script>
+  export default {
+    name: 'GirdList',
+
+    props: {
+      instance: Function,
+      dict: Object,
+      permissions: Function
+    },
+
+    data() {
+      return {
+        search: {
+          goodsType: '',
+          goodsTitle: '',
+          current: 1,
+          status: '',
+          size: 10,
+          startTime: '',
+          endTime: '',
+          type: 0
+        },
+        isShow: false,
+        form: {
+          verificationCode: ''
+        },
+        id: '',
+        total: 0,
+        tableData: [],
+        colConfigs: [
+          { prop: 'goodsSerialNumber',  label: '商品ID', align: 'left' },
+          { slot: 'goods', align: 'center' },
+          { prop: 'goodsType',  label: '商品类型', align: 'center', format: v => this.dict.getLabel('integralSGType', v) },
+          { prop: 'quantity',  label: '数量', align: 'center', format: v => `${v}` },
+          { prop: 'usedIntegral',  label: '消耗积分', align: 'center' },
+          { prop: 'payMoney',  label: '兑换后再付', align: 'center' },
+          { prop: 'integralUserName',  label: '兑换人', align: 'center' },
+          { prop: 'createTime', width: 150,  label: '创建时间', align: 'center' },
+          { prop: 'status',  label: '状态', align: 'center', format: v => this.dict.getLabel('integralSGOStatus', v) }
+        ]
+      }
+    },
+
+    computed: {
+    },
+
+    created () {
+      this.dict.load('integralSGType', 'integralSGOStatus', 'integralSGTypeText').then(() => {
+        this.getList()
+      })
+    },
+
+    methods: {
+      getList () {
+        this.instance.post(`/app/appintegralsupermarketorder/list`, null, {
+          params: {
+            ...this.search
+          }
+        }).then((res) => {
+          if (res.code == 0) {
+            res.data.records.map((item) => {
+              item.typeText = item.goodsType == 0 ? 0 : 1
+            })
+            this.tableData = res.data.records
+            this.total = res.data.total
+          }
+        })
+      },
+
+      onConfirm () {
+        this.$refs.form.validate((valid)=> {
+          if(valid) {
+            this.instance.post(`/app/appintegralsupermarketorder/examine`, null, {
+              params: {
+                ...this.form,
+                id: this.id
+              }
+            }).then(res => {
+              if(res.code == 0) {
+                this.isShow = false
+                this.getList()
+                this.$message.success('核销成功')
+              }
+            })
+          }
+        })
+      },
+
+      toDetail (id) {
+        this.$emit('change', {
+          type: 'GirdDetail',
+          params: {
+            id
+          }
+        })
+      },
+
+      cancel (id) {
+        this.$confirm('确定取消该订单吗？').then(() => {
+          this.instance.post(`/app/appintegralsupermarketorder/cancel?id=${id}`).then(res => {
+            if (res.code == 0) {
+              this.$message.success('取消成功！')
+              this.getList()
+            }
+          })
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .GoodsList {
+    .goods {
+      display: flex;
+      align-items: center;
+    }
+    .img-content {
+      position: relative;
+      margin-right: 8px;
+      img {
+        width: 120px;
+        height: 120px;
+        cursor: pointer;
+      }
+    }
+    .type {
+      position: absolute;
+      top: 0;
+      left: 0;
+      font-size: 12px;
+      width: 120px;
+      text-align: center;
+      color: #fff;
+      z-index: 999;
+    }
+    .type1 {
+      background-color: #E64E39;
+    }
+    .type0 {
+      background-color: #FF6900;
+    }
+  }
+</style>
diff --git a/project/lulong/AppIntegratingOrder/components/ResidentDetail.vue b/project/lulong/AppIntegratingOrder/components/ResidentDetail.vue
new file mode 100644
index 00000000..6e9b044c
--- /dev/null
+++ b/project/lulong/AppIntegratingOrder/components/ResidentDetail.vue
@@ -0,0 +1,172 @@
+<template>
+  <ai-detail class="AppDynamicDetail">
+    <template slot="title">
+      <ai-title title="详情" isShowBack isShowBottomBorder @onBackClick="cancel(false)">
+      </ai-title>
+    </template>
+    <template slot="content">
+      <ai-card title="基本信息">
+        <template #right>
+          <el-button type="primary" v-if="info.status === '0'" @click="isShow = true">订单核销</el-button>
+          <el-button type="danger" v-if="info.status === '0' || info.status === '1'" @click="cancelOrder">取消订单</el-button>
+        </template>
+        <template #content>
+          <ai-wrapper
+            label-width="120px">
+            <ai-info-item label="订单编号" :value="info.serialNumber"></ai-info-item>
+            <ai-info-item label="订单状态"  :value="dict.getLabel('integralSGOStatus', info.status)"></ai-info-item>
+            <ai-info-item label="兑换人"  :value="info.integralUserName"></ai-info-item>
+            <ai-info-item label="创建时间" :value="info.createTime"></ai-info-item>
+            <ai-info-item label="备注" :value="info.remarks" isLine></ai-info-item>
+          </ai-wrapper>
+        </template>
+      </ai-card>
+      <ai-card title="操作信息" v-if="info.status === '1'">
+        <template #content>
+          <ai-wrapper
+            label-width="120px">
+            <ai-info-item label="核销人" :value="info.examineUserName"></ai-info-item>
+            <ai-info-item label="时间" :value="info.examineTime"></ai-info-item>
+          </ai-wrapper>
+        </template>
+      </ai-card>
+      <ai-card title="商品信息">
+        <template #content>
+          <ai-table
+            :isShowPagination="false"
+            :tableData="[info]"
+            :col-configs="colConfigs"
+            @getList="() => {}">
+            <el-table-column
+              label="商品"
+              slot="goods"
+              align="left"
+              width="250">
+              <template v-slot="{ row }">
+                <div class="goods">
+                  <ai-uploader
+                    :disabled="true"
+                    :instance="instance"
+                    :value="[{url: row.goodsPicUrl}]"
+                    :limit="1">
+                  </ai-uploader>
+                  <p>{{ row.goodsTitle }}</p>
+                </div>
+              </template>
+            </el-table-column>
+          </ai-table>
+        </template>
+      </ai-card>
+      <ai-dialog
+        title="订单核销"
+        :visible.sync="isShow"
+        :destroyOnClose="true"
+        width="650px"
+        @onConfirm="onConfirm"
+        @close="form.verificationCode = '', id = ''">
+        <el-form style="height: 200px" class="ai-form" ref="form" :model="form" label-width="120px">
+          <el-form-item label="核销码" style="width: 100%" prop="verificationCode" :rules="[{required: true, message: '请输入核销码', trigger: 'blur'}]">
+            <el-input v-model="form.verificationCode" placeholder="请输入核销码" size="small"></el-input>
+          </el-form-item>
+        </el-form>
+      </ai-dialog>
+    </template>
+  </ai-detail>
+</template>
+
+<script>
+  export default {
+    name: 'ResidentDetail',
+
+    props: {
+      instance: Function,
+      dict: Object,
+      params: Object
+    },
+
+    data () {
+      return {
+        info: {},
+        isShow: false,
+        id: '',
+        form: {
+          verificationCode: ''
+        },
+        colConfigs: [
+          { prop: 'goodsSerialNumber', label: '商品ID', align: 'left' },
+          { slot: 'goods' },
+          { prop: 'goodsType',  label: '商品类型', align: 'center', format: v => this.dict.getLabel('integralSGType', v) },
+          { prop: 'goodsIntegralPrice', label: '兑换所需积分', align: 'center' },
+          { prop: 'payMoney', label: '兑换后补差价金额', align: 'center' },
+          { prop: 'quantity', label: '数量', align: 'center' },
+          { prop: 'usedIntegral', label: '消耗积分', align: 'center' }
+        ]
+      }
+    },
+
+    created () {
+      if (this.params && this.params.id) {
+        this.id = this.params.id
+        this.getInfo(this.params.id)
+      }
+    },
+
+    methods: {
+      getInfo (id) {
+        this.instance.post(`/app/appintegralsupermarketorder/queryDetailById?id=${id}`).then(res => {
+          if (res.code === 0) {
+            this.info = {
+              ...res.data
+            }
+          }
+        })
+      },
+
+      cancelOrder () {
+        this.$confirm('确定取消该订单吗？').then(() => {
+          this.instance.post(`/app/appintegralsupermarketorder/cancel?id=${this.params.id}`).then(res => {
+            if (res.code == 0) {
+              this.$message.success('取消成功！')
+              this.getInfo(this.params.id)
+            }
+          })
+        })
+      },
+
+      onConfirm () {
+        this.$refs.form.validate((valid)=> {
+          if(valid) {
+            this.instance.post(`/app/appintegralsupermarketorder/examine`, null, {
+              params: {
+                ...this.form,
+                id: this.params.id
+              }
+            }).then(res => {
+              if(res.code == 0) {
+                this.isShow = false
+                this.getInfo(this.params.id)
+                this.$message.success('核销成功')
+              }
+            })
+          }
+        })
+      },
+
+      cancel (isRefresh) {
+        this.$emit('change', {
+          type: 'ResidentList',
+          isRefresh: !!isRefresh
+        })
+      }
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .AppDynamicDetail {
+    .goods {
+      display: flex;
+      align-items: center;
+    }
+  }
+</style>
diff --git a/project/lulong/AppIntegratingOrder/components/ResidentList.vue b/project/lulong/AppIntegratingOrder/components/ResidentList.vue
new file mode 100644
index 00000000..b9dbe5c8
--- /dev/null
+++ b/project/lulong/AppIntegratingOrder/components/ResidentList.vue
@@ -0,0 +1,265 @@
+<template>
+  <ai-list isTabs class="GoodsList">
+    <template slot="content">
+      <ai-search-bar>
+        <template slot="left">
+          <ai-select
+            v-model="search.goodsType"
+            @change="(search.current = 1), getList()"
+            placeholder="请选择商品类型"
+            :selectList="dict.getDict('integralSGType')">
+          </ai-select>
+          <ai-select
+            v-model="search.status"
+            @change="(search.current = 1), getList()"
+            placeholder="请选择订单状态"
+            :selectList="dict.getDict('integralSGOStatus')">
+          </ai-select>
+          <el-date-picker
+            v-model="search.startTime"
+            type="date"
+            size="small"
+            value-format="yyyy-MM-dd"
+            placeholder="选择订单开始日期"
+            @change="search.current = 1, getList()">
+          </el-date-picker>
+          <el-date-picker
+            v-model="search.endTime"
+            type="date"
+            size="small"
+            value-format="yyyy-MM-dd"
+            placeholder="选择订单结束日期"
+            @change="search.current = 1, getList()">
+          </el-date-picker>
+          <ai-select
+            v-model="search.agentOrder"
+            @change="(search.current = 1), getList()"
+            placeholder="是否代兑换"
+            :selectList="dict.getDict('yesOrNo')">
+          </ai-select>
+          <ai-download
+            v-if="permissions('app_appintegralsupermarketorder_export')"
+            :instance="instance"
+            url="/app/appintegralsupermarketorder/export"
+            :params="search"
+            fileName="订单列表"
+            :disabled="tableData.length == 0">
+          </ai-download>
+        </template>
+        <template slot="right">
+          <el-input
+            v-model="search.goodsTitle"
+            class="search-input"
+            size="small"
+            v-throttle="() => {search.current = 1, getList()}"
+            placeholder="请输入商品名称、兑换人"
+            clearable
+            @clear="search.current = 1, search.goodsTitle = '', getList()"
+            suffix-icon="iconfont iconSearch">
+          </el-input>
+        </template>
+      </ai-search-bar>
+      <ai-table
+        style="margin-top: 8px;"
+        :tableData="tableData"
+        :col-configs="colConfigs"
+        :total="total"
+        :current.sync="search.current"
+        :size.sync="search.size"
+        @getList="getList">
+        <el-table-column
+          label="商品"
+          slot="goods"
+          align="left"
+          width="350">
+          <template v-slot="{ row }">
+            <div class="goods">
+              <div class="img-content">
+                <img :src="row.goodsPicUrl" alt="" v-viewer>
+
+                <!-- <span class="type type0" v-if="row.goodsType === '0'">积分兑换</span>
+                <span class="type type1" v-else>京东低价商品</span> -->
+                <span class="type" :class="`type${row.typeText}`">{{dict.getLabel('integralSGTypeText', row.typeText)}}</span>
+              </div>
+              <p>{{ row.goodsTitle }}</p>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" slot="options" align="center" width="210" fixed="right">
+          <template v-slot="{ row }">
+            <div class="table-options">
+              <el-button type="text" title="取消订单" v-if="row.status === '0' || row.status === '1'" @click="cancel(row.id)">取消订单</el-button>
+              <el-button type="text" title="订单核销" v-if="row.status === '0'" @click="id = row.id, isShow = true">订单核销</el-button>
+              <el-button type="text" title="详情" @click="toDetail(row.id)">详情</el-button>
+            </div>
+          </template>
+        </el-table-column>
+      </ai-table>
+      <ai-dialog
+        title="订单核销"
+        :visible.sync="isShow"
+        :destroyOnClose="true"
+        width="650px"
+        @onConfirm="onConfirm"
+        @close="form.verificationCode = '', id = ''">
+        <el-form style="height: 200px" class="ai-form" ref="form" :model="form" label-width="120px">
+          <el-form-item label="核销码" style="width: 100%" prop="verificationCode" :rules="[{required: true, message: '请输入核销码', trigger: 'blur'}]">
+            <el-input v-model="form.verificationCode" placeholder="请输入核销码" size="small"></el-input>
+          </el-form-item>
+        </el-form>
+      </ai-dialog>
+    </template>
+  </ai-list>
+</template>
+
+<script>
+  import Viewer from 'v-viewer'
+  import Vue from 'vue'
+  Vue.use(Viewer)
+  export default {
+    name: 'ResidentList',
+
+    props: {
+      instance: Function,
+      dict: Object,
+      permissions: Function,
+      areaId: String,
+    },
+
+    data() {
+      return {
+        search: {
+          goodsType: '',
+          goodsTitle: '',
+          current: 1,
+          status: '',
+          size: 10,
+          startTime: '',
+          type: 1,
+          endTime: '',
+          agentOrder: ''
+        },
+        isShow: false,
+        form: {
+          verificationCode: ''
+        },
+        id: '',
+        total: 0,
+        tableData: [],
+        colConfigs: [
+          { prop: 'goodsSerialNumber',  label: '商品ID', align: 'left' },
+          { slot: 'goods', align: 'center' },
+          { prop: 'goodsType',  label: '商品类型', align: 'center', format: v => this.dict.getLabel('integralSGType', v) },
+          { prop: 'quantity',  label: '数量', align: 'center', format: v => `${v}` },
+          { prop: 'usedIntegral',  label: '消耗积分', align: 'center' },
+          { prop: 'payMoney',  label: '兑换后再付', align: 'center' },
+          { prop: 'integralUserName',  label: '兑换人', align: 'center' },
+          { prop: 'agentOrder',  label: '是否代兑换', align: 'center', format: v => this.dict.getLabel('yesOrNo', v) },
+          { prop: 'createTime', width: 150,  label: '创建时间', align: 'center' },
+          { prop: 'status',  label: '状态', align: 'center', format: v => this.dict.getLabel('integralSGOStatus', v) }
+        ]
+      }
+    },
+
+    computed: {
+    },
+
+    created () {
+      this.dict.load('integralSGType', 'integralSGOStatus', 'yesOrNo', 'integralSGTypeText').then(() => {
+        this.getList()
+      })
+    },
+
+    methods: {
+      getList () {
+        this.instance.post(`/app/appintegralsupermarketorder/list`, null, {
+          params: {
+            ...this.search,
+            girdCode: this.areaId
+          }
+        }).then((res) => {
+          if (res.code == 0) {
+            res.data.records.map((item) => {
+              item.typeText = item.goodsType == 0 ? 0 : 1
+            })
+            this.tableData = res.data.records
+            this.total = res.data.total
+          }
+        })
+      },
+
+      onConfirm () {
+        this.$refs.form.validate((valid)=> {
+          if(valid) {
+            this.instance.post(`/app/appintegralsupermarketorder/examine`, null, {
+              params: {
+                ...this.form,
+                id: this.id
+              }
+            }).then(res => {
+              if(res.code == 0) {
+                this.isShow = false
+                this.getList()
+                this.$message.success('核销成功')
+              }
+            })
+          }
+        })
+      },
+
+      toDetail (id) {
+        this.$emit('change', {
+          type: 'ResidentDetail',
+          params: {
+            id
+          }
+        })
+      },
+
+      cancel (id) {
+        this.$confirm('确定取消该订单吗？').then(() => {
+          this.instance.post(`/app/appintegralsupermarketorder/cancel?id=${id}`).then(res => {
+            if (res.code == 0) {
+              this.$message.success('取消成功！')
+              this.getList()
+            }
+          })
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .GoodsList {
+    .goods {
+      display: flex;
+      align-items: center;
+    }
+    .img-content {
+      position: relative;
+      margin-right: 8px;
+      img {
+        width: 120px;
+        height: 120px;
+        cursor: pointer;
+      }
+    }
+    .type {
+      position: absolute;
+      top: 0;
+      left: 0;
+      font-size: 12px;
+      width: 120px;
+      text-align: center;
+      color: #fff;
+      z-index: 999;
+    }
+    .type1 {
+      background-color: #E64E39;
+    }
+    .type0 {
+      background-color: #FF6900;
+    }
+  }
+</style>