{"remainingRequest":"/usr/local/develop/php/www/waibao/project/NN2020060801/addons/admin/node_modules/vue-loader/lib/index.js??vue-loader-options!/usr/local/develop/php/www/waibao/project/NN2020060801/addons/admin/src/views/system/ad/index.vue?vue&type=style&index=0&id=4f5f459c&scoped=true&lang=css&","dependencies":[{"path":"/usr/local/develop/php/www/waibao/project/NN2020060801/addons/admin/src/views/system/ad/index.vue","mtime":1618041414000},{"path":"/usr/local/develop/php/www/waibao/project/NN2020060801/addons/admin/node_modules/css-loader/dist/cjs.js","mtime":499162500000},{"path":"/usr/local/develop/php/www/waibao/project/NN2020060801/addons/admin/node_modules/vue-loader/lib/loaders/stylePostLoader.js","mtime":499162500000},{"path":"/usr/local/develop/php/www/waibao/project/NN2020060801/addons/admin/node_modules/postcss-loader/src/index.js","mtime":499162500000},{"path":"/usr/local/develop/php/www/waibao/project/NN2020060801/addons/admin/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/usr/local/develop/php/www/waibao/project/NN2020060801/addons/admin/node_modules/vue-loader/lib/index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:CgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoNCi5lbGUtYmxvY2sgPj4+IC5lbC11cGxvYWQsIC5lbGUtYmxvY2sgPj4+IC5lbC11cGxvYWQtZHJhZ2dlciB7DQogIHdpZHRoOiAxMDAlOw0KfQ0K"},{"version":3,"sources":["index.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgSA;AACA;AACA","file":"index.vue","sourceRoot":"src/views/system/ad","sourcesContent":["<template>\r\n  <div class=\"ele-body\">\r\n    <el-card shadow=\"never\">\r\n      <!-- 搜索表单 -->\r\n      <el-form :model=\"table.where\" label-width=\"90px\" class=\"ele-form-search\"\r\n               @keyup.enter.native=\"$refs.table.reload()\" @submit.native.prevent>\r\n        <el-row :gutter=\"15\">\r\n          <el-col :md=\"6\" :sm=\"12\">\r\n            <el-form-item label=\"广告标题:\">\r\n              <el-input v-model=\"table.where.title\" placeholder=\"请输入广告标题\" clearable/>\r\n            </el-form-item>\r\n          </el-col>\r\n          <el-col :md=\"6\" :sm=\"12\">\r\n            <div class=\"ele-form-actions\">\r\n              <el-button type=\"primary\" @click=\"$refs.table.reload()\" icon=\"el-icon-search\" class=\"ele-btn-icon\">查询\r\n              </el-button>\r\n              <el-button @click=\"(table.where={})&&$refs.table.reload()\">重置</el-button>\r\n            </div>\r\n          </el-col>\r\n        </el-row>\r\n      </el-form>\r\n      <!-- 操作按钮 -->\r\n      <div class=\"ele-table-tool ele-table-tool-default\">\r\n        <el-button @click=\"showEdit=true\" type=\"primary\" icon=\"el-icon-plus\" class=\"ele-btn-icon\" size=\"small\" v-if=\"permission.includes('sys:ad:add')\">添加\r\n        </el-button>\r\n        <el-button @click=\"remove()\" type=\"danger\" icon=\"el-icon-delete\" class=\"ele-btn-icon\" size=\"small\" v-if=\"permission.includes('sys:ad:dall')\">批量删除\r\n        </el-button>\r\n      </div>\r\n      <!-- 数据表格 -->\r\n      <ele-data-table ref=\"table\" :config=\"table\" :choose.sync=\"choose\" height=\"calc(100vh - 315px)\"  highlight-current-row>\r\n        <template slot-scope=\"{index}\">\r\n          <el-table-column type=\"selection\" width=\"45\" align=\"center\" fixed=\"left\"/>\r\n          <el-table-column type=\"index\" :index=\"index\" label=\"编号\" width=\"60\" align=\"center\" fixed=\"left\" show-overflow-tooltip/>\r\n          <el-table-column prop=\"title\" label=\"广告标题\" sortable=\"custom\" show-overflow-tooltip min-width=\"200\"/>\r\n          <el-table-column prop=\"ad_sort_name\" label=\"所属广告位\" sortable=\"custom\" show-overflow-tooltip min-width=\"200\"/>\r\n          <el-table-column label=\"广告封面\" min-width=\"100\" align=\"center\">\r\n            <template slot-scope=\"{row}\">\r\n              <el-avatar shape=\"square\" :size=\"25\" :src=\"row.cover\"/>\r\n            </template>\r\n          </el-table-column>\r\n          <el-table-column label=\"广告类型\" min-width=\"100\" align=\"center\">\r\n            <template slot-scope=\"{row}\">\r\n              <el-tag :type=\"['','info','success','warning'][row.type-1]\" size=\"mini\">{{ ['图片', '文字', '视频', '推荐'][row.type-1] }}</el-tag>\r\n            </template>\r\n          </el-table-column>\r\n          <el-table-column prop=\"description\" label=\"广告描述\" show-overflow-tooltip min-width=\"200\" align=\"center\"/>\r\n          <el-table-column prop=\"url\" label=\"广告地址\" show-overflow-tooltip min-width=\"200\" align=\"center\"/>\r\n          <el-table-column label=\"广告尺寸\" show-overflow-tooltip min-width=\"100\">\r\n            <template slot-scope=\"{row}\">{{ row.width }} x {{ row.height }}</template>\r\n          </el-table-column>\r\n          <el-table-column prop=\"start_time\" label=\"广告开始时间\" show-overflow-tooltip min-width=\"160\" align=\"center\">\r\n            <template slot-scope=\"{row}\">{{ row.start_time | toDateString }}</template>\r\n          </el-table-column>\r\n          <el-table-column prop=\"end_time\" label=\"广告结束时间\" show-overflow-tooltip min-width=\"160\" align=\"center\">\r\n            <template slot-scope=\"{row}\">{{ row.end_time | toDateString }}</template>\r\n          </el-table-column>\r\n          <el-table-column prop=\"view_num\" label=\"点击率\" show-overflow-tooltip min-width=\"100\" align=\"center\"/>\r\n          <el-table-column prop=\"status\" label=\"状态\" sortable min-width=\"100\">\r\n            <template slot-scope=\"{row}\">\r\n              <ele-dot :type=\"['danger', 'success'][row.status]\" :ripple=\"row.status===0\"\r\n                        :text=\"['禁用','正常'][row.status]\"/>\r\n            </template>\r\n          </el-table-column>\r\n          <el-table-column prop=\"sort\" label=\"排序\" sortable=\"custom\" show-overflow-tooltip/>\r\n          <el-table-column label=\"创建时间\" sortable=\"custom\" show-overflow-tooltip min-width=\"160\">\r\n            <template slot-scope=\"{row}\">{{ row.create_time | toDateString }}</template>\r\n          </el-table-column>\r\n          <el-table-column label=\"更新时间\" sortable=\"custom\" show-overflow-tooltip min-width=\"160\">\r\n            <template slot-scope=\"{row}\">{{ row.update_time | toDateString }}</template>\r\n          </el-table-column>\r\n          <el-table-column label=\"操作\" width=\"130px\" align=\"center\" :resizable=\"false\"  fixed=\"right\">\r\n            <template slot-scope=\"{row}\">\r\n              <el-link @click=\"edit(row)\" icon=\"el-icon-edit\" type=\"primary\" :underline=\"false\" v-if=\"permission.includes('sys:ad:edit')\">修改</el-link>\r\n              <el-popconfirm title=\"确定要删除此广告吗？\" @confirm=\"remove(row)\" class=\"ele-action\">\r\n                <el-link slot=\"reference\" icon=\"el-icon-delete\" type=\"danger\" :underline=\"false\" v-if=\"permission.includes('sys:ad:delete')\">删除</el-link>\r\n              </el-popconfirm>\r\n            </template>\r\n          </el-table-column>\r\n        </template>\r\n      </ele-data-table>\r\n    </el-card>\r\n    <!-- 编辑弹窗 -->\r\n    <el-dialog :title=\"editForm.id?'修改广告':'修改广告'\" :visible.sync=\"showEdit\" width=\"700px\"\r\n               @closed=\"editForm={}\" :destroy-on-close=\"true\" custom-class=\"ele-dialog-form\" :lock-scroll=\"false\">\r\n      <el-form :model=\"editForm\" ref=\"editForm\" :rules=\"editRules\" label-width=\"100px\">\r\n        <el-form-item label=\"广告图片:\">\r\n          <uploadImage :limit=\"1\" v-model=\"editForm.cover\"></uploadImage>\r\n        </el-form-item>\r\n        <el-row :gutter=\"15\">\r\n          <el-col :sm=\"12\">\r\n            <el-form-item label=\"广告标题:\" prop=\"title\">\r\n              <el-input v-model=\"editForm.title\" placeholder=\"请输入广告标题\" clearable/>\r\n            </el-form-item>\r\n            <el-form-item label=\"广告类型:\" prop=\"type\">\r\n              <el-select v-model=\"editForm.type\" placeholder=\"请选择广告类型\" class=\"ele-block\" clearable>\r\n                <el-option label=\"图片\" :value=\"1\"/>\r\n                <el-option label=\"文字\" :value=\"2\"/>\r\n                <el-option label=\"视频\" :value=\"3\"/>\r\n                <el-option label=\"其他\" :value=\"4\"/>\r\n              </el-select>\r\n            </el-form-item>\r\n            <el-form-item label=\"广告URL:\" prop=\"url\">\r\n              <el-input v-model=\"editForm.url\" placeholder=\"请输入广告URL\" clearable/>\r\n            </el-form-item>\r\n            <el-form-item label=\"广告宽度:\" prop=\"width\">\r\n              <el-input v-model=\"editForm.width\" placeholder=\"请输入广告宽度\" clearable/>\r\n            </el-form-item>\r\n            <el-form-item label=\"开始时间:\" prop=\"start_time\">\r\n              <el-date-picker\r\n                v-model=\"editForm.start_time\"\r\n                type=\"datetime\"\r\n                placeholder=\"选择开始时间\"\r\n                size=\"small\">\r\n              </el-date-picker>\r\n            </el-form-item>\r\n            <el-form-item label=\"排序号:\" prop=\"sort\">\r\n              <el-input-number v-model=\"editForm.sort\" controls-position=\"right\" :min=\"0\"\r\n                                placeholder=\"请输入排序号\" class=\"ele-fluid ele-text-left\"/>\r\n            </el-form-item>\r\n          </el-col>\r\n          <el-col :sm=\"12\">\r\n            <el-form-item label=\"广告位\" prop=\"ad_sort_id\" :rules=\"{\r\n                    required: true, message: '所属广告位不能为空', trigger: 'change'\r\n                  }\">\r\n              <el-select filterable clearable v-model=\"editForm.ad_sort_id\" size=\"small\" placeholder=\"-请选择广告位-\" class=\"ele-block\">\r\n                <el-option v-for=\"item in adSortList\" :key=\"item.id\" :label=\"item.name\" :value=\"item.id\"/>\r\n              </el-select>\r\n            </el-form-item>\r\n            <el-form-item label=\"广告描述:\" prop=\"description\">\r\n              <el-input v-model=\"editForm.description\" placeholder=\"请输入广告描述\" clearable/>\r\n            </el-form-item>\r\n            <el-form-item label=\"广告状态:\">\r\n              <el-radio-group v-model=\"editForm.status\">\r\n                <el-radio :label=\"1\">正常</el-radio>\r\n                <el-radio :label=\"2\">禁用</el-radio>\r\n              </el-radio-group>\r\n            </el-form-item>\r\n            <el-form-item label=\"广告高度:\" prop=\"height\">\r\n              <el-input v-model=\"editForm.height\" placeholder=\"请输入广告高度\" clearable/>\r\n            </el-form-item>\r\n            <el-form-item label=\"结束时间:\" prop=\"end_time\">\r\n              <el-date-picker\r\n                v-model=\"editForm.end_time\"\r\n                type=\"datetime\"\r\n                placeholder=\"选择结束时间\"\r\n                size=\"small\">\r\n              </el-date-picker>\r\n            </el-form-item>\r\n          </el-col>\r\n        </el-row>\r\n      </el-form>\r\n      <div slot=\"footer\">\r\n        <el-button @click=\"showEdit=false\">取消</el-button>\r\n        <el-button type=\"primary\" @click=\"save\">保存</el-button>\r\n      </div>\r\n    </el-dialog>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport uploadImage from '@/components/uploadImage'\r\nimport { mapGetters } from \"vuex\";\r\nexport default {\r\n  name: \"SysAd\",\r\n  components: {uploadImage},\r\n  data() {\r\n    return {\r\n      table: {url: '/ad/index', where: {}},  // 表格配置\r\n      choose: [],  // 表格选中数据\r\n      showEdit: false,  // 是否显示表单弹窗\r\n      editForm: {status:1},  // 表单数据\r\n      editRules: {  // 表单验证规则\r\n        title: [\r\n          {required: true, message: '请输入广告标题', trigger: 'blur'}\r\n        ],\r\n        ad_sort_id: [\r\n          {required: true, message: '请选择所属广告位', trigger: 'blur'}\r\n        ],\r\n        type: [\r\n          {required: true, message: '请选择广告类型', trigger: 'blur'}\r\n        ],\r\n        description: [\r\n          {required: true, message: '请输入广告描述', trigger: 'blur'}\r\n        ],\r\n        width: [\r\n          {required: true, message: '请输入广告宽度', trigger: 'blur'}\r\n        ],\r\n        height: [\r\n          {required: true, message: '请输入广告高速', trigger: 'blur'}\r\n        ],\r\n        sort: [\r\n          {required: true, message: '请输入排序', trigger: 'blur'}\r\n        ],\r\n      },\r\n      // 广告位列表\r\n      adSortList:[],\r\n    }\r\n  },\r\n  computed: {\r\n    ...mapGetters([\"permission\"]),\r\n  },\r\n  mounted() {\r\n    this.getAdSortList(); // 查询广告位列表\r\n  },\r\n  methods: {\r\n    /* 显示编辑 */\r\n    edit(row) {\r\n      this.editForm = Object.assign({}, row);\r\n      this.showEdit = true;\r\n    },\r\n    /* 保存编辑 */\r\n    save() {\r\n      this.$refs['editForm'].validate((valid) => {\r\n        if (valid) {\r\n          const loading = this.$loading({lock: true});\r\n          this.$http.post('/ad/edit', this.editForm).then(res => {\r\n            loading.close();\r\n            if (res.data.code === 0) {\r\n              this.showEdit = false;\r\n              this.$message({type: 'success', message: res.data.msg});\r\n              this.$refs.table.reload();\r\n            } else {\r\n              this.$message.error(res.data.msg);\r\n            }\r\n          }).catch(e => {\r\n            loading.close();\r\n            this.$message.error(e.message);\r\n          });\r\n        } else {\r\n          return false;\r\n        }\r\n      });\r\n    },\r\n    /* 删除 */\r\n    remove(row) {\r\n      if (!row) {  // 批量删除\r\n        if (this.choose.length === 0) return this.$message.error('请至少选择一条数据');\r\n        let ids = this.choose.map(d => d.id);\r\n        this.$confirm('确定要删除选中的广告吗?', '提示', {type: 'warning'}).then(() => {\r\n          const loading = this.$loading({lock: true});\r\n          this.$http.post('/ad/delete', {id: ids}).then(res => {\r\n            loading.close();\r\n            if (res.data.code === 0) {\r\n              this.$message({type: 'success', message: res.data.msg});\r\n              this.$refs.table.reload();\r\n            } else {\r\n              this.$message.error(res.data.msg);\r\n            }\r\n          }).catch(e => {\r\n            loading.close();\r\n            this.$message.error(e.message);\r\n          });\r\n        }).catch(() => 0);\r\n      } else {  // 单个删除\r\n        const loading = this.$loading({lock: true});\r\n        this.$http.post('/ad/delete', {id:row.id}).then(res => {\r\n          loading.close();\r\n          if (res.data.code === 0) {\r\n            this.$message({type: 'success', message: res.data.msg});\r\n            this.$refs.table.reload();\r\n          } else {\r\n            this.$message.error(res.data.msg);\r\n          }\r\n        }).catch(e => {\r\n          loading.close();\r\n          this.$message.error(e.message);\r\n        });\r\n      }\r\n    },\r\n    /**\r\n     * 获取广告位列表\r\n     */\r\n    getAdSortList() {\r\n      this.$http.get('/adsort/getAdSortList').then(res => {\r\n        if (res.data.code === 0) {\r\n          this.adSortList = res.data.data;\r\n        } else {\r\n          this.$message.error(res.data.msg);\r\n        }\r\n      }).catch(e => {\r\n        this.$message.error(e.message);\r\n      });\r\n    },\r\n  }\r\n}\r\n</script>\r\n\r\n<style scoped>\r\n.ele-block >>> .el-upload, .ele-block >>> .el-upload-dragger {\r\n  width: 100%;\r\n}\r\n</style>"]}]}