zhongrj
2023-11-16 7406987a1bca9487b123169cfcfe3880c87cd539
新增工作日志,网格巡查,轮播图管理
1 files modified
6 files added
1115 ■■■■■ changed files
src/api/grid/gridPatrolRecord.js 49 ●●●●● patch | view | raw | blame | history
src/api/grid/gridWorkLog.js 49 ●●●●● patch | view | raw | blame | history
src/api/rotation/rotation.js 49 ●●●●● patch | view | raw | blame | history
src/config/website.js 2 ●●●●● patch | view | raw | blame | history
src/views/grid/gridPatrolRecord/index.vue 322 ●●●●● patch | view | raw | blame | history
src/views/grid/gridWorkLog/index.vue 334 ●●●●● patch | view | raw | blame | history
src/views/rotation/index.vue 310 ●●●●● patch | view | raw | blame | history
src/api/grid/gridPatrolRecord.js
New file
@@ -0,0 +1,49 @@
import request from '@/router/axios';
export const getList = (current, size, params) => {
  return request({
    url: '/api/blade-gridPatrolRecord/gridPatrolRecord/page',
    method: 'get',
    params: {
      ...params,
      current,
      size,
    }
  })
}
export const remove = (ids) => {
  return request({
    url: '/api/blade-gridPatrolRecord/gridPatrolRecord/remove',
    method: 'post',
    params: {
      ids,
    }
  })
}
export const add = (row) => {
  return request({
    url: '/api/blade-gridPatrolRecord/gridPatrolRecord/save',
    method: 'post',
    data: row
  })
}
export const update = (row) => {
  return request({
    url: '/api/blade-gridPatrolRecord/gridPatrolRecord/update',
    method: 'post',
    data: row
  })
}
export const getGridPatrolRecord = (id) => {
  return request({
    url: '/api/blade-gridPatrolRecord/gridPatrolRecord/detail',
    method: 'get',
    params: {
      id
    }
  })
}
src/api/grid/gridWorkLog.js
New file
@@ -0,0 +1,49 @@
import request from '@/router/axios';
export const getList = (current, size, params) => {
  return request({
    url: '/api/blade-gridWorkLog/gridWorkLog/page',
    method: 'get',
    params: {
      ...params,
      current,
      size,
    }
  })
}
export const remove = (ids) => {
  return request({
    url: '/api/blade-gridWorkLog/gridWorkLog/remove',
    method: 'post',
    params: {
      ids,
    }
  })
}
export const add = (row) => {
  return request({
    url: '/api/blade-gridWorkLog/gridWorkLog/save',
    method: 'post',
    data: row
  })
}
export const update = (row) => {
  return request({
    url: '/api/blade-gridWorkLog/gridWorkLog/update',
    method: 'post',
    data: row
  })
}
export const getGridWorkLog = (id) => {
  return request({
    url: '/api/blade-gridWorkLog/gridWorkLog/detail',
    method: 'get',
    params: {
      id
    }
  })
}
src/api/rotation/rotation.js
New file
@@ -0,0 +1,49 @@
import request from '@/router/axios';
export const getList = (current, size, params) => {
  return request({
    url: '/api/blade-rotation/rotation/page',
    method: 'get',
    params: {
      ...params,
      current,
      size,
    }
  })
}
export const remove = (ids) => {
  return request({
    url: '/api/blade-rotation/rotation/remove',
    method: 'post',
    params: {
      ids,
    }
  })
}
export const add = (row) => {
  return request({
    url: '/api/blade-rotation/rotation/save',
    method: 'post',
    data: row
  })
}
export const update = (row) => {
  return request({
    url: '/api/blade-rotation/rotation/update',
    method: 'post',
    data: row
  })
}
export const getrotation = (id) => {
  return request({
    url: '/api/blade-rotation/rotation/detail',
    method: 'get',
    params: {
      id
    }
  })
}
src/config/website.js
@@ -48,4 +48,6 @@
  ssoUrl: 'http://localhost:8100/oauth/authorize?client_id=saber&response_type=code&redirect_uri=',
  // 单点登录回调地址(Saber服务的地址)
  redirectUri: 'http://localhost:1888',
  // minio 基础路径
  minioUrl: 'https://srgdjczzxtpt.com:2080/gminio/jczz/'
}
src/views/grid/gridPatrolRecord/index.vue
New file
@@ -0,0 +1,322 @@
<!-- 巡查记录 -->
<template>
  <basic-container>
    <avue-crud
      :option="option"
      :table-loading="loading"
      :data="data"
      :page.sync="page"
      ref="crud"
      @row-del="rowDel"
      v-model="form"
      :permission="permissionList"
      @row-update="rowUpdate"
      @row-save="rowSave"
      :before-open="beforeOpen"
      @search-change="searchChange"
      @search-reset="searchReset"
      @selection-change="selectionChange"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @on-load="onLoad"
    >
      <template slot="menuLeft">
        <el-button
          size="small"
          icon="el-icon-delete"
          plain
          v-if="permission.article_delete"
          @click="handleDelete"
        >删 除
        </el-button>
      </template>
    </avue-crud>
  </basic-container>
</template>
<script>
  import {getList, remove, update, add, getGridPatrolRecord} from "@/api/grid/gridPatrolRecord";
  import {mapGetters} from "vuex";
  import website from '@/config/website';
  export default {
    data() {
      return {
        form: {},
        query: {},
        loading: true,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0,
        },
        datetime: "",
        selectionList: [],
        option: {
          height: "auto",
          calcHeight: 54,
          dialogWidth: 950,
          tip: false,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 350,
          border: false,
          //stripe:true,
          index: true,
          viewBtn: true,
          selection: true,
          excelBtn: true,
          dialogClickModal: false,
          column: [
            {
              label: "巡查标题",
              prop: "name",
              span: 24,
              row: true,
              searchSpan: 4,
              search: true,
              rules: [
                {
                  required: true,
                  message: "请输入巡查标题",
                  trigger: "blur",
                },
              ],
            },
            {
              label: "巡查内容",
              prop: "context",
              type: "textarea",
              span: 24,
            },
            {
              label: "巡查图片",
              prop: "url",
              type: "upload",
              width:80,
              listType: "picture-img",
              action: "/api/blade-resource/oss/endpoint/put-file",
              propsHttp: {
                res: "data",
                name: 'name',
                url: "link",
              },
              span: 24,
            },
            {
              label: "巡查时间",
              prop: "patrolTime",
              width:160,
              type: "date",
              format: "yyyy-MM-dd HH:mm:ss",
              valueFormat: "yyyy-MM-dd HH:mm:ss",
              rules: [
                {
                  required: true,
                  message: "请输入巡查时间",
                  trigger: "blur",
                },
              ],
            }
          ],
        },
        data: [],
      };
    },
    watch: {
    },
    computed: {
      ...mapGetters(["permission","userInfo"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.gridPatrolRecord_add, true),
          viewBtn: this.vaildData(this.permission.gridPatrolRecord_view, true),
          delBtn: this.vaildData(this.permission.gridPatrolRecord_delete, true),
          editBtn: this.vaildData(this.permission.gridPatrolRecord_edit, true),
        };
      },
      ids() {
        let ids = [];
        this.selectionList.forEach((ele) => {
          ids.push(ele.id);
        });
        return ids.join(",");
      },
    },
    methods: {
      rowSave(row, done, loading) {
        if(row.url.length>0){
          var urls = []
          var split = row.url.split(",");
          split.forEach(url=>{
             var names = url.split("jczz/");
             urls.push(names[1])
          })
          row.url = urls.join(",")
        }
        add(row).then(
          () => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            done();
          },
          (error) => {
            window.console.log(error);
            loading();
          }
        );
      },
      rowUpdate(row, index, done, loading) {
        if(row.url.length>0){
          var urls = []
          var split = row.url.split(",");
          split.forEach(url=>{
             var names = url.split("jczz/");
             urls.push(names[1])
          })
          row.url = urls.join(",")
        }
        update(row).then(
          () => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            done();
          },
          (error) => {
            window.console.log(error);
            loading();
          }
        );
      },
      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            return remove(row.id);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
          });
      },
      searchReset() {
        this.query = {};
        this.onLoad(this.page);
      },
      searchChange(params, done) {
        this.query = params;
        this.page.currentPage = 1;
        this.onLoad(this.page, params);
        done();
      },
      selectionChange(list) {
        this.selectionList = list;
      },
      selectionClear() {
        this.selectionList = [];
        this.$refs.crud.toggleSelection();
      },
      handleDelete() {
        if (this.selectionList.length === 0) {
          this.$message.warning("请选择至少一条数据");
          return;
        }
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            return remove(this.ids);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            this.$refs.crud.toggleSelection();
          });
      },
      beforeOpen(done, type) {
        if (["edit", "view"].includes(type)) {
          getGridPatrolRecord(this.form.id).then((res) => {
            this.form = res.data.data;
            if(this.form.url.length>0){
              var urls = []
              var names = this.form.url.split(",");
              names.forEach(name=>{
                urls.push(website.minioUrl + name)
              })
              this.form.url = urls.join(",")
            }
          });
        }
        // con
        done();
      },
      currentChange(currentPage) {
        this.page.currentPage = currentPage;
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize;
      },
      refreshChange() {
        this.onLoad(this.page, this.query);
      },
      onLoad(page, params = {}) {
        const {dateTime} = this.query;
        let values = {
          ...params,
        };
        if (dateTime) {
          values = {
            ...params,
            startTime: dateTime[0],
            endTime: dateTime[1],
            ...this.query,
          };
          values.dateTime = null;
        }
        this.loading = true;
        getList(page.currentPage, page.pageSize, values).then((res) => {
          const data = res.data.data;
          this.page.total = data.total;
          this.data = data.records;
          this.data.forEach(item=>{
            if(item.url.length>0){
              var urls = []
              var names = item.url.split(",");
              names.forEach(name=>{
                urls.push(website.minioUrl + name)
              })
              item.url = urls.join(",")
            }
          })
          this.loading = false;
          this.selectionClear();
        });
      }
    },
  };
</script>
<style>
  .avue-upload__icon {
    line-height: 6;
  }
</style>
src/views/grid/gridWorkLog/index.vue
New file
@@ -0,0 +1,334 @@
<!-- 工作日志 -->
<template>
  <basic-container>
    <avue-crud
      :option="option"
      :table-loading="loading"
      :data="data"
      :page.sync="page"
      ref="crud"
      @row-del="rowDel"
      v-model="form"
      :permission="permissionList"
      @row-update="rowUpdate"
      @row-save="rowSave"
      :before-open="beforeOpen"
      @search-change="searchChange"
      @search-reset="searchReset"
      @selection-change="selectionChange"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @on-load="onLoad"
    >
      <template slot="menuLeft">
        <el-button
          size="small"
          icon="el-icon-delete"
          plain
          v-if="permission.article_delete"
          @click="handleDelete"
        >删 除
        </el-button>
      </template>
    </avue-crud>
  </basic-container>
</template>
<script>
  import {getList, remove, update, add, getGridWorkLog} from "@/api/grid/gridWorkLog";
  import {mapGetters} from "vuex";
  import website from '@/config/website';
  export default {
    data() {
      return {
        form: {},
        query: {},
        loading: true,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0,
        },
        datetime: "",
        selectionList: [],
        option: {
          height: "auto",
          calcHeight: 54,
          dialogWidth: 950,
          tip: false,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 350,
          border: false,
          //stripe:true,
          index: true,
          viewBtn: true,
          selection: true,
          excelBtn: true,
          dialogClickModal: false,
          column: [
            {
              label: "走访人员姓名",
              prop: "name",
              span: 12,
              labelWidth:120,
              searchLabelWidth:120,
              searchSpan: 5,
              search:true,
              rules: [
                {
                  required: true,
                  message: "请输入走访人员姓名",
                  trigger: "blur",
                },
              ],
            },
            {
              label: "走访人员电话",
              prop: "phone",
              span: 12,
              labelWidth:120,
              searchLabelWidth:120,
              searchSpan: 5,
              search:true,
            },
            {
              label: "内容",
              labelWidth:120,
              prop: "context",
              type: "textarea",
              span: 24,
            },
            {
              label: "图片",
              prop: "url",
              type: "upload",
              labelWidth:120,
              width:80,
              listType: "picture-img",
              action: "/api/blade-resource/oss/endpoint/put-file",
              propsHttp: {
                res: "data",
                name: 'name',
                url: "link",
              },
              span: 24,
            },
            {
              label: "走访时间",
              prop: "workTime",
              width:160,
              type: "date",
              format: "yyyy-MM-dd HH:mm:ss",
              valueFormat: "yyyy-MM-dd HH:mm:ss",
              rules: [
                {
                  required: true,
                  message: "请输入走访时间",
                  trigger: "blur",
                },
              ],
            }
          ],
        },
        data: [],
      };
    },
    watch: {
    },
    computed: {
      ...mapGetters(["permission","userInfo"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.gridPatrolRecord_add, true),
          viewBtn: this.vaildData(this.permission.gridPatrolRecord_view, true),
          delBtn: this.vaildData(this.permission.gridPatrolRecord_delete, true),
          editBtn: this.vaildData(this.permission.gridPatrolRecord_edit, true),
        };
      },
      ids() {
        let ids = [];
        this.selectionList.forEach((ele) => {
          ids.push(ele.id);
        });
        return ids.join(",");
      },
    },
    methods: {
      rowSave(row, done, loading) {
        if(row.url.length>0){
          var urls = []
          var split = row.url.split(",");
          split.forEach(url=>{
             var names = url.split("jczz/");
             urls.push(names[1])
          })
          row.url = urls.join(",")
        }
        add(row).then(
          () => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            done();
          },
          (error) => {
            window.console.log(error);
            loading();
          }
        );
      },
      rowUpdate(row, index, done, loading) {
        if(row.url.length>0){
          var urls = []
          var split = row.url.split(",");
          split.forEach(url=>{
             var names = url.split("jczz/");
             urls.push(names[1])
          })
          row.url = urls.join(",")
        }
        update(row).then(
          () => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            done();
          },
          (error) => {
            window.console.log(error);
            loading();
          }
        );
      },
      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            return remove(row.id);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
          });
      },
      searchReset() {
        this.query = {};
        this.onLoad(this.page);
      },
      searchChange(params, done) {
        this.query = params;
        this.page.currentPage = 1;
        this.onLoad(this.page, params);
        done();
      },
      selectionChange(list) {
        this.selectionList = list;
      },
      selectionClear() {
        this.selectionList = [];
        this.$refs.crud.toggleSelection();
      },
      handleDelete() {
        if (this.selectionList.length === 0) {
          this.$message.warning("请选择至少一条数据");
          return;
        }
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            return remove(this.ids);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            this.$refs.crud.toggleSelection();
          });
      },
      beforeOpen(done, type) {
        if (["edit", "view"].includes(type)) {
          getGridWorkLog(this.form.id).then((res) => {
            this.form = res.data.data;
            if(this.form.url.length>0){
              var urls = []
              var names = this.form.url.split(",");
              names.forEach(name=>{
                urls.push(website.minioUrl + name)
              })
              this.form.url = urls.join(",")
            }
          });
        }
        // con
        done();
      },
      currentChange(currentPage) {
        this.page.currentPage = currentPage;
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize;
      },
      refreshChange() {
        this.onLoad(this.page, this.query);
      },
      onLoad(page, params = {}) {
        const {dateTime} = this.query;
        let values = {
          ...params,
        };
        if (dateTime) {
          values = {
            ...params,
            startTime: dateTime[0],
            endTime: dateTime[1],
            ...this.query,
          };
          values.dateTime = null;
        }
        this.loading = true;
        getList(page.currentPage, page.pageSize, values).then((res) => {
          const data = res.data.data;
          this.page.total = data.total;
          this.data = data.records;
          this.data.forEach(item=>{
            if(item.url.length>0){
              var urls = []
              var names = item.url.split(",");
              names.forEach(name=>{
                urls.push(website.minioUrl + name)
              })
              item.url = urls.join(",")
            }
          })
          this.loading = false;
          this.selectionClear();
        });
      }
    },
  };
</script>
<style>
  .avue-upload__icon {
    line-height: 6;
  }
</style>
src/views/rotation/index.vue
New file
@@ -0,0 +1,310 @@
<!-- 工作日志 -->
<template>
  <basic-container>
    <avue-crud
      :option="option"
      :table-loading="loading"
      :data="data"
      :page.sync="page"
      ref="crud"
      @row-del="rowDel"
      v-model="form"
      :permission="permissionList"
      @row-update="rowUpdate"
      @row-save="rowSave"
      :before-open="beforeOpen"
      @search-change="searchChange"
      @search-reset="searchReset"
      @selection-change="selectionChange"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @on-load="onLoad"
    >
      <template slot="menuLeft">
        <el-button
          size="small"
          icon="el-icon-delete"
          plain
          v-if="permission.article_delete"
          @click="handleDelete"
        >删 除
        </el-button>
      </template>
    </avue-crud>
  </basic-container>
</template>
<script>
  import {getList, remove, update, add, getRotation} from "@/api/rotation/rotation";
  import {mapGetters} from "vuex";
  import website from '@/config/website';
  export default {
    data() {
      return {
        form: {},
        query: {},
        loading: true,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0,
        },
        datetime: "",
        selectionList: [],
        option: {
          height: "auto",
          calcHeight: 54,
          dialogWidth: 950,
          tip: false,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 350,
          border: false,
          //stripe:true,
          index: true,
          viewBtn: true,
          selection: true,
          excelBtn: true,
          dialogClickModal: false,
          column: [
            {
              label: "名称",
              prop: "name",
              span: 12,
              searchSpan: 4,
              search:true,
            },
            {
              label: "跳转地址",
              prop: "junpUrl",
              span: 12,
              searchSpan: 4,
              search:true,
            },
            {
              label: "图片",
              prop: "url",
              type: "upload",
              width:80,
              listType: "picture-img",
              action: "/api/blade-resource/oss/endpoint/put-file",
              propsHttp: {
                res: "data",
                name: 'name',
                url: "link",
              },
              span: 24,
            },
            {
              label: "时间",
              prop: "createTime",
              width:160,
              addDisplay: false,
              editDisplay: false,
              type: "date",
              format: "yyyy-MM-dd HH:mm:ss",
              valueFormat: "yyyy-MM-dd HH:mm:ss",
            }
          ],
        },
        data: [],
      };
    },
    watch: {
    },
    computed: {
      ...mapGetters(["permission","userInfo"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.rotation_add, true),
          viewBtn: this.vaildData(this.permission.rotation_view, true),
          delBtn: this.vaildData(this.permission.rotation_delete, true),
          editBtn: this.vaildData(this.permission.rotation_edit, true),
        };
      },
      ids() {
        let ids = [];
        this.selectionList.forEach((ele) => {
          ids.push(ele.id);
        });
        return ids.join(",");
      },
    },
    methods: {
      rowSave(row, done, loading) {
        if(row.url.length>0){
          var urls = []
          var split = row.url.split(",");
          split.forEach(url=>{
             var names = url.split("jczz/");
             urls.push(names[1])
          })
          row.url = urls.join(",")
        }
        add(row).then(
          () => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            done();
          },
          (error) => {
            window.console.log(error);
            loading();
          }
        );
      },
      rowUpdate(row, index, done, loading) {
        if(row.url.length>0){
          var urls = []
          var split = row.url.split(",");
          split.forEach(url=>{
             var names = url.split("jczz/");
             urls.push(names[1])
          })
          row.url = urls.join(",")
        }
        update(row).then(
          () => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            done();
          },
          (error) => {
            window.console.log(error);
            loading();
          }
        );
      },
      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            return remove(row.id);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
          });
      },
      searchReset() {
        this.query = {};
        this.onLoad(this.page);
      },
      searchChange(params, done) {
        this.query = params;
        this.page.currentPage = 1;
        this.onLoad(this.page, params);
        done();
      },
      selectionChange(list) {
        this.selectionList = list;
      },
      selectionClear() {
        this.selectionList = [];
        this.$refs.crud.toggleSelection();
      },
      handleDelete() {
        if (this.selectionList.length === 0) {
          this.$message.warning("请选择至少一条数据");
          return;
        }
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            return remove(this.ids);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            this.$refs.crud.toggleSelection();
          });
      },
      beforeOpen(done, type) {
        if (["edit", "view"].includes(type)) {
          getRotation(this.form.id).then((res) => {
            this.form = res.data.data;
            if(this.form.url.length>0){
              var urls = []
              var names = this.form.url.split(",");
              names.forEach(name=>{
                urls.push(website.minioUrl + name)
              })
              this.form.url = urls.join(",")
            }
          });
        }
        // con
        done();
      },
      currentChange(currentPage) {
        this.page.currentPage = currentPage;
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize;
      },
      refreshChange() {
        this.onLoad(this.page, this.query);
      },
      onLoad(page, params = {}) {
        const {dateTime} = this.query;
        let values = {
          ...params,
        };
        if (dateTime) {
          values = {
            ...params,
            startTime: dateTime[0],
            endTime: dateTime[1],
            ...this.query,
          };
          values.dateTime = null;
        }
        this.loading = true;
        getList(page.currentPage, page.pageSize, values).then((res) => {
          const data = res.data.data;
          this.page.total = data.total;
          this.data = data.records;
          this.data.forEach(item=>{
            if(item.url.length>0){
              var urls = []
              var names = item.url.split(",");
              names.forEach(name=>{
                urls.push(website.minioUrl + name)
              })
              item.url = urls.join(",")
            }
          })
          this.loading = false;
          this.selectionClear();
        });
      }
    },
  };
</script>
<style>
  .avue-upload__icon {
    line-height: 6;
  }
</style>