投诉配置页面构建,接口对接

src/port/set-request.js

@@ -262,7 +262,7 @@ export function getAllOpenArea(platformId) {
 
 /* 查询平台所有运力 */
 export function getAllTransport(data, u) {
-    const url = (u ? u+'/brand' : targetBaseUrl) + '/transport'
+    const url = (u ? u + '/brand' : targetBaseUrl) + '/transport'
     return get(url, data)
 }
 
@@ -274,7 +274,7 @@ export function getAllAreaProducts(data) {
 
 /* 查询当前区域开通的所有产品（按条件查询）(新) */
 export function getAllTripProduct(data, u) {
-    const url = (u ? u+'/brand' : targetBaseUrl) + '/tripProduct/list'
+    const url = (u ? u + '/brand' : targetBaseUrl) + '/tripProduct/list'
     return post(url, data)
 }
 
@@ -394,19 +394,19 @@ export function getYunCubicProductData1(data) {
 
 /* 多条件查询订单列表 */
 export function getAllOrderList(data, u, platformId) {
-    const url = (u ? u+'/brand' : targetBaseUrl) + '/xoado/order/query'
+    const url = (u ? u + '/brand' : targetBaseUrl) + '/xoado/order/query'
     return post(url, data, platformId)
 }
 
 /* 多条件查询订单列表 */
 export function getThisorderInfo(data, u, platformId) {
-    const url = (u ? u+'/brand' : targetBaseUrl) + '/xoado/order/select'
+    const url = (u ? u + '/brand' : targetBaseUrl) + '/xoado/order/select'
     return post(url, data, platformId)
 }
 
 /* 多条件导出订单列表 */
 export function exportAllOrderList(data, u, platformId) {
-    const url = (u ? u+'/brand' : targetBaseUrl) + '/xoado/order/export'
+    const url = (u ? u + '/brand' : targetBaseUrl) + '/xoado/order/export'
     return postblob(url, data, platformId)
 }
 
@@ -622,7 +622,7 @@ export function SeachfenceInfo(data) {
 
 /* 计算器计价 */
 export function calculatorPrice(data, platformId, u) {
-    const url = (u ? u+'/brand' : process.env.VUE_APP_BASE_API5) + `/xoadoTripProduct/calculator/${platformId}`
+    const url = (u ? u + '/brand' : process.env.VUE_APP_BASE_API5) + `/xoadoTripProduct/calculator/${platformId}`
     return post(url, data)
 }
 
@@ -1131,3 +1131,26 @@ export function getplatformList() {
     const url = targetBaseUrl5 + `/platform/infos`
     return get(url)
 }
+
+
+/* 投诉原因---列表查询 */
+export function conditionList(data) {
+    const url = targetBaseUrl5 + `/complaint/label/condition`
+    return post(url, data)
+}
+
+/* 投诉原因---列表删除 */
+export function delconditionList(data) {
+    const url = targetBaseUrl5 + `/complaint/label`
+    return deletes(url, data)
+}
+/* 投诉原因---新增 */
+export function complaintAdd(data) {
+    const url = targetBaseUrl5 + `/complaint/label`
+    return post(url, data)
+}
+/* 投诉原因---修改 */
+export function complaintUpdate(data) {
+    const url = targetBaseUrl5 + `/complaint/label`
+    return put(url, data)
+}
\ No newline at end of file

src/views/configure/platformCarType.vue

@@ -34,15 +34,27 @@
         </el-col>
         <el-col>
           <el-form-item>
-                        <Selects :options="dataSource.carTypeList" sizeType="mini"
-                                 :selectName="'车辆类别：'" :type="'carTypeList'" @changeList="handlechangeList"></Selects>
+            <Selects
+              :options="dataSource.carTypeList"
+              sizeType="mini"
+              :selectName="'车辆类别：'"
+              :type="'carTypeList'"
+              @changeList="handlechangeList"
+            ></Selects>
           </el-form-item>
         </el-col>
         <el-col
           style="display: flex; align-items: center; justify-content: end"
         >
-                    <el-button type="primary" size="mini" @click="searchInfo"> 查询</el-button>
-                    <el-button type="primary" size="mini" @click="() => $refs.addDialog.showDialog({})"> 添加品牌类型
+          <el-button type="primary" size="mini" @click="searchInfo">
+            查询</el-button
+          >
+          <el-button
+            type="primary"
+            size="mini"
+            @click="() => $refs.addDialog.showDialog({})"
+          >
+            添加品牌类型
           </el-button>
         </el-col>
       </el-row>
@@ -59,8 +71,8 @@
       <el-table-column label="品牌名称" align="center" prop="platformName">
       </el-table-column>
       <el-table-column label="车型类别" align="center" prop="type">
-                <template slot-scope="{row}">
-                    {{carTypeListText(row.carType)}}
+        <template slot-scope="{ row }">
+          {{ carTypeListText(row.carType) }}
         </template>
       </el-table-column>
       <el-table-column label="图标" align="center" prop="imgUrl">
@@ -80,16 +92,27 @@
         <template slot-scope="scope">
           <span
             v-for="(item, index) in scope.row.rangeOfApplicationName"
-                        :key="'runTypes'+index">
-                        {{index === 0 ? item : '、'+item}}
+            :key="'runTypes' + index"
+          >
+            {{ index === 0 ? item : "、" + item }}
           </span>
         </template>
       </el-table-column>
       <el-table-column label="操作" align="center" fixed="right" width="120">
         <template slot-scope="scope">
-                    <el-button size="small" type="text" @click="() => $refs.addDialog.showDialog(scope.row)"> 编辑
+          <el-button
+            size="small"
+            type="text"
+            @click="() => $refs.addDialog.showDialog(scope.row)"
+          >
+            编辑
           </el-button>
-                    <el-button size="small" type="text" style="color: red" @click="delRow(scope.row.id)">
+          <el-button
+            size="small"
+            type="text"
+            style="color: red"
+            @click="delRow(scope.row.id)"
+          >
             删除
           </el-button>
         </template>
@@ -105,29 +128,28 @@
       >
       </el-pagination>
     </div>
-        <addDialog ref="addDialog" :platformList="platformList" @reLoadTable="reLoadTable"></addDialog>
+    <addDialog
+      ref="addDialog"
+      :platformList="platformList"
+      @reLoadTable="reLoadTable"
+    ></addDialog>
   </div>
 </template>
 
 <script>
-import {
-    carTypeQuery,
-    carTypeDelete
-} from "@/port/carModel/carModel";
-import {
-    getplatformList
-} from "@/port/set-request";
+import { carTypeQuery, carTypeDelete } from "@/port/carModel/carModel";
+import { getplatformList } from "@/port/set-request";
 import addDialog from "./componenets/platformCarType/addDialog";
 import dataSource from "@/libs/screen";
 import JudgeType from "@/mixins/judgeType";
-import Selects from '@/components/Selects'
+import Selects from "@/components/Selects";
 
 export default {
   name: "CarModel",
   mixins: [JudgeType],
   components: {
     addDialog,
-        Selects
+    Selects,
   },
   data() {
     return {
@@ -151,23 +173,22 @@ export default {
   },
   methods: {
     delRow(id) {
-            this.$confirm('删除后不可撤回，确定删除品牌车型', '删除提示', {
-                    confirmButtonText: '确定',
-                    cancelButtonText: '取消',
-                    type: 'warning'
+      this.$confirm("删除后不可撤回，确定删除品牌车型", "删除提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
       })
         .then(() => {
-                    carTypeDelete({}, id)
-                        .then((res) => {
-                            if(res.status === 200) {
-                                this.$message.success('删除成功');
+          carTypeDelete({}, id).then((res) => {
+            if (res.status === 200) {
+              this.$message.success("删除成功");
               this.initTable();
-                            }else {
+            } else {
               this.$message.error(res.msg);
             }
+          });
         })
-                })
-                .catch(() => {})
+        .catch(() => {});
     },
     reLoadTable() {
       this.initTable();
@@ -181,15 +202,15 @@ export default {
       this.initTable();
     },
     handlechangeList(val) {
-            let source = JSON.parse(JSON.stringify(val))
-            let data = this.filftersFun(source.data)
-            this.form.carTypeList = data
+      let source = JSON.parse(JSON.stringify(val));
+      let data = this.filftersFun(source.data);
+      this.form.carTypeList = data;
     },
     async listInit() {
       await getplatformList().then((res) => {
         if (res.status == 200) {
           res.data.forEach((element) => {
-                        if(element.brandUrl) {
+            if (element.brandUrl) {
               this.platformList.push({
                 value: element.platformId,
                 label: element.name,
@@ -204,33 +225,33 @@ export default {
       let params = {
         carTypes: this.form.carTypeList,
         platformId: this.form.platformListInfo,
-                typeItem: '',
+        typeItem: "",
         typeName: this.form.CarModelName,
         pageVo: {
           page: this.page,
-                    rows: this.size
-                }
-            }
+          rows: this.size,
+        },
+      };
 
       this.tableLoading = true;
 
       carTypeQuery(params)
         .then((res) => {
-                    if(res.status === 200) {
+          if (res.status === 200) {
             this.data = res.data.content;
             this.total = res.data.total;
-                    }else {
+          } else {
             this.$message.error(res.msg);
           }
           this.tableLoading = false;
         })
         .catch(() => {
           this.tableLoading = false;
-                })
+        });
     },
     // table变色，头
-        tableHeaderColor({row, column, rowIndex, columnIndex}) {
-            return {"background-color": "#0099ff", color: "#ffffff"};
+    tableHeaderColor({ row, column, rowIndex, columnIndex }) {
+      return { "background-color": "#0099ff", color: "#ffffff" };
     },
   },
 };

src/views/disposition/componenets/disposition/addDialog.vue

+<template>
+  <el-dialog
+    :visible.sync="dialogVisible"
+    :title="title"
+    width="40%"
+    class="form-dialog"
+    @close="clearInfo"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+  >
+    <el-form
+      ref="form"
+      label-position="right"
+      label-width="150px"
+      :model="form"
+      :rules="rules"
+    >
+      <el-form-item label="图标：" prop="img">
+        <el-upload
+          class="avatar-uploader"
+          :headers="reqHeaders"
+          :data="dataUrl"
+          action="https://apps.xoado.com/cloud/tools/files/upload"
+          :show-file-list="false"
+          name="image"
+          :on-success="photoUrlSuccess"
+          :before-upload="beforeAvatarUpload"
+        >
+          <img v-if="form.labelImgurl" :src="form.labelImgurl" class="avatar" />
+          <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+        </el-upload>
+      </el-form-item>
+      <el-form-item label="车辆类别：" prop="type">
+        <el-select
+          v-model="form.complaintMode"
+          collapse-tags
+          placeholder="请选择"
+          size="mini"
+        >
+          <el-option
+            v-for="item in complaintModelist"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+            size="mini"
+          >
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="控诉原因：" prop="labelName">
+        <el-input
+          style="width: 220px"
+          size="mini"
+          v-model="form.labelName"
+        ></el-input>
+      </el-form-item>
+    </el-form>
+    <span slot="footer" class="dialog-footer">
+      <el-button size="small " @click="clearInfo">取 消</el-button>
+      <el-button size="small" type="primary" @click="complaintLable"
+        >确 定</el-button
+      >
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import { complaintUpdate, complaintAdd } from "@/port/set-request";
+export default {
+  name: "addDialog",
+  props: ["platformList"],
+  data() {
+    return {
+      title: "",
+      dialogVisible: false,
+      dataUrl: {
+        urlType: "OfflineContract",
+      },
+      reqHeaders: {
+        XOADOAPPACCESSCODE: this.$store.state.user.code,
+        XOADOTOKENID: this.$store.state.user.token,
+        XOADOPLATFORMID: this.$store.getters.platformId,
+      },
+      form: {
+        complaintMode: "0",
+        labelType: "0",
+        labelImgurl: "",
+        labelName: "",
+        labelContent: "",
+      },
+      rules: {
+        labelImgurl: [
+          { required: true, message: "请上传图标", trigger: "blur" },
+        ],
+        complaintMode: [
+          { required: true, message: "请选择投诉方式", trigger: "change" },
+        ],
+        labelName: [
+          { required: true, message: "请输入控诉原因", trigger: "blur" },
+          { max: 10, message: "最多可输入五十个字" },
+        ],
+      },
+      complaintModelist: [
+        {
+          name: "表单提交",
+          id: "0",
+        },
+        {
+          name: "电话直播",
+          id: "1",
+        },
+      ],
+    };
+  },
+  created() {},
+  methods: {
+    async showDialog(row) {
+      if (Object.keys(row).length > 0) {
+        this.title = "编辑控诉原因";
+        this.form = JSON.parse(JSON.stringify(row)).row;
+      } else {
+        this.form = {
+          complaintMode: "0",
+          labelType: "",
+          labelImgurl: "",
+          labelName: "",
+          labelContent: "",
+        };
+        this.title = "添加控诉原因";
+      }
+      this.dialogVisible = true;
+    },
+    photoUrlSuccess(response, file, fileList) {
+      let that = this;
+      if (file.response.status == 200) {
+        that.form.labelImgurl = file.response.data[0].url;
+      }
+    },
+    beforeAvatarUpload(file) {
+      const isLt2M = file.size / 1024 / 1024 < 2;
+
+      if (!isLt2M) {
+        this.$message.error("上传图片大小不能超过 2MB!");
+      }
+      return isLt2M;
+    },
+    clearInfo() {
+      this.$refs.form.resetFields();
+      this.dialogVisible = false;
+    },
+    complaintLable() {
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          let params = {
+            platformId: this.form.platformId,
+            labelType: "0",
+            labelName: this.form.labelName,
+            labelContent: "",
+            labelImgurl: this.form.labelImgurl,
+            complaintMode: this.form.complaintMode,
+          };
+          if (this.form.hasOwnProperty("id")) {
+            params["id"] = this.form.id;
+            complaintUpdate(params).then((res) => {
+              if (res.status === 200) {
+                this.$message.success("修改成功");
+                this.clearInfo();
+                this.$emit("reLoadTable");
+              } else {
+                this.$message.error(res.msg);
+              }
+            });
+          } else {
+            let params = {
+              platformId: this.$store.getters.platformId,
+              labelType: "0",
+              labelName: this.form.labelName,
+              labelContent: "",
+              labelImgurl: this.form.labelImgurl,
+              complaintMode: this.form.complaintMode,
+            };
+            complaintAdd(params).then((res) => {
+              if (res.status === 200) {
+                this.$message.success("添加成功");
+                this.clearInfo();
+                this.$emit("reLoadTable");
+              } else {
+                this.$message.error(res.msg);
+              }
+            });
+          }
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style scoped>
+::v-deep.avatar-uploader .el-upload {
+  border: 1px dashed #d9d9d9;
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+}
+
+::v-deep.avatar-uploader .el-upload:hover {
+  border-color: #409eff;
+}
+
+.avatar-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 50px;
+  height: 50px;
+  line-height: 50px;
+  text-align: center;
+}
+
+.avatar {
+  width: 50px;
+  height: 50px;
+  display: block;
+}
+</style>

src/views/disposition/disposition.vue

+<template>
+  <el-card>
+    <el-row>
+      <div class="title-left" style="padding-left: 10px; font-weight: 800">
+        控诉原因配置
+      </div>
+    </el-row>
+    <div class="itemBtn">
+      <el-button
+        type="primary"
+        icon="el-icon-plus"
+        size="small"
+        @click="$refs.addDialog.showDialog({})"
+        >新增原因</el-button
+      >
+    </div>
+
+    <el-table
+      :data="data"
+      stripe
+      v-loading="tableLoading"
+      :header-cell-style="tableHeaderColor"
+      style="width: 100%"
+      border
+    >
+      <el-table-column type="index" label="序号" align="center" width="50">
+      </el-table-column>
+      <el-table-column label="图标" align="center" width="120">
+        <template slot-scope="{ row }">
+          <el-avatar :size="50" shape="square">
+            <img :src="row.labelImgurl" />
+          </el-avatar>
+        </template>
+      </el-table-column>
+      <el-table-column label="控诉方式" align="center" prop="labelType">
+        <template slot-scope="{ row }">
+          {{ row.complaintMode * 1 == 1 ? "电话直播" : "表单提交" }}
+        </template>
+      </el-table-column>
+      <el-table-column label="控诉原因" align="center" prop="labelName">
+      </el-table-column>
+      <el-table-column label="录入时间" align="center" prop="createTime">
+      </el-table-column>
+      <el-table-column label="操作" align="center" width="120">
+        <template slot-scope="{ row }">
+          <el-button type="text" @click="$refs.addDialog.showDialog({ row })"
+            >编辑</el-button
+          >
+          <el-button type="text" style="color: red" @click="DELcondition(row)"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <div class="pagination" v-if="total > 10">
+      <el-pagination
+        background
+        layout="prev, pager, next, jumper, total"
+        :current-page="page"
+        @current-change="current_change"
+        :total="total"
+      >
+      </el-pagination>
+    </div>
+    <addDialog
+      ref="addDialog"
+      @reLoadTable="reLoadTable"
+      :platformList="platformList"
+    ></addDialog>
+  </el-card>
+</template>
+
+<script>
+import { conditionList, delconditionList } from "@/port/set-request";
+import addDialog from "./componenets/disposition/addDialog";
+export default {
+  name: "disposition",
+  data() {
+    return {
+      page: 1,
+      size: 10,
+      total: 0,
+      tableLoading: true,
+      data: [],
+      platformList: [],
+    };
+  },
+  components: {
+    addDialog,
+  },
+  async created() {
+    await this.initTable();
+  },
+
+  methods: {
+    current_change(page) {
+      this.page = page;
+      this.initTable();
+    },
+    reLoadTable() {
+      this.initTable();
+    },
+    initTable() {
+      let json = {
+        labelType: "0",
+        labelName: "",
+        complaintMode: "",
+        pageVo: {
+          page: this.page,
+          rows: this.size,
+        },
+      };
+
+      conditionList(json).then((res) => {
+        if (res.status == 200) {
+          this.data = res.data.content;
+          this.total = res.data.total;
+        } else {
+          this.data = [];
+          this.total = 0;
+        }
+        this.tableLoading = false;
+      });
+    },
+    DELcondition(row) {
+      this.$confirm("删除后不可撤回，确定删除?", "删除提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          this.tableLoading = true;
+          let json = { labelId: row.id };
+          delconditionList(json).then((res) => {
+            if (res.status == 200) {
+              this.$message({
+                type: "success",
+                message: "删除成功!",
+              });
+              this.page = 1;
+              this.initTable();
+            } else {
+              this.$message.error("删除失败!");
+            }
+            this.tableLoading = false;
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
+    },
+    tableRowStyle({ row, rowIndex }) {
+      if (rowIndex % 2 !== 0) {
+        return { "background-color": "#e3f4ff" };
+      }
+    },
+    // table变色，头
+    tableHeaderColor({ row, column, rowIndex, columnIndex }) {
+      return { "background-color": "#0099ff", color: "#ffffff" };
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.search-form {
+  margin: 5px 0 5px 0;
+
+  .el-form-item {
+    margin-bottom: 5px;
+  }
+}
+.pagination {
+  margin-top: 16px;
+  text-align: right;
+}
+.itemBtn {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  margin: 10px 0;
+}
+</style>