Swift
129 lines
3.7 KiB
Vue
129 lines
3.7 KiB
Vue
<template>
|
|
<div>
|
|
<CustomSubHeader>
|
|
<CBreadcrumb class="border-0 mb-0">{{ title }}</CBreadcrumb>
|
|
</CustomSubHeader>
|
|
|
|
<CCard>
|
|
<CCardHeader>
|
|
<slot name="header">
|
|
<i class="fas fa-filter"></i>
|
|
<b>فیلتر ها</b>
|
|
</slot>
|
|
</CCardHeader>
|
|
|
|
<CCardBody>
|
|
<CRow>
|
|
<CCol sm="12">
|
|
<h4>جستجو در لیست:</h4>
|
|
<el-input
|
|
v-model="filterText"
|
|
clearable
|
|
placeholder="کد نماینده - شماره موبایل - استان - شهر"
|
|
style="display: inline-block; max-width: 500px; margin-top: 8px"
|
|
></el-input>
|
|
</CCol>
|
|
</CRow>
|
|
</CCardBody>
|
|
</CCard>
|
|
|
|
<CCard>
|
|
<CCardHeader>
|
|
<slot name="header">
|
|
<CIcon name="cil-grid" />
|
|
{{ list_title }}
|
|
</slot>
|
|
</CCardHeader>
|
|
|
|
<CCardBody>
|
|
<el-table
|
|
:data="filteredItems"
|
|
:row-class-name="({ row, rowIndex }) => !row.seen && 'unread'"
|
|
style="width: 100%"
|
|
>
|
|
<el-table-column type="index" label="#"> </el-table-column>
|
|
|
|
<el-table-column prop="trackingCode" label="کد پیگیری" width=""> </el-table-column>
|
|
|
|
<el-table-column prop="description" label="توضیحات" width=""> </el-table-column>
|
|
|
|
<el-table-column prop="agent_id.full_name" label="نام" width=""> </el-table-column>
|
|
|
|
<el-table-column prop="agent_id.mobile_number" label="شماره موبایل" width=""> </el-table-column>
|
|
|
|
<el-table-column prop="agent_id.agent_code" label="کد نماینده" width=""> </el-table-column>
|
|
|
|
<el-table-column prop="agent_id.province_name" label="استان" width=""> </el-table-column>
|
|
|
|
<el-table-column prop="agent_id.city_name" label="شهر" width=""> </el-table-column>
|
|
|
|
<el-table-column label="مشاهده" width="70" align="center">
|
|
<template slot-scope="scope">
|
|
<CButton
|
|
:key="scope.row._id"
|
|
color="success"
|
|
variant="outline"
|
|
:to="{ name: 'admin-guarantee-reports-grId', params: { grId: scope.row._id } }"
|
|
>
|
|
<i class="fal fa-eye"></i>
|
|
</CButton>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</CCardBody>
|
|
</CCard>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'AdminGuaranteeReportsList',
|
|
layout: 'admin',
|
|
async asyncData({ $axios, error }) {
|
|
try {
|
|
const grList = await $axios.get('/api/admin/grList')
|
|
return {
|
|
grList: grList.data
|
|
}
|
|
} catch (err) {
|
|
error({ status: 404, message: 'There is a problem here' })
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
title: 'لیست گزارش عملکرد گارانتی نمایندگان',
|
|
list_title: 'لیست',
|
|
grList: null,
|
|
filterText: ''
|
|
}
|
|
},
|
|
head() {
|
|
return {
|
|
title: this.title
|
|
}
|
|
},
|
|
computed: {
|
|
filteredItems() {
|
|
const filterText = this.filterText.toLowerCase()
|
|
if (!filterText.length) return this.grList
|
|
else
|
|
return this.grList.filter(item => {
|
|
return (
|
|
item.agent_id.agent_code.toLowerCase().includes(filterText) ||
|
|
item.agent_id.full_name.toLowerCase().includes(filterText) ||
|
|
item.agent_id.mobile_number.toLowerCase().includes(filterText) ||
|
|
item.agent_id.province_name.toLowerCase().includes(filterText) ||
|
|
item.agent_id.city_name.toLowerCase().includes(filterText)
|
|
)
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scopped lang="scss">
|
|
.unread {
|
|
background: rgba(orange, 0.1) !important;
|
|
}
|
|
</style>
|