iview日期固定为周

<!-- 食谱公布表 -->
<template>
  <div id="economicDemocratic">
    <cus-card :showTitle="false" :customStyle="{ width: '100%' }">
      <div style="display: flex; height: 80px; padding-top: 30px">
        <span
          style="
            font-size: 16px;
            height: 40px;
            line-height: 40px;
            margin-right: 9px;
          "
          >起始日期:</span
        >
        <Row>
          <Col span="12">
            <DatePicker
              :options="beginOptions"
              type="date"
              placeholder="请输入起始时间"
              style="width: 200px;margin-right:20px"
              v-model="form.beginTime"
              format="yyyy-MM-dd"
              @on-change="startChange"
            ></DatePicker>
          </Col>
          <Col span="12">
            <DatePicker
              :disabled="readOnly"
              readonly
              type="date"
              placeholder="起始时间确认后自动选中"
              style="width: 200px"
              :value="form.endTime"
              format="yyyy-MM-dd"
            ></DatePicker>
          </Col>
          <!-- <Col span="12">
            <button @click="showExcel = !showExcel">显示图表</button>
          </Col>-->
        </Row>
        <Button @click="urlBack" type="primary" style="margin: 2px 0 0 10px">
          食谱查询
          <Icon type="ios-arrow-forward" />
        </Button>
      </div>
      <div></div>
    </cus-card>
    <!-- <div style="width: 1000px; height: 1000px; border: 1px solid pink" v-if="showExcel">
      <iframe frameborder="0" v-if="showExcel" src="https://hbzc-oss-2021.oss-cn-shenzhen.aliyuncs.com/commentApp/%E6%9C%88%E4%BC%99%E9%A3%9F%E5%85%AC%E5%B8%83%E8%A1%A8.xlsx" width="100%" height="1000px">文件名</iframe>
    </div> -->
  </div>
</template>

<script>
import { getDataOutput } from "@/api/business/manager";

export default {
  data() {
    return {
      form: {
        beginTime: "",
        endTime: "",
        type: 9,
      },
      showExcel: false,
    };
  },
  created() {},
  mounted() {},
  methods: {
    // 食谱公布表接口 type=9
    getDataOutputApi() {
      return new Promise((resolve) => {
        getDataOutput(this.times).then((res) => {
          if (res.retCode == 2000) {
            this.url.pdf = res.data;
            this.downloads(res.data);
            console.log(this.url.pdf);
          }
          resolve();
        });
      });
    },
    datePicker(date) {
      this.times.begin = date[0];
      this.times.end = date[1];
      this.getDataOutputApi();
    },
    // 下载报表
    downloads(url) {
      const iframe = document.createElement("iframe");
      iframe.style.display = "none";
      function iframeLoad() {
        const win = iframe.contentWindow;
        const doc = win.document;
        if (win.location.href === url) {
          if (doc.body.childNodes.length > 0) {
          }
          iframe.parentNode.removeChild(iframe);
        }
      }
      iframe.src = "";
      document.body.appendChild(iframe);
      setTimeout(function loadUrl() {
        iframe.contentWindow.location.href = url;
      }, 50);
      //   throw new Error("Method not implemented.");
    },
    urlBack() {
      window.open("http://192.168.0.188:4200/#/recipe-manage/recipe-query");
    },
    // 起始日期修改
    startChange(val1) {
      var date1 = new Date(val1);
      var date2 = new Date(date1);
      date2.setDate(date1.getDate() + 6);
      //num是正数表示之后的时间,num负数表示之前的时间,0表示今天
      this.form.endTime =
        this.addZero(date2.getFullYear()) +
        "-" +
        this.addZero(date2.getMonth() + 1) +
        "-" +
        this.addZero(date2.getDate());
    },
    // 日期补零
    addZero(num) {
      //补0
      if (parseInt(num) < 10) {
        num = "0" + num;
      }
      return num;
    },
  },
  watch: {},
  computed: {
    beginOptions() {
      return {
        disabledDate(date) {
          let num = new Date(date).getDay();
          return num != 1;
        },
      };
    },
  },
};
</script>

<style  scoped>
</style>
<FormItem label="起始时间" prop="beginTime" :label-width="100">
                    <DatePicker :disabled="readOnly" :options="beginOptions" type="date" placeholder="请输入起始时间" style="width: 200px" v-model="form.beginTime" format="yyyy-MM-dd" @on-change="startChange"></DatePicker>
                </FormItem>
                <FormItem label="结束时间" :label-width="120" prop="endTime">
                    <DatePicker :disabled="readOnly" readonly type="date" placeholder="起始时间确认后自动选中" style="width: 200px" :value="form.endTime" format="yyyy-MM-dd"></DatePicker>
         </FormItem>

// 起始日期修改
        startChange(val1) {
            var date1 = new Date(val1);
            var date2 = new Date(date1);
            date2.setDate(date1.getDate() + 6);
            //num是正数表示之后的时间,num负数表示之前的时间,0表示今天
            this.form.endTime = this.addZero(date2.getFullYear()) + "-" + this.addZero((date2.getMonth() + 1)) + "-" + this.addZero(date2.getDate());
        },

addZero(num){//补0
            if(parseInt(num) < 10){
                num = '0'+num;
            }
            return num;
        },

computed: {
      beginOptions() {
        return {
          disabledDate(date) {
            let num = new Date(date).getDay();
            return num != 1;
          }
        }
      }
    },

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

韩召华

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值