|
@@ -9,17 +9,80 @@
|
|
|
:modal-append-to-body="false"
|
|
|
:append-to-body="true"
|
|
|
>
|
|
|
- <div v-if="showDialog" style="height: 60vh">
|
|
|
- <template-page
|
|
|
- ref="pageRefTable"
|
|
|
- :pofx="true"
|
|
|
- :get-list="getList"
|
|
|
- :column-parsing="columnParsing"
|
|
|
- :operation-column-width="200"
|
|
|
- :table-attributes="tableAttributes"
|
|
|
- :table-events="tableEvents"
|
|
|
- :replace-or-not-map="false"
|
|
|
- />
|
|
|
+ <div v-if="showDialog">
|
|
|
+ <div>
|
|
|
+ <el-form ref="searchForm" :model="searchForm" label-width="100px" size="mini" label-position="left">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :xs="24" :sm="12" :lg="6">
|
|
|
+ <el-form-item label="项目编号" prop="project_no">
|
|
|
+ <el-input v-model="searchForm.project_no" placeholder="请输入" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :lg="6">
|
|
|
+ <el-form-item label="工程项目名称" prop="project_name">
|
|
|
+ <el-input v-model="searchForm.project_name" placeholder="请输入" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :lg="6">
|
|
|
+ <el-form-item label="经销商名称" prop="customer_name">
|
|
|
+ <el-input v-model="searchForm.customer_name" placeholder="请输入" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :lg="6">
|
|
|
+ <el-form-item label="业务员" prop="service_name">
|
|
|
+ <el-input v-model="searchForm.service_name" placeholder="请输入" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :lg="6">
|
|
|
+ <el-form-item label="工程类型" prop="order_type">
|
|
|
+ <el-select v-model="searchForm.order_type" clearable placeholder="请选择">
|
|
|
+ <el-option
|
|
|
+ v-for="(key,value) in orderType"
|
|
|
+ :key="key"
|
|
|
+ :label="key"
|
|
|
+ :value="value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :lg="18">
|
|
|
+ <div class="fr">
|
|
|
+ <el-button type="primary" size="mini" @click="getList">搜索</el-button>
|
|
|
+ <el-button type="primary" size="mini" @click="handleClear">清空</el-button>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <!-- 列表 -->
|
|
|
+
|
|
|
+ <div class="mymain-container">
|
|
|
+ <zj-table
|
|
|
+ ref="table"
|
|
|
+ :table-attributes="{
|
|
|
+ height: 400,
|
|
|
+ ...tableAttributes, selectColumn: true
|
|
|
+ }"
|
|
|
+ :table-events="tableEvents"
|
|
|
+ :is-drop="true"
|
|
|
+ :columns="columns"
|
|
|
+ :table-data="dataList"
|
|
|
+ />
|
|
|
+
|
|
|
+ <div class="pagination clearfix" style="margin-top: 20px">
|
|
|
+ <div class="fr">
|
|
|
+ <el-pagination
|
|
|
+ :current-page="currentPage"
|
|
|
+ :page-sizes="[10, 20, 30, 50]"
|
|
|
+ :page-size="10"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ :total="listTotal"
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
<el-button size="mini" @click="cancel">取 消</el-button>
|
|
@@ -29,15 +92,10 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import TemplatePage from '@/components/template/template-page-1.vue'
|
|
|
-import { getLoginHomeDecorationList } from '@/api/homeDecoration'
|
|
|
import { getLoginCrossDistrictList } from '@/api/crossDistrict'
|
|
|
-import { getLoginFrockList } from '@/api/frock'
|
|
|
import { getLoginList } from '@/api/summaryTable'
|
|
|
|
|
|
export default {
|
|
|
- components: { TemplatePage },
|
|
|
- mixins: [],
|
|
|
props: {
|
|
|
pageType: {
|
|
|
type: String,
|
|
@@ -54,32 +112,105 @@ export default {
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
- // 表格属性
|
|
|
- tableAttributes: {
|
|
|
- // 启用勾选列
|
|
|
- selectColumn: true,
|
|
|
- selectable: this.selectable
|
|
|
+ orderType: {
|
|
|
+ WORK: '工装',
|
|
|
+ HOME: '家装'
|
|
|
+ },
|
|
|
+ statusType: {
|
|
|
+ ING: '跟进中',
|
|
|
+ LOSS: '已丢单',
|
|
|
+ SIGN: '签订合同'
|
|
|
},
|
|
|
- // 表格事件
|
|
|
+ currentPage: 1, // 当前页码
|
|
|
+ pageSize: 15, // 每页数量
|
|
|
+ recordSelected: [],
|
|
|
+ searchForm: {
|
|
|
+ project_no: '',
|
|
|
+ project_name: '',
|
|
|
+ customer_name: '',
|
|
|
+ service_name: '',
|
|
|
+ order_type: ''
|
|
|
+ },
|
|
|
+ dataList: [],
|
|
|
+ listLoading: false,
|
|
|
+ listTotal: 0,
|
|
|
+ tableAttributes: { selectable: this.selectable },
|
|
|
tableEvents: {
|
|
|
'selection-change': this.selectionChange,
|
|
|
select: (selection, row) => {
|
|
|
- this.$refs.pageRefTable.$refs.zjpage.$refs.tableEl.$refs.tableView.clearSelection()
|
|
|
- this.$refs.pageRefTable.$refs.zjpage.$refs.tableEl.$refs.tableView.toggleRowSelection(row)
|
|
|
+ this.$refs.table.$refs.tableView.clearSelection()
|
|
|
+ this.$refs.table.$refs.tableView.toggleRowSelection(row)
|
|
|
}
|
|
|
- },
|
|
|
- recordSelected: []
|
|
|
+
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
- computed: {},
|
|
|
- watch: {
|
|
|
- showDialog: {
|
|
|
- handler(nl, ol) {
|
|
|
- // console.log(this.pageType, this.formData, 9999)
|
|
|
- }
|
|
|
+ computed: {
|
|
|
+ columns() {
|
|
|
+ return [
|
|
|
+ {
|
|
|
+ columnAttributes: {
|
|
|
+ label: '项目编号',
|
|
|
+ prop: 'projectNo'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ columnAttributes: {
|
|
|
+ label: '工程项目名称',
|
|
|
+ prop: 'projectName',
|
|
|
+ width: 200
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ columnAttributes: {
|
|
|
+ label: '经销商名称',
|
|
|
+ prop: 'customerName',
|
|
|
+ minWidth: 200
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // columnAttributes: {
|
|
|
+ // label: '经销商编号',
|
|
|
+ // prop: 'customerNumber'
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ {
|
|
|
+ columnAttributes: {
|
|
|
+ label: '业务员',
|
|
|
+ prop: 'serviceName'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ columnAttributes: {
|
|
|
+ label: '工程类型',
|
|
|
+ prop: ''
|
|
|
+ },
|
|
|
+ render: (h, { column, row, index }) => {
|
|
|
+ return (
|
|
|
+ <div style="margin:0 10px">
|
|
|
+ {this.orderType[row.orderType] || row.orderType}
|
|
|
+ </div>
|
|
|
+ )
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // {
|
|
|
+ // columnAttributes: {
|
|
|
+ // label: '跟进状态',
|
|
|
+ // prop: ''
|
|
|
+ // },
|
|
|
+ // render: (h, { column, row, index }) => {
|
|
|
+ // return (
|
|
|
+ // <div style="margin:0 10px">
|
|
|
+ // {this.statusType[row.status] || row.status}
|
|
|
+ // </div>
|
|
|
+ // )
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ ]
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
+ this.getList()
|
|
|
},
|
|
|
methods: {
|
|
|
selectable(row, index) {
|
|
@@ -89,26 +220,50 @@ export default {
|
|
|
return true
|
|
|
}
|
|
|
},
|
|
|
- // 表格列解析渲染数据更改
|
|
|
- columnParsing(item, defaultData) {
|
|
|
- return defaultData
|
|
|
- },
|
|
|
// 监听勾选变化
|
|
|
selectionChange(data) {
|
|
|
this.recordSelected = data
|
|
|
},
|
|
|
- getList(...p) {
|
|
|
+ getList() {
|
|
|
this.recordSelected = []
|
|
|
- p[0].params = [...p[0].params, { param: 'a.order_status', compare: '=', value: 'OK' }, {
|
|
|
- param: 'a.is_span',
|
|
|
- compare: '=',
|
|
|
- value: ['home', 'frock'].includes(this.pageType)? 0 : 1
|
|
|
- }]
|
|
|
-
|
|
|
- if (this.pageType === 'cross') {
|
|
|
- return getLoginCrossDistrictList(...p)
|
|
|
+ const params = {
|
|
|
+ pageSize: this.pageSize,
|
|
|
+ pageNum: this.currentPage,
|
|
|
+ params: [{ param: 'a.order_status', compare: '=', value: 'OK' }, {
|
|
|
+ param: 'a.is_span',
|
|
|
+ compare: '=',
|
|
|
+ value: ['home', 'frock'].includes(this.pageType) ? 0 : 1
|
|
|
+ }]
|
|
|
+ }
|
|
|
+ for (const key in this.searchForm) {
|
|
|
+ if (this.searchForm[key]) {
|
|
|
+ params.params.push(
|
|
|
+ { param: `a.${key}`, compare: '=', value: this.searchForm[key] }
|
|
|
+ )
|
|
|
+ }
|
|
|
}
|
|
|
- return getLoginList(...p)
|
|
|
+ const fn = {
|
|
|
+ 1: getLoginCrossDistrictList,
|
|
|
+ 2: getLoginList
|
|
|
+ }
|
|
|
+ fn[this.pageType === 'cross' ? 1 : 2](params).then(res => {
|
|
|
+ this.dataList = res.data.records
|
|
|
+ this.listTotal = res.data.total
|
|
|
+ }).finally(() => {
|
|
|
+ this.listLoading = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 更改每页数量
|
|
|
+ handleSizeChange(val) {
|
|
|
+ this.pageSize = val
|
|
|
+ this.currentPage = 1
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+
|
|
|
+ // 更改当前页
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.currentPage = val
|
|
|
+ this.getList()
|
|
|
},
|
|
|
cancel() {
|
|
|
this.$emit('cancel')
|
|
@@ -116,9 +271,24 @@ export default {
|
|
|
confirm() {
|
|
|
this.$emit('success', this.recordSelected)
|
|
|
this.cancel()
|
|
|
+ },
|
|
|
+ handleClear() {
|
|
|
+ this.searchForm = {
|
|
|
+ project_no: '',
|
|
|
+ project_name: '',
|
|
|
+ customer_name: '',
|
|
|
+ service_name: '',
|
|
|
+ order_type: ''
|
|
|
+ }
|
|
|
+ this.getList()
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style scoped></style>
|
|
|
+<style scoped lang="scss">
|
|
|
+::v-deep .el-table th.el-table__cell .el-checkbox__input {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+</style>
|