123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105 |
- <template>
- <div class="container normal-panel">
- <p class="normal-title normal-margin">经销商信息</p>
- <div class="flex-align-center flex-between normal-margin">
- <!-- <el-input style="width:270px" placeholder="请输入内容" v-model="param.content.where.condition" class="input-with-select" size="small" clearable>
- <el-button slot="append" icon="el-icon-search" @click="query_agent(param.content.sa_saleareaid)">查 询</el-button>
- </el-input> -->
- <div class="flex-align-center search-panel">
- <p>搜索:</p>
- <el-input style="width:200px" size="small" placeholder="请输入查询内容" @keyup.native.enter="query_agent(param.content.sa_saleareaids[0])" @clear="(param.content.where.condition = '',query_agent(param.content.sa_saleareaids[0]))" v-model="param.content.where.condition" prefix-icon="el-icon-search" clearable></el-input>
- </div>
- <slot name="add"></slot>
- </div>
- <tableLayout :layout="tablecols" :data="list" :custom="true" height="calc(100vh - 495px)">
- <template v-slot:customcol="scope">
-
- <p v-if="scope.column.columnname === 'status'">
- <span :style="scope.column.data.status === '启用'?'color:#52C41A':'color:#FF3B30'">{{scope.column.data.status}}</span>
- </p>
- <p v-else-if="scope.column.columnname === 'province'">
- <span>{{scope.column.data.province}} - {{scope.column.data.city}} - {{scope.column.data.county}}</span>
- </p>
- <p v-else>{{scope.column.data[scope.column.columnname]}}</p>
- </template>
- <template v-slot:opreation="scope">
- <slot name="detail" :data="scope.data"></slot>
- <slot name="edit" :data="scope.data"></slot>
- <slot name="start" :data="scope.data"></slot>
- <slot name="del" :data="scope.data"></slot>
- </template>
- </tableLayout>
- <div style="margin-top:16px;text-align:right">
- <el-pagination
- background
- small
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- :current-page="currentPage"
- :page-size="param.content.pageSize"
- layout="total, prev, pager, next, jumper"
- :total="total">
- </el-pagination>
- </div>
- </div>
- </template>
- <script>
- export default {
- props:['data'],
- data () {
- return {
- tablecols:[],
- list:[],
- total:0,
- currentPage:1,
- param:{
- "classname": "webmanage.sale.salearea.salearea",
- "method": "query_agent",
- "content": {
- "pageSize":20,
- "pageNumber":1,
- "sa_saleareaids":'',
- "containssub": 1,
- "where":{}
- }
- }
- }
- },
- methods:{
- async query_agent (sa_saleareaid) {
- this.param.content.sa_saleareaids = [sa_saleareaid]
- const res = await this.$api.requested(this.param)
- this.list = res.data
- this.total = res.total
- this.currentPage = res.pageNumber
- },
- handleSizeChange(val) {
- // console.log(`每页 ${val} 条`);
- this.param.content.pageSize = val
- this.query_agent(this.param.content.sa_saleareaids[0])
- },
- handleCurrentChange(val) {
- // console.log(`当前页: ${val}`);
- this.param.content.pageNumber = val
- this.query_agent(this.param.content.sa_saleareaids[0])
- }
- },
- mounted () {
- // this.query_agent()
- },
- created () {
- // 获取表结构
- this.tablecols = this.tool.tabelCol(this.$route.name)['agentTable'].tablecols
- }
- }
- </script>
- <style>
- </style>
- <style scoped>
- .search-panel p{
- width:40px;
- font-size:14px
- }
- </style>
|