cloudroam
2025-03-28 cef2bb0eeeb91a22860cf5d23c7348af1ba921dc
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
<template>
  <el-bus-crud v-bind="tableConfig" />
</template>
 
<script>
export default {
  data() {
    return {
      tableConfig: {
        url: 'flower/api/transport/fee/list',
        hasPagination: false,
        dialogNeedRequest: true,
        operationAttrs: {
          width: 150,
          fixed: 'right',
        },
        columns: [
          { label: '运费配置类型', prop: 'typeStr', minWidth: 100 },
          { label: '首重(kg)', prop: 'firstWeight', minWidth: 100 },
          { label: '首重起步价(元)', prop: 'firstWeightFee', minWidth: 100 },
          { label: '续重(kg)', prop: 'addedWeight', minWidth: 100 },
          { label: '续重价(元)', prop: 'addedWeightFee', minWidth: 100 },
          {
            label: '地区',
            formatter: (row) => this.formatDistrict(row),
            minWidth: 400,
          },
        ],
        extraQuery: {
          id: this.$route.params.id,
        },
        extraBody: {
          transportId: this.$route.params.id,
        },
        form: [
          {
            type: 'row',
            span: 12,
            items: [
              {
                label: '运费配置类型:',
                id: 'type',
                type: 'bus-radio',
                el: {
                  code: 'freight_template_type',
                  style: 'width:100%',
                },
                default: '0',
                str: true,
                rules: { required: true, message: '请选择运费配置类型' },
                on: {
                  change: (e, updateForm) => {
 
                  },
                },
              },
              {
                label: '首重:',
                id: 'firstWeight',
                type: 'input-number',
                el: {
                  precision: 2,
                  min: 0,
                  controls: false,
                },
                unit: 'kg',
                rules: {
                  required: true,
                  message: '请输入首重',
                  trigger: 'blur',
                },
                hidden: (row) => row.type !== '0',
              },
              {
                label: '首重起步价:',
                id: 'firstWeightFee',
                type: 'input-number',
                el: {
                  precision: 2,
                  min: 0,
                  controls: false,
                },
                unit: '元',
                rules: {
                  required: true,
                  message: '请输入首重起步价',
                  trigger: 'blur',
                },
                hidden: (row) => row.type !== '0',
              },
              {
                label: '续重:',
                id: 'addedWeight',
                type: 'input-number',
                el: {
                  precision: 2,
                  min: 0,
                  controls: false,
                },
                unit: 'kg',
                rules: {
                  required: true,
                  message: '请输入续重',
                  trigger: 'blur',
                },
                hidden: (row) => row.type !== '0',
              },
              {
                label: '续重价:',
                id: 'addedWeightFee',
                type: 'input-number',
                el: {
                  precision: 2,
                  min: 0,
                  controls: false,
                },
                unit: '元',
                rules: {
                  required: true,
                  message: '请输入续重价',
                  trigger: 'blur',
                },
                hidden: (row) => row.type !== '0',
              },
              {
                label: '地区:',
                id: 'areas',
                component: 'area-select',
                span: 24,
                forceDisabled: true,
                rules: {
                  required: true,
                  message: '请选择地区',
                },
                hidden: (row) => row.type !== '0',
              },
            ],
          },
        ],
      },
    }
  },
  head() {
    return {
      title: '运费配置',
    }
  },
  methods: {
    formatDistrict(row) {
      if (Array.isArray(row.areas) && row.areas.length > 0) {
        return (
          <div>
            {row.areas.slice(0, 5).map((item) => {
              return (
                <el-tag type="primary" class="mr-4 mb-4">
                  {item.province}-{item.city}
                </el-tag>
              )
            })}
            {row.areas.length > 5 ? (
              <el-tooltip
                placement="top"
                popper-class="freight-popper"
                content={row.areas
                  .map((i) => `${i.province}-${i.city}`)
                  .join(',')}
              >
                <span class="text-primary">查看更多</span>
              </el-tooltip>
            ) : null}
          </div>
        )
      }
      return ''
    },
  },
}
</script>
 
<style>
.freight-popper {
  max-width: 60%;
}
</style>