temp save

src/api/house.js

@@ -19,6 +19,24 @@ export default {
   admestatedel: params => { // 楼盘删除
     return getRequestNoSort('/adm/estate/del', params, 'loading')
   },
+  admestatephotolist: params => { // 楼盘相册接口
+    return getRequestNoSort('/adm/estate/photo/list', params, 'loading')
+  },
+  admestatephotoedit: params => { // 楼盘相册编辑接口
+    return getRequestNoSort('/adm/estate/photo/edit', params, 'loading')
+  },
+  admestatenewslist: params => { // 楼盘动态列表接口
+    return getRequest('/adm/estate/news/list', params)
+  },
+  admestatenewsadd: params => { // 楼盘动态添加接口
+    return getRequestNoSort('/adm/estate/news/add', params, 'loading')
+  },
+  admestatenewsedit: params => { // 楼盘动态编辑接口
+    return getRequestNoSort('/adm/estate/news/edit', params, 'loading')
+  },
+  admestatenewsdel: params => { // 楼盘动态删除接口
+    return getRequestNoSort('/adm/estate/news/del', params, 'loading')
+  },
   admoldhouselist: params => { // 二手房列表接口
     return getRequest('/adm/oldhouse/list', params)
   },

src/router/index.js

@@ -74,6 +74,13 @@ export const moreRoutes = [
         component: () => import('@/views/house/old'),
         meta: { title: '二手房管理' }
       },
+      {
+        path: 'news',
+        name: 'HouseNews',
+        hidden: true,
+        component: () => import('@/views/house/news'),
+        meta: { title: '楼盘动态' }
+      },
       {
         path: 'theme',
         name: 'HouseTheme',

src/views/house/components/popup/NewsEdit.vue

@@ -0,0 +1,196 @@
+<template>
+  <div>
+    <el-dialog
+      v-loading="loading"
+      :show-close="false"
+      :close-on-click-modal="false"
+      :visible.sync="isShow"
+      :title="curObj.id ? '编辑楼盘动态' : '新增楼盘动态'"
+      :fullscreen="false"
+      width="700px"
+      custom-class="xl-dialog"
+      center
+    >
+      <base-form ref="ruleForm" class="lib-edit" :data="formData" :is-inline="false" label-width="110px">
+        <div slot="otherItem">
+          <div class="scoped-img-area">
+            <div class="sia-op" v-for="(imgsrc,index) in imagesArr" :key="index">
+              <img class="img" :src="imgsrc" alt="img">
+              <span class="close" @click="imgDel(index)"></span>
+            </div>
+            <el-upload
+              class="sia-img"
+              :action="`${domainUrl}/adm/upload/cloud`"
+              :data="{logic_type: 'estate', token}"
+              name="upload"
+              :show-file-list="false"
+              :on-success="roomAreaUploadSuccess"
+              :before-upload="roomAreaUploadBefore"
+              >
+              <i class="el-icon-plus icon"/>
+            </el-upload>
+          </div>
+        </div>
+      </base-form>
+      <div class="xl-form">
+        <div class="xl-form-footer">
+          <el-button class="xl-form-btn t2" @click="close">关 闭</el-button>
+          <el-button class="xl-form-btn t1" @click="close('confirm')">确定</el-button>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import { arrToObj } from '@/utils'
+export default {
+  components: { },
+  mixins,
+  props: {
+    isShow: Boolean,
+    curObj: Object
+  },
+  inject: ['parentData'],
+  data() {
+    const token = window.sessionStorage.getItem('fp_token')
+    let domainUrl = process.env.VUE_APP_BASE_API
+    return {
+      domainUrl,
+      token,
+      loading: false,
+      formData: [],
+      cObj: {},
+      imagesArr: [],
+    }
+  },
+  watch: {
+    isShow: function(val) {
+      if (val) {
+        this.getDef()
+      }
+    },
+  },
+  methods: {
+    imgDel (index) {
+      this.imagesArr.splice(index, 1)
+    },
+    roomAreaUploadSuccess(res, file) {
+      const data = res.data || {}
+      this.imagesArr.push(`${data.url}`)
+    },
+    roomAreaUploadBefore(file) {
+      const isJPGPNG = file.type === 'image/jpeg' || file.type === 'image/png'
+      const isLt2M = file.size / 1024 / 1024 < 2
+      if (!isJPGPNG) {
+        this.$message.error('上传图片只能是 JPG PNG 格式!')
+      }
+      if (!isLt2M) {
+        this.$message.error('上传图片大小不能超过 2M!')
+      }
+      return isJPGPNG && isLt2M
+    },
+    getDef (str) {
+      let params = {}
+      params = { ...this.curObj }
+      let disabled = false
+      if (params.id) disabled = true
+      this.formData = [
+        { label: '动态内容', key: 'trends_cont', type: 'textarea'},
+      ]
+      this.setDefaultValue(params)
+    },
+    close (str) {
+      if (str === 'confirm') {
+        this.$refs['ruleForm'].$refs['baseForm'].validate((valid) => {
+          if (valid) {
+            const oldform = this.$refs.ruleForm.baseForm
+            const newForm = { ...oldform }
+            if (this.curObj.id) newForm.estate_news_id = this.curObj.id
+            newForm.estate_id = this.parentData.searchForm.estate_id
+            if (this.imagesArr && this.imagesArr.length > 0) newForm.images = this.imagesArr.join(',')
+            let apiStr = 'admestatenewsadd'
+            if (this.curObj.id) apiStr = 'admestatenewsedit'
+            this.$api.house[apiStr](newForm).then(data => {
+              this.$msgs(newForm.id ? '编辑成功' : '新增成功')
+              this.productData = []
+              this.$emit('close', newForm)
+            })
+          }
+        })
+      } else {
+        this.$emit('close')
+        this.productData = []
+        this.setDefaultValue()
+      }
+    },
+  }
+}
+</script>
+<style lang="scss" scoped>
+@import '../../../../styles/libEdit.scss';
+.lib-edit {
+  padding-top: 0;
+  ::v-deep .el-date-editor.el-input {
+    width: 100%;
+  }
+  ::v-deep .el-textarea__inner {
+    height: 300px;
+  }
+}
+
+.scoped-img-area {
+  padding-left: 40px;
+  .sia-op {
+    display: inline-block;
+    vertical-align: middle;
+    margin-right: 10px;
+    margin-bottom: 10px;
+    border: 1px solid #f2f2f2;
+    width: 80px;
+    height: 80px;
+    position: relative;
+    &:hover {
+      .img-big {
+        display: block;
+      }
+    }
+    .img {
+      width: 80px;
+      height: 80px;
+    }
+    .close {
+      position: absolute;
+      width: 20px;
+      height: 20px;
+      top: -10px;
+      right: -10px;
+      background: url(../../../../assets/icon_g_close.png) no-repeat;
+      background-size: 20px;
+      cursor: pointer;
+    }
+    .img-big {
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      width: 400px;
+      height: auto;
+      display: none;
+      box-shadow: 10px 10px 10px #ccc;
+      z-index: 99;
+    }
+  }
+  .sia-img {
+    display: inline-block;
+    vertical-align: middle;
+    width: 80px;
+    height: 80px;
+    overflow: hidden;
+    border: 1px dashed #999;
+    margin-bottom: 10px;
+    .el-icon-plus {
+      color: #999;
+      padding: 30px;
+    }
+  }
+}
+</style>

src/views/house/components/popup/OldEdit.vue

@@ -16,10 +16,11 @@
           <div class="scoped-img-area">
             <div class="sia-op" v-for="(imgsrc,index) in imagesArr" :key="index">
               <img class="img" :src="imgsrc" alt="img">
+              <span class="close" @click="imgDel(index)"></span>
             </div>
             <el-upload
               class="sia-img"
-              :action="`${domainUrl}/adm/upload/picture`"
+              :action="`${domainUrl}/adm/upload/cloud`"
               :data="{logic_type: 'estate', token}"
               name="upload"
               :show-file-list="false"
@@ -92,9 +93,12 @@ export default {
     },
   },
   methods: {
+    imgDel (index) {
+      this.imagesArr.splice(index, 1)
+    },
     roomAreaUploadSuccess(res, file) {
       const data = res.data || {}
-      this.imagesArr.push(`${data.domain}${data.url}?url=${data.url}&id=${data.file_id}`)
+      this.imagesArr.push(`${data.url}`)
     },
     roomAreaUploadBefore(file) {
       const isJPGPNG = file.type === 'image/jpeg' || file.type === 'image/png'
@@ -232,11 +236,36 @@ export default {
     border: 1px solid #f2f2f2;
     width: 80px;
     height: 80px;
-    overflow: hidden;
+    position: relative;
+    &:hover {
+      .img-big {
+        display: block;
+      }
+    }
     .img {
       width: 80px;
       height: 80px;
     }
+    .close {
+      position: absolute;
+      width: 20px;
+      height: 20px;
+      top: -10px;
+      right: -10px;
+      background: url(../../../../assets/icon_g_close.png) no-repeat;
+      background-size: 20px;
+      cursor: pointer;
+    }
+    .img-big {
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      width: 400px;
+      height: auto;
+      display: none;
+      box-shadow: 10px 10px 10px #ccc;
+      z-index: 99;
+    }
   }
   .sia-img {
     display: inline-block;

src/views/house/components/popup/PhotoEdit.vue

@@ -0,0 +1,211 @@
+<template>
+  <div>
+    <el-drawer
+      v-loading="loading"
+      :show-close="false"
+      :title="'编辑相册'"
+      :wrapper-closable="false"
+      :close-on-press-escape="false"
+      :visible.sync="isShow"
+      size="960px"
+      custom-class="xl-drawer"
+      direction="rtl"
+    >
+      <div class="scoped-img-area" v-for="(item, iIndex) in imagesArr" :key="iIndex">
+        <div class="sia-title">{{item.key}}</div>
+        <div class="sia-op" v-for="(imgsrc,index) in item.urls" :key="index">
+          <img class="img" :src="imgsrc" alt="img">
+          <span class="close" @click="imgDel(iIndex, index)"></span>
+        </div>
+        <el-upload
+          class="sia-img"
+          :action="`${domainUrl}/adm/upload/cloud`"
+          :data="{logic_type: 'estate', token}"
+          name="upload"
+          :show-file-list="false"
+          :on-success="roomAreaUploadSuccess"
+          :before-upload="roomAreaUploadBefore"
+          >
+          <i class="el-icon-plus icon" @click="addImgHandle(iIndex)" />
+        </el-upload>
+      </div>
+      <div class="xl-form">
+        <div class="xl-form-footer fixed" style="width:960px;padding-top: 20px;border-top: 1px solid #dcdcdc;right:0;">
+          <el-button class="xl-form-btn t2" @click="close">关 闭</el-button>
+          <el-button class="xl-form-btn t1" @click="close('confirm')">确定</el-button>
+        </div>
+      </div>
+    </el-drawer>
+  </div>
+</template>
+<script>
+import { arrToObj } from '@/utils'
+export default {
+  components: { },
+  mixins,
+  props: {
+    isShow: Boolean,
+    curObj: Object
+  },
+  inject: ['parentData'],
+  data() {
+    let domainUrl = process.env.VUE_APP_BASE_API
+    const token = window.sessionStorage.getItem('fp_token')
+    const imagesArr = this.$dictData.estate_photo
+    return {
+      domainUrl,
+      token,
+      loading: false,
+      formData: [],
+      cObj: {},
+      isShowMap: false,
+      imagesArr,
+      curIndex: 0,
+    }
+  },
+  watch: {
+    isShow: function(val) {
+      if (val) {
+        if (this.curObj.id) {
+          this.loading = true
+          this.$api.house.admestatephotolist({estate_id: this.curObj.id}).then(res => {
+            let curArr = res ? JSON.parse(res) : []
+            curArr.forEach(item => {
+              this.imagesArr.map(one => {
+                if (item.val === one.val) {
+                  one.urls = item.urls
+                }
+              })
+            })
+            this.imagesArr = [...this.imagesArr]
+            this.loading = false
+          }).catch(err => {
+            this.loading = false
+          })
+        }
+      }
+    },
+  },
+  methods: {
+    addImgHandle (index) {
+      this.curIndex = index
+    },
+    imgDel (iIndex, index) {
+      this.imagesArr[iIndex].urls.splice(index, 1)
+      this.imagesArr = [...this.imagesArr]
+    },
+    roomAreaUploadSuccess(res, file) {
+      const data = res.data || {}
+      let urls = this.imagesArr[this.curIndex].urls || []
+      urls.push(`${data.url}`)
+      this.imagesArr[this.curIndex].urls = urls
+      this.imagesArr = [...this.imagesArr]
+    },
+    roomAreaUploadBefore(file) {
+      const isJPGPNG = file.type === 'image/jpeg' || file.type === 'image/png'
+      const isLt2M = file.size / 1024 / 1024 < 2
+      if (!isJPGPNG) {
+        this.$message.error('上传图片只能是 JPG PNG 格式!')
+      }
+      if (!isLt2M) {
+        this.$message.error('上传图片大小不能超过 2M!')
+      }
+      return isJPGPNG && isLt2M
+    },
+    close (str) {
+      if (str === 'confirm') {
+        const newForm = { }
+        if (this.curObj.id) newForm.estate_id = this.curObj.id
+        let cArr = []
+        this.imagesArr.forEach(obj => {
+          const imgArr = obj.urls || []
+          if (imgArr.length > 0) {
+            cArr.push({
+              key: obj.key,
+              val: obj.val,
+              urls: imgArr
+            })
+          } 
+        })
+        newForm.images = JSON.stringify(cArr)
+        let apiStr = 'admestatephotoedit'
+        if (this.curObj.id) apiStr = 'admestatephotoedit'
+        this.$api.house[apiStr](newForm).then(data => {
+          this.$msgs(newForm.id ? '编辑成功' : '新增成功')
+          this.$emit('close', newForm)
+          this.imagesArr = this.$dictData.estate_photo
+          this.curIndex = 0
+        })
+      } else {
+        this.$emit('close')
+        this.imagesArr = this.$dictData.estate_photo
+        this.curIndex = 0
+      }
+    },
+  }
+}
+</script>
+<style lang="scss" scoped>
+.scoped-img-area {
+  padding-left: 20px;
+  margin-bottom: 20px;
+  .sia-title {
+    font-size: 16px;
+    padding-bottom: 10px;
+    color: #666;
+    font-weight: bold;
+  }
+  .sia-op {
+    display: inline-block;
+    vertical-align: middle;
+    margin-right: 10px;
+    margin-bottom: 10px;
+    border: 1px solid #f2f2f2;
+    width: 80px;
+    height: 80px;
+    position: relative;
+    &:hover {
+      .img-big {
+        display: block;
+      }
+    }
+    .img {
+      width: 80px;
+      height: 80px;
+    }
+    .close {
+      position: absolute;
+      width: 20px;
+      height: 20px;
+      top: -10px;
+      right: -10px;
+      background: url(../../../../assets/icon_g_close.png) no-repeat;
+      background-size: 20px;
+      cursor: pointer;
+    }
+    .img-big {
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      width: 400px;
+      height: auto;
+      display: none;
+      box-shadow: 10px 10px 10px #ccc;
+      z-index: 99;
+    }
+  }
+  .sia-img {
+    display: inline-block;
+    vertical-align: middle;
+    width: 80px;
+    height: 80px;
+    overflow: hidden;
+    border: 1px dashed #999;
+    margin-bottom: 10px;
+    .el-icon-plus {
+      color: #999;
+      padding: 30px;
+    }
+  }
+}
+</style>

src/views/house/components/searchForm/News.vue

@@ -0,0 +1,42 @@
+<template>
+  <base-form slot="content" ref="ruleForm" :data="searchData">
+    <div slot="footer">
+      <el-button :loading="listLoading" icon="el-icon-search" class="xl-form-btn bgc1" @click="searchHandle">查询</el-button>
+      <!-- <el-button :loading="listLoading" icon="el-icon-document" class="xl-form-btn bgc2" @click="toExportExcel">导出{{ this.$route.meta.title }}信息</el-button> -->
+    </div>
+  </base-form>
+</template>
+<script>
+export default {
+  props: {
+    listLoading: Boolean
+  },
+  inject: ['parentData'],
+  mixins,
+  data() {
+    return {
+      searchData: []
+    }
+  },
+  mounted () {
+    this.getDef()
+  },
+  methods: {
+    subwayLineChange (val) {
+      this.getDef('change')
+    },
+    getDef (str) {
+      let params = { ...this.$refs.ruleForm.baseForm }
+      this.searchData = [
+        { label: '内容', key: 'trends_cont' },
+      ]
+      this.setDefaultValue(params, 'searchData')
+    },
+    searchHandle() {
+      const oldform = this.$refs.ruleForm.baseForm
+      const newForm = { ...oldform }
+      this.$emit('change', newForm)
+    }
+  }
+}
+</script>

src/views/house/index.vue

@@ -14,18 +14,25 @@
       @currentChange="pageHandle"
       :isAdd="true"
       @add="openPopup"
+      :operationsDefaultLength="4"
     />
     <popup-edit
       :isShow="isDtlShow"
       :curObj="curObj"
       @close="closePopup"
     />
+    <photo-edit
+      :isShow="isPhotoShow"
+      :curObj="curObj"
+      @close="closePhotoPopup"
+    />
   </div>
 </template>
 <script>
 import { arrToObj } from '@/utils'
 import SearchForm from './components/searchForm/Index'
 import PopupEdit from './components/popup/IndexEdit'
+import PhotoEdit from './components/popup/PhotoEdit'
 import baseTable from '_m/baseTable.js'
 import xData from './mixin'
 export default {
@@ -33,6 +40,7 @@ export default {
   components: {
     SearchForm,
     PopupEdit,
+    PhotoEdit,
   },
   provide() {
     return {
@@ -45,6 +53,7 @@ export default {
       apiStr: 'house.admestatelist',
       searchForm: null,
       isDtlShow: false,
+      isPhotoShow: false,
       // noCreated: true,
       curObj: {},
       ...xData
@@ -91,9 +100,11 @@ export default {
         { label: '创建时间', prop: 'create_at' },
         { label: '更新人', prop: 'update_by' },
         { label: '更新时间', prop: 'update_at' },
-        { label: '操作', width: 120, type: 'handle2', operations:
+        { label: '操作', width: 300, type: 'handle2', operations:
           [
-            { label: '编辑', func: this.openPopup, btnType: 'primary' },
+            { label: '编辑信息', func: this.openPopup, btnType: 'primary' },
+            { label: '编辑相册', func: this.openPhotoPopup, btnType: 'success' },
+            { label: '楼盘动态', func: this.openNews, btnType: 'info' },
             { label: '删除', func: this.delHandle, btnType: 'danger' },
           ]
         }
@@ -112,6 +123,23 @@ export default {
         })
       }, null, true)
     },
+    openNews (item) {
+      this.$router.push('/house/news?id=' + item.id)
+    },
+    openPhotoPopup(row) {
+      if (row && row.id) {
+        this.curObj = row
+      } else {
+        this.curObj = {}
+      }
+      this.isPhotoShow = true
+    },
+    closePhotoPopup(obj) {
+      this.isPhotoShow = false
+      if (obj) {
+        this.fetchData()
+      }
+    },
     openPopup(row) {
       if (row && row.id) {
         this.curObj = row

src/views/house/news.vue

@@ -0,0 +1,106 @@
+<template>
+  <div class="app-container">
+    <!-- <search-form
+      :list-loading="listLoading"
+      @change="searchHandle"
+    /> -->
+    <table-list
+      :list-loading="listLoading"
+      :data="tableData2"
+      :columns="listConfig"
+      :current-page="currentPage"
+      :page-size="pageSize"
+      :total-records="totalRecords"
+      @currentChange="pageHandle"
+      :isAdd="true"
+      @add="openPopup"
+    />
+    <popup-edit
+      :isShow="isDtlShow"
+      :curObj="curObj"
+      @close="closePopup"
+    />
+  </div>
+</template>
+<script>
+import { arrToObj } from '@/utils'
+import SearchForm from './components/searchForm/News'
+import PopupEdit from './components/popup/NewsEdit'
+import baseTable from '_m/baseTable.js'
+export default {
+  name: 'HouseNews',
+  components: {
+    SearchForm,
+    PopupEdit,
+  },
+  provide() {
+    return {
+      parentData: this
+    }
+  },
+  mixins: [baseTable],
+  data() {
+    return {
+      apiStr: 'house.admestatenewslist',
+      searchForm: {},
+      isDtlShow: false,
+      // noCreated: true,
+      curObj: {},
+    }
+  },
+  computed: {
+    tableData2() {
+      const arr = [...this.tableData]
+      arr.map(item => {})
+      return arr
+    }
+  },
+  created() {
+    const query = this.$route.query
+    this.searchForm.estate_id = query.id || ''
+  },
+  mounted() {
+    this.listConfig = {
+      rows: [
+        { label: '创建时间', prop: 'create_at' },
+        { label: '动态内容', prop: 'trends_cont', minWidth: '500', align: 'left' },
+        { label: '创建人', prop: 'create_by' },
+        { label: '更新人', prop: 'update_by' },
+        { label: '更新时间', prop: 'update_at' },
+        { label: '操作', width: 120, type: 'handle2', operations:
+          [
+            { label: '编辑', func: this.openPopup, btnType: 'primary' },
+            // { label: '删除', func: this.delHandle, btnType: 'danger' },
+          ]
+        }
+      ]
+    }
+  },
+  methods: {
+    delHandle(row) {
+      this.$msg(`您确定要删除该楼盘吗？`, 'confirm', () => {
+        this.$api.house.admestatenewsdel({
+          id: row.id,
+        }).then(data => {
+          this.$msgs(`已删除！`)
+          this.fetchData()
+        })
+      }, null, true)
+    },
+    openPopup(row) {
+      if (row && row.id) {
+        this.curObj = row
+      } else {
+        this.curObj = {}
+      }
+      this.isDtlShow = true
+    },
+    closePopup(obj) {
+      this.isDtlShow = false
+      if (obj) {
+        this.fetchData()
+      }
+    }
+  }
+}
+</script>