gjj
2023-02-07 08690e2fd123a710406a101a2a5bd98fa0992502
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
<template>
  <div
    v-empty="nopermission"
    class="rc-cont"
    xs-empty-icon="nopermission"
    xs-empty-text="暂无权限">
    <flexbox
      v-if="!isSeas"
      class="rc-head"
      direction="row-reverse">
      <!--<el-button
        class="rc-head-item"
        type="primary"
        @click.native="createClick">新建待办事项
      </el-button> -->
    </flexbox>
    <el-table
      :data="list"
      :height="tableHeight"
      :header-cell-style="headerRowStyle"
      :cell-style="cellStyle"
      style="width: 100%;border: 1px solid #E6E6E6;"
      @row-click="handleRowClick">
      <el-table-column
        v-for="(item, index) in fieldList"
        :key="index"
        :prop="item.prop"
        :formatter="fieldFormatter"
        :label="item.label"
        show-overflow-tooltip/>
    </el-table>
    <div class="p-contianer" v-show='total>0'>
        <el-pagination
          :current-page="currentPage"
          :page-sizes="pageSizes"
          :page-size.sync="pageSize"
          :total="total"
          class="p-bar"
          layout="total, sizes, prev, pager, next, jumper"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"/>
      </div>
 
    <c-r-m-full-screen-detail
      :visible.sync="showFullDetail"
      :id="contractId"
      crm-type="contract"/>
    <c-r-m-create-view
      v-if="isCreate"
      :action="createActionInfo"
      crm-type="contract"
      @save-success="createSaveSuccess"
      @hiden-view="isCreate=false"/>
  </div>
</template>
 
<script type="text/javascript">
import loading from '../mixins/loading'
import CRMCreateView from './CRMCreateView'
import { GetCustomerOrderList } from '@/api/customermanagement/customerManage'
import { GetSalesChanceJobScheduleList } from '@/api/customermanagement/business'
// import { moneyFormat } from '@/utils'
 
export default {
  name: 'RelativeSchedule', // 相关报价  可能再很多地方展示 放到客户管理目录下
  components: {
    CRMFullScreenDetail: () => import('./CRMFullScreenDetail.vue'),
    CRMCreateView
  },
  mixins: [loading],
  props: {
    /** 模块ID */
    id: [String, Number],
    /** 没有值就是全部类型 有值就是当个类型 */
    crmType: {
      type: String,
      default: ''
    },
    /** 是公海 默认是客户 */
    isSeas: {
      type: Boolean,
      default: false
    },
    /** 联系人人下 新建商机 需要联系人里的客户信息  合同下需要客户和商机信息 */
    detail: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  data () {
    return {
      nopermission: false,
      list: [],
      fieldList: [],
      tableHeight: '400px',
      showFullDetail: false,
      isCreate: false, // 控制新建
      contractId: '', // 查看全屏联系人详情的 ID
      // 创建的相关信息
      createActionInfo: { type: 'relative', crmType: this.crmType, data: {} },
      total: 0,
      currentPage: 1,
      pageSize: 10,
      pageSizes: [10, 30, 60, 100]
    }
  },
  computed: {},
  watch: {
    id: function (val) {
      this.list = []
      this.getDetail()
    }
  },
  mounted () {
    this.getDetail()
  },
  activated: function () {},
  deactivated: function () {},
  methods: {
    handleSizeChange (newSize) {
      this.pageSize = newSize
      this.getDetail()
    },
    handleCurrentChange (newPage) {
      this.currentPage = newPage
      this.getDetail()
    },
    /** 格式化字段 */
    fieldFormatter (row, column) {
      var aRules = this.formatterRules[column.property]
      if (aRules) {
        return aRules.formatter(row[column.property])
      }
      if (column.property === 'Sex') {
        return { 1: '男', 2: '女' }[row.Sex]
      } else if (column.property === 'IsCustomerDefault') {
        return { true: '是', false: '否' }[row.IsCustomerDefault]
      } else if (column.property === 'CompanyType') {
        return {0: '暂无', 1: '国企', 2: '外企', 3: '民营', 4: '其他'}[row.CompanyType]
      } else if (column.property === 'IsCompleted') {
        return this.getSwitch(row.IsCompleted)
      }
      // 如果需要格式化
      return row[column.property] || '--'
    },
    getFieldList () {
      this.fieldList.push(
        { prop: 'Content', label: '内容', width: '200' },
        { prop: 'PlanTime', label: '计划时间', width: '200' },
        { prop: 'CustomerName', label: '关联客户名称', width: '200' },
        { prop: 'ContacterName', label: '关联联系人', width: '200' },
        { prop: 'ContacterMobilePhone', label: '关联联系人方式', width: '100' },
        { prop: 'IsCompleted', label: '是否完成', width: '200' }
      )
    },
    getDetail () {
      this.loading = true
      const request = {
        customer: GetCustomerOrderList,
        business: GetSalesChanceJobScheduleList
      }[this.crmType]
      const params = {}
      params['Id'] = this.id
      params['PageSize'] = this.pageSize
      params['PageIndex'] = this.currentPage
      request(params)
        .then(res => {
          if (this.fieldList.length === 0) {
            this.getFieldList()
          }
          this.nopermission = false
          this.loading = false
          this.list = res.data.Result.List
          this.total = res.data.Result.Count
        })
        .catch(data => {
          if (data.code === 102) {
            this.nopermission = true
          }
          this.loading = false
        })
    },
 
    /**
     * 对应的状态名
     */
    getSwitch (type) {
      console.log(type)
      if (type === false) {
        return '否'
      } else if (type === true) {
        return '是'
      }
      return '暂无'
    },
    // 当某一行被点击时会触发该事件
    handleRowClick (row, column, event) {
      // this.contractId = row.contractId
      // this.showFullDetail = true
    },
    /** 通过回调控制表头style */
    headerRowStyle ({ row, column, rowIndex, columnIndex }) {
      return { textAlign: 'left' }
    },
    /** 通过回调控制style */
    cellStyle ({ row, column, rowIndex, columnIndex }) {
      return { textAlign: 'left' }
    },
    /** 新建 */
    createClick () {
      /** 客户 和 商机 下新建合同 */
      if (this.crmType === 'business') {
        this.createActionInfo.data['customer'] = this.detail
        this.createActionInfo.data['business'] = this.detail
      } else if (this.crmType === 'customer') {
        this.createActionInfo.data['customer'] = this.detail
      }
      this.isCreate = true
    },
    createSaveSuccess () {
      this.getDetail()
    }
  }
}
</script>
<style lang="scss" scoped>
@import '../styles/relativecrm.scss';
</style>