product_wx/pages/subPackages/surroundingReleases/components/newRelease_com.vue

<template>
  <div class="newRelease_com">
    <ul class="predetermineUl">
      <li class="predetermineLi2" style="border-bottom: none">
        <div class="liName">标题</div>
        <van-field
            :value="postData.constant"
            autosize
            type="textarea"
            placeholder="请输入"
            class="myField"
            maxlength="50"
            show-word-limit
        />
      </li>
    </ul>
    <ul class="predetermineUl">
      <li class="detailLi2" style="border-bottom: none">
            <span class="liName">
              快捷选择
            </span>
        <div class="detailLi2Box">
          <div class="detailLi2BoxTop">
            <div class="checkItem" :class="checkedName===item.label?'checked':''" v-for="item in checkList" :key="item.id" @click="clickCheck(item)">{{item.label}}</div>
          </div>
        </div>
      </li>
      <li class="detailLi">
        <span class="liName">地址</span>
        <span >
               <input class="liInfo" placeholder="选择地址" disabled>
               <van-icon name="location" style="color: rgba(51, 51, 51, 0.90)"/>
            </span>
      </li>
      <li class="detailLi" style="border-bottom: none">
        <span class="liName">电话</span>
        <span >
               <input class="liInfo" placeholder="请填写">
            </span>
      </li>
    </ul>
    <ul class="predetermineUl">
      <li class="detailLi2">
        <div class="titleBox" style="margin-bottom: 24rpx">
          <span class="liName">简介</span>
          <span class="tips">（支持图片上传限20M内，最多1张）</span>
        </div>
        <van-uploader
            :max-count="12"
            @delete="deleteRYXXZP"
            :file-list="fileList"
            @after-read="uploadRYXXZP"
            :show-upload="true"
        />
        <van-field
            :value="postData.constant"
            autosize
            type="textarea"
            placeholder="请输入"
            class="myField"
            maxlength="2000"
            show-word-limit
        />
      </li>
    </ul>
    <div class="buttonBox">
      <button class="btn zcBtn">暂存</button>
      <button class="btn tjBtn">发布</button>
    </div>
  </div>
</template>

<script>
import { getByCodes, peripheryAdd, getUserLocalStorageInfo} from "@/js_sdk/http";
export default {
  name: "newRelease_com",
  data(){
    return{
      dc_key: ['periphery_type'],
      fileList:[],
      checkList:[],
      postData:{},
      checkedName:'干洗'
    }
  },
  created(){
    this.getByCodes()
  },
  methods:{
    async getByCodes() {
      let data = await getByCodes(JSON.stringify(this.dc_key));
      this.dic_SelectList = this.$common.handleDicList(data);
      this.checkList = this.dic_SelectList.periphery_type
      console.log('checkList',this.checkList)
    },
    clickCheck(item){
      this.checkedName = item.label
    },
    deleteRYXXZP(event) {
      this.fileList.splice(event.detail.index, 1);
      this.$forceUpdate();
    },
    uploadRYXXZP(event) {
      console.log(event)
      let that = this;
      const { file } = event.detail;
      uni.uploadFile({
        url: that.$constant.BASE_URI + "/wx/fileController/upload",
        filePath: file.url,
        name: "file",
        formData: { user: "test" },
        success(res) {
          // 上传完成需要更新 fileList
          let data = JSON.parse(res.data);
          console.log('data',data)
          that.fileList.push({
            imgUrl: "/FileController/download/" + data.data[0],
            id: data.data[0],
            url:
                that.$constant.BASE_URI +
                "/FileController/download/" +
                data.data[0],
            isImage: true,
          });
        },
        fail(res) {},
      });
    },
  }
}
</script>

<style scoped>

</style>