智慧农业后台管理页面
shuishen
2022-07-29 d6a0abe9024f87fc517a2b71df0f17c5cadc41a0
src/views/farmplant/process.vue
@@ -1,6 +1,6 @@
<template>
  <div class="body">
    <!-- <div class="search">
    <div class="body">
        <!-- <div class="search">
      <el-form :inline="true" :model="formInline" class="demo-form-inline" size="small">
        <el-form-item label="审批人">
          <el-input v-model="formInline.user" placeholder="审批人"></el-input>
@@ -15,782 +15,780 @@
          <el-button type="primary" @click="onSubmit">查询</el-button>
        </el-form-item>
      </el-form>
    </div> -->
    <div class="table">
      <div class="content">
        <div class="farm" v-for="(item, index) in data" :key="index">
          <div class="farm-img"><img :src="item.tpurl" class="img"/></div>
          <!-- <div class="farm-img">
        </div>-->
        <div class="table">
            <div class="content">
                <div class="farm" v-for="(item, index) in data" :key="index">
                    <div class="farm-img">
                        <img :src="item.tpurl" class="img" />
                    </div>
                    <!-- <div class="farm-img">
            <img src="../../../public/img/map.png" class="img" />
          </div> -->
          <div class="cai">{{ item.processName }}</div>
          <div class="area">库存量:<span>{{ item.processNum }}</span>公斤</div>
<!--          <div class="btn">-->
<!--            <el-button style="width: 65px;" plain size="small" @click="openWindow(0,item)">-->
<!--              <span style="color: #5abf78">销售</span></el-button-->
<!--            >-->
<!--            <el-button style="width: 65px;padding-left:8px" plain size="small" @click="openWindow(1,item)">-->
<!--              <span>库存损耗</span>-->
<!--            </el-button-->
<!--            >-->
<!--          </div>-->
<!--          <div class="btn">-->
<!--            <el-button style="width: 65px;" plain size="small"-->
<!--            ><span style="color: #5abf78">出库</span></el-button-->
<!--            >-->
<!--            <el-button style="width: 65px;" plain size="small" @click="openWindow(2,item)">-->
<!--              加工-->
<!--            </el-button>-->
<!--          </div>-->
                    </div>-->
                    <div class="cai">{{ item.processName }}</div>
                    <div class="area">
                        库存量:
                        <span>{{ item.processNum }}</span>公斤
                    </div>
                    <!--          <div class="btn">-->
                    <!--            <el-button style="width: 65px;" plain size="small" @click="openWindow(0,item)">-->
                    <!--              <span style="color: #5abf78">销售</span></el-button-->
                    <!--            >-->
                    <!--            <el-button style="width: 65px;padding-left:8px" plain size="small" @click="openWindow(1,item)">-->
                    <!--              <span>库存损耗</span>-->
                    <!--            </el-button-->
                    <!--            >-->
                    <!--          </div>-->
                    <!--          <div class="btn">-->
                    <!--            <el-button style="width: 65px;" plain size="small"-->
                    <!--            ><span style="color: #5abf78">出库</span></el-button-->
                    <!--            >-->
                    <!--            <el-button style="width: 65px;" plain size="small" @click="openWindow(2,item)">-->
                    <!--              加工-->
                    <!--            </el-button>-->
                    <!--          </div>-->
                </div>
            </div>
        </div>
      </div>
        <div class="el-page">
            <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="page.currentPage"
                :hide-on-single-page="value"
                :page-size="page.pageSize"
                background
                layout="total, prev, pager, next"
                :total="page.total"
            ></el-pagination>
        </div>
        <el-dialog
            title="农产品销售"
            :modal-append-to-body="false"
            :append-to-body="true"
            :close-on-click-modal="false"
            :before-close="cleanData"
            @close="close"
            width="30%"
            :visible.sync="visible"
            center
        >
            <avue-form ref="form" v-model="form" :option="option">
                <template slot-scope="{disabled,size}" slot="name">
                    <div>
                        <el-tag type="success">{{ form.name }}</el-tag>
                    </div>
                </template>
                <template slot-scope="{disabled,size}" slot="saleDestination">
                    <div>
                        <el-cascader
                            style="width: 100%;"
                            placeholder="请选择销售去向"
                            size="large"
                            :options="options"
                            @change="handleChange"
                            v-model="saleDestination"
                        ></el-cascader>
                    </div>
                </template>
                <template slot-scope="{disabled,size}" slot="saleNum">
                    <div style="margin-bottom: -20px">
                        <el-input type="number" placeholder="请输入销售数量" v-model="form.saleNum">
                            <i slot="suffix" style="font-style:normal;margin-right: 5px;">公斤</i>
                        </el-input>
                        <div style="text-align: right;color: #ffb218">可销售量:{{ form.weight }}公斤</div>
                    </div>
                </template>
                <template slot-scope="{disabled,size}" slot="salePrice">
                    <div style="margin-bottom: -20px">
                        <el-input type="number" placeholder="请输入销售价格" v-model="form.salePrice">
                            <i slot="suffix" style="font-style:normal;margin-right: 5px;">元/公斤</i>
                        </el-input>
                    </div>
                </template>
                <template slot="menuForm">
                    <div style="text-align: center">
                        <el-button style="width: 120px" type="success" plain @click="submitSole">销售</el-button>
                    </div>
                </template>
            </avue-form>
        </el-dialog>
        <el-dialog
            title="农产品库存损耗"
            :modal-append-to-body="false"
            :append-to-body="true"
            :close-on-click-modal="false"
            @close="close"
            width="30%"
            :before-close="cleanKCData"
            :visible.sync="visibleKC"
            center
        >
            <avue-form ref="form" v-model="formKC" :option="optionKC">
                <template slot-scope="{disabled,size}" slot="name">
                    <div>
                        <el-tag type="success">{{ formKC.name }}</el-tag>
                    </div>
                </template>
                <template slot-scope="{disabled,size}" slot="saleNum">
                    <div style="margin-bottom: -20px">
                        <el-input type="number" placeholder="请输入损耗数量" v-model="formKC.saleNum">
                            <i slot="suffix" style="font-style:normal;margin-right: 5px;">公斤</i>
                        </el-input>
                        <div style="text-align: right;color: #ffb218">库存量:{{ formKC.weight }}公斤</div>
                    </div>
                </template>
                <template slot="menuForm">
                    <div style="text-align: center">
                        <el-button style="width: 80px" plain @click="cleanKCData">取消</el-button>
                        <el-button style="width: 80px" type="success" plain @click="submitKCloss">确认</el-button>
                    </div>
                </template>
            </avue-form>
        </el-dialog>
        <el-dialog
            title="加工产品"
            :modal-append-to-body="false"
            :append-to-body="true"
            :close-on-click-modal="false"
            @close="close"
            width="30%"
            :before-close="cleanJGData"
            :visible.sync="visibleJG"
            center
        >
            <avue-form ref="form" v-model="formJG" :option="optionJG">
                <template slot-scope="{disabled,size}" slot="name">
                    <div>
                        <el-tag type="success">{{ formJG.name }}</el-tag>
                    </div>
                </template>
                <template slot-scope="{disabled,size}" slot="saleNum">
                    <div style="margin-bottom: -20px">
                        <el-input type="number" placeholder="请输入加工数量" v-model="formJG.saleNum">
                            <i slot="suffix" style="font-style:normal;margin-right: 5px;">公斤</i>
                        </el-input>
                        <div style="text-align: right;color: #ffb218">库存量:{{ formJG.weight }}公斤</div>
                    </div>
                </template>
                <template slot-scope="{disabled,size}" slot="processNum">
                    <div style="margin-bottom: -20px">
                        <el-input type="number" placeholder="请输入产品数量" v-model="formJG.processNum">
                            <i slot="suffix" style="font-style:normal;margin-right: 5px;">公斤</i>
                        </el-input>
                    </div>
                </template>
                <template slot="menuForm">
                    <div style="text-align: center">
                        <el-button style="width: 80px" plain @click="cleanKCData">取消</el-button>
                        <el-button style="width: 80px" type="success" plain @click="submitJGloss">确认</el-button>
                    </div>
                </template>
            </avue-form>
        </el-dialog>
    </div>
    <div class="el-page">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="page.currentPage"
        :hide-on-single-page="value"
        :page-size="page.pageSize"
        background
        layout="total, prev, pager, next"
        :total="page.total"
      >
      </el-pagination>
    </div>
    <el-dialog
      title="农产品销售"
      :modal-append-to-body="false"
      :append-to-body="true"
      :close-on-click-modal="false"
      :before-close="cleanData"
      @close="close"
      width="30%"
      :visible.sync="visible"
      center
    >
      <avue-form ref="form" v-model="form" :option="option">
        <template slot-scope="{disabled,size}" slot="name">
          <div>
            <el-tag type="success">{{ form.name }}</el-tag>
          </div>
        </template>
        <template slot-scope="{disabled,size}" slot="saleDestination">
          <div>
            <el-cascader
              style="width: 100%;"
              placeholder="请选择销售去向"
              size="large"
              :options="options"
              @change="handleChange"
              v-model="saleDestination">
            </el-cascader>
          </div>
        </template>
        <template slot-scope="{disabled,size}" slot="saleNum">
          <div style="margin-bottom: -20px">
            <el-input type="number" placeholder="请输入销售数量" v-model="form.saleNum"><i slot="suffix"
                                                                                    style="font-style:normal;margin-right: 5px;">公斤</i>
            </el-input>
            <div style="text-align: right;color: #ffb218">可销售量:{{ form.weight }}公斤</div>
          </div>
        </template>
        <template slot-scope="{disabled,size}" slot="salePrice">
          <div style="margin-bottom: -20px">
            <el-input type="number" placeholder="请输入销售价格" v-model="form.salePrice"><i slot="suffix"
                                                                                      style="font-style:normal;margin-right: 5px;">元/公斤</i>
            </el-input>
          </div>
        </template>
        <template slot="menuForm">
          <div style="text-align: center">
            <el-button style="width: 120px" type="success" plain @click="submitSole">销售</el-button>
          </div>
        </template>
      </avue-form>
    </el-dialog>
    <el-dialog
      title="农产品库存损耗"
      :modal-append-to-body="false"
      :append-to-body="true"
      :close-on-click-modal="false"
      @close="close"
      width="30%"
      :before-close="cleanKCData"
      :visible.sync="visibleKC"
      center
    >
      <avue-form ref="form" v-model="formKC" :option="optionKC">
        <template slot-scope="{disabled,size}" slot="name">
          <div>
            <el-tag type="success">{{ formKC.name }}</el-tag>
          </div>
        </template>
        <template slot-scope="{disabled,size}" slot="saleNum">
          <div style="margin-bottom: -20px">
            <el-input type="number" placeholder="请输入损耗数量" v-model="formKC.saleNum"><i slot="suffix"
                                                                                      style="font-style:normal;margin-right: 5px;">公斤</i>
            </el-input>
            <div style="text-align: right;color: #ffb218">库存量:{{ formKC.weight }}公斤</div>
          </div>
        </template>
        <template slot="menuForm">
          <div style="text-align: center">
            <el-button style="width: 80px" plain @click="cleanKCData">取消</el-button>
            <el-button style="width: 80px" type="success" plain @click="submitKCloss">确认</el-button>
          </div>
        </template>
      </avue-form>
    </el-dialog>
    <el-dialog
      title="加工产品"
      :modal-append-to-body="false"
      :append-to-body="true"
      :close-on-click-modal="false"
      @close="close"
      width="30%"
      :before-close="cleanJGData"
      :visible.sync="visibleJG"
      center
    >
      <avue-form ref="form" v-model="formJG" :option="optionJG">
        <template slot-scope="{disabled,size}" slot="name">
          <div>
            <el-tag type="success">{{ formJG.name }}</el-tag>
          </div>
        </template>
        <template slot-scope="{disabled,size}" slot="saleNum">
          <div style="margin-bottom: -20px">
            <el-input type="number" placeholder="请输入加工数量" v-model="formJG.saleNum"><i slot="suffix"
                                                                                      style="font-style:normal;margin-right: 5px;">公斤</i>
            </el-input>
            <div style="text-align: right;color: #ffb218">库存量:{{ formJG.weight }}公斤</div>
          </div>
        </template>
        <template slot-scope="{disabled,size}" slot="processNum">
          <div style="margin-bottom: -20px">
            <el-input type="number" placeholder="请输入产品数量" v-model="formJG.processNum"><i slot="suffix"
                                                                                      style="font-style:normal;margin-right: 5px;">公斤</i>
            </el-input>
          </div>
        </template>
        <template slot="menuForm">
          <div style="text-align: center">
            <el-button style="width: 80px" plain @click="cleanKCData">取消</el-button>
            <el-button style="width: 80px" type="success" plain @click="submitJGloss">确认</el-button>
          </div>
        </template>
      </avue-form>
    </el-dialog>
  </div>
</template>
<script>
import {
  getList,
} from "@/api/process/process";
    getList,
} from "@/api/process/process"
import {
  add, addKC
} from "@/api/sale/sale";
    add, addKC
} from "@/api/sale/sale"
import {
  addjg
} from "@/api/process/process";
import {mapGetters} from "vuex";
import {regionData} from 'element-china-area-data'
    addjg
} from "@/api/process/process"
import { mapGetters } from "vuex"
import { regionData } from 'element-china-area-data'
export default {
  data() {
    return {
      options: regionData,
      formInline: {
        user: "",
        region: "",
      },
      form: {
        name: "",
        proid:"",
        landId:"",
        strainId: "",
        saleTime: "",
        saleNum: "",
        saleDestination: "",
        city: "",
        county: "",
        salePrice: "",
        createUser: "",
        saleBrand: "",
      },
      //损耗字段
      formKC: {
        name: "",
        proid:"",
        landId:"",
        strainId: "",
        saleNum: "",
        remarks: "",
        reason: "0",
        lossTime: "",
      },
      //加工字段
      formJG: {
        name: "",
        proid:"",
        landId:"",
        strainId: "",
        saleNum: "",
        processNum: "",
        remarks: "",
        reason: "0",
        saleTime: "",
      },
      visible: false,
      visibleKC: false,
      visibleJG: false,
      value: true,
      page: {
        pageSize: 16,
        currentPage: 1,
        total: 0,
      },
      option: {
        emptyBtn: false,
        submitBtn: false,
        gutter: 30,
        column: [
          {
            label: "种养品种",
            prop: "strainName",
            span: 24,
            disabled: true,
            rules: [
              {
                required: true,
                message: "请输入种养品种",
                trigger: "blur",
              },
            ],
          },
          {
            label: "销售时间",
            prop: "saleTime",
            type: "date",
            span: 24,
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            rules: [
              {
                required: true,
                message: "请选择销售时间",
                trigger: "blur",
              },
            ],
          },
          {
            label: "销售数量",
            prop: "saleNum",
            type: "number",
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入销售数量",
                trigger: "blur",
              },
            ],
          },
          {
            label: "销售去向",
            prop: "saleDestination",
            span: 24,
            rules: [
              {
                required: true,
                message: "请选择销售去向",
                trigger: "blur",
              },
            ],
          },
          {
            label: "销售价格",
            prop: "salePrice",
            span: 24,
            type: "number",
          },
          {
            label: "品牌",
            prop: "saleBrand",
            span: 24,
          },
          {
            label: "操作人",
            prop: "name",
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入操作人",
                trigger: "blur",
              },
            ],
          },
        ]
      },
      optionKC: {
        emptyBtn: false,
        submitBtn: false,
        gutter: 30,
        column: [
          {
            label: "损耗品种",
            prop: "strainName",
            span: 24,
            disabled: true,
            rules: [
              {
                required: true,
                message: "请输入损耗品种",
                trigger: "blur",
              },
            ],
          },
          {
            label: "损耗时间",
            prop: "lossTime",
            type: "date",
            span: 24,
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            rules: [
              {
                required: true,
                message: "请选择损耗时间",
                trigger: "blur",
              },
            ],
          },
          {
            label: "损耗数量",
            prop: "saleNum",
            type: "number",
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入损耗数量",
                trigger: "blur",
              },
            ],
          },
          {
            label: "损耗原因",
            prop: "reason",
            span: 24,
            type: "select",
            value: "0",
            dicData: [
              {
                label: "库存损耗",
                value: "0",
              }],
            rules: [
              {
                required: true,
                message: "请选择损耗原因",
                trigger: "blur",
              },
            ],
          },
          {
            label: "备注",
            prop: "remarks",
            span: 24,
          },
          {
            label: "操作人",
            prop: "name",
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入操作人",
                trigger: "blur",
              },
            ],
          },
        ]
      },
      optionJG: {
        emptyBtn: false,
        submitBtn: false,
        gutter: 30,
        column: [
          {
            label: "加工品种",
            prop: "strainName",
            span: 24,
            disabled: true,
            rules: [
              {
                required: true,
                message: "请输入加工品种",
                trigger: "blur",
              },
            ],
          },
          {
            label: "加工时间",
            prop: "saleTime",
            type: "date",
            span: 24,
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            rules: [
              {
                required: true,
                message: "请选择加工时间",
                trigger: "blur",
              },
            ],
          },
          {
            label: "加工数量",
            prop: "saleNum",
            type: "number",
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入加工数量",
                trigger: "blur",
              },
            ],
          },
          {
            label: "加工产品",
            prop: "processId",
            span: 24,
            type: "tree",
            dicUrl: "/api/machining/machining/selectInfo",
            props: {
              label: "processName",
              value: "processId"
    data () {
        return {
            options: regionData,
            formInline: {
                user: "",
                region: "",
            },
            rules: [
              {
                required: true,
                message: "请输入加工产品",
                trigger: "blur",
              },
            ],
          },
          {
            label: "产品数量",
            prop: "processNum",
            type: "number",
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入产品数量",
                trigger: "blur",
              },
            ],
          },
          {
            label: "备注",
            prop: "remarks",
            span: 24,
          },
          {
            label: "操作人",
            prop: "name",
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入操作人",
                trigger: "blur",
              },
            ],
          },
        ]
      },
      selectionList: [],
      data: [],
    };
  },
  computed: {
    ...mapGetters(["permission", "userInfo"]),
    // permissionList() {
    //   return {
    //     addBtn: this.vaildData(this.permission.social_add, true),
    //     viewBtn: this.vaildData(this.permission.social_view, false),
    //     delBtn: this.vaildData(this.permission.social_delete, false),
    //     editBtn: this.vaildData(this.permission.social_edit, false),
    //   };
    // },
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
  },
  mounted() {
  },
  created() {
    this.initData();
    //初始化列表数据
    this.onLoad(this.page);
  },
  methods: {
    onSubmit() {
      console.log("submit!");
    },
    submitSole() {
      var that = this;
      this.$refs.form.validate((vaild, done) => {
        if (vaild) {
          add(this.form).then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            //提交完成,关闭窗口清空数据
            that.cleanData();
            done();
          }, error => {
            window.console.log(error);
            //提交失败,关闭窗口清空数据
            that.cleanData();
            done();
          });
            form: {
                name: "",
                proid: "",
                landId: "",
                strainId: "",
                saleTime: "",
                saleNum: "",
                saleDestination: "",
                city: "",
                county: "",
                salePrice: "",
                createUser: "",
                saleBrand: "",
            },
            //损耗字段
            formKC: {
                name: "",
                proid: "",
                landId: "",
                strainId: "",
                saleNum: "",
                remarks: "",
                reason: "0",
                lossTime: "",
            },
            //加工字段
            formJG: {
                name: "",
                proid: "",
                landId: "",
                strainId: "",
                saleNum: "",
                processNum: "",
                remarks: "",
                reason: "0",
                saleTime: "",
            },
            visible: false,
            visibleKC: false,
            visibleJG: false,
            value: true,
            page: {
                pageSize: 16,
                currentPage: 1,
                total: 0,
            },
            option: {
                emptyBtn: false,
                submitBtn: false,
                gutter: 30,
                column: [
                    {
                        label: "种养品种",
                        prop: "strainName",
                        span: 24,
                        disabled: true,
                        rules: [
                            {
                                required: true,
                                message: "请输入种养品种",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: "销售时间",
                        prop: "saleTime",
                        type: "date",
                        span: 24,
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
                        rules: [
                            {
                                required: true,
                                message: "请选择销售时间",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: "销售数量",
                        prop: "saleNum",
                        type: "number",
                        span: 24,
                        rules: [
                            {
                                required: true,
                                message: "请输入销售数量",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: "销售去向",
                        prop: "saleDestination",
                        span: 24,
                        rules: [
                            {
                                required: true,
                                message: "请选择销售去向",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: "销售价格",
                        prop: "salePrice",
                        span: 24,
                        type: "number",
                    },
                    {
                        label: "品牌",
                        prop: "saleBrand",
                        span: 24,
                    },
                    {
                        label: "操作人",
                        prop: "name",
                        span: 24,
                        rules: [
                            {
                                required: true,
                                message: "请输入操作人",
                                trigger: "blur",
                            },
                        ],
                    },
                ]
            },
            optionKC: {
                emptyBtn: false,
                submitBtn: false,
                gutter: 30,
                column: [
                    {
                        label: "损耗品种",
                        prop: "strainName",
                        span: 24,
                        disabled: true,
                        rules: [
                            {
                                required: true,
                                message: "请输入损耗品种",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: "损耗时间",
                        prop: "lossTime",
                        type: "date",
                        span: 24,
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
                        rules: [
                            {
                                required: true,
                                message: "请选择损耗时间",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: "损耗数量",
                        prop: "saleNum",
                        type: "number",
                        span: 24,
                        rules: [
                            {
                                required: true,
                                message: "请输入损耗数量",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: "损耗原因",
                        prop: "reason",
                        span: 24,
                        type: "select",
                        value: "0",
                        dicData: [
                            {
                                label: "库存损耗",
                                value: "0",
                            }],
                        rules: [
                            {
                                required: true,
                                message: "请选择损耗原因",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: "备注",
                        prop: "remarks",
                        span: 24,
                    },
                    {
                        label: "操作人",
                        prop: "name",
                        span: 24,
                        rules: [
                            {
                                required: true,
                                message: "请输入操作人",
                                trigger: "blur",
                            },
                        ],
                    },
                ]
            },
            optionJG: {
                emptyBtn: false,
                submitBtn: false,
                gutter: 30,
                column: [
                    {
                        label: "加工品种",
                        prop: "strainName",
                        span: 24,
                        disabled: true,
                        rules: [
                            {
                                required: true,
                                message: "请输入加工品种",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: "加工时间",
                        prop: "saleTime",
                        type: "date",
                        span: 24,
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
                        rules: [
                            {
                                required: true,
                                message: "请选择加工时间",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: "加工数量",
                        prop: "saleNum",
                        type: "number",
                        span: 24,
                        rules: [
                            {
                                required: true,
                                message: "请输入加工数量",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: "加工产品",
                        prop: "processId",
                        span: 24,
                        type: "tree",
                        dicUrl: "/api/machining/machining/selectInfo",
                        props: {
                            label: "processName",
                            value: "processId"
                        },
                        rules: [
                            {
                                required: true,
                                message: "请输入加工产品",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: "产品数量",
                        prop: "processNum",
                        type: "number",
                        span: 24,
                        rules: [
                            {
                                required: true,
                                message: "请输入产品数量",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: "备注",
                        prop: "remarks",
                        span: 24,
                    },
                    {
                        label: "操作人",
                        prop: "name",
                        span: 24,
                        rules: [
                            {
                                required: true,
                                message: "请输入操作人",
                                trigger: "blur",
                            },
                        ],
                    },
                ]
            },
            selectionList: [],
            data: [],
        }
      })
    },
    //加工产品
    submitJGloss() {
      var that = this;
      this.$refs.form.validate((vaild, done) => {
        if (vaild) {
          addjg(this.formJG).then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            //提交完成,关闭窗口清空数据
            that.cleanJGData();
            done();
          }, error => {
            window.console.log(error);
            //提交失败,关闭窗口清空数据
            that.cleanJGData();
            done();
          });
        }
      })
    computed: {
        ...mapGetters(["permission", "userInfo"]),
        // permissionList() {
        //   return {
        //     addBtn: this.vaildData(this.permission.social_add, true),
        //     viewBtn: this.vaildData(this.permission.social_view, false),
        //     delBtn: this.vaildData(this.permission.social_delete, false),
        //     editBtn: this.vaildData(this.permission.social_edit, false),
        //   };
        // },
        ids () {
            let ids = []
            this.selectionList.forEach((ele) => {
                ids.push(ele.id)
            })
            return ids.join(",")
        },
    },
    submitKCloss() {
      var that = this;
      this.$refs.form.validate((vaild, done) => {
        if (vaild) {
          addKC(this.formKC).then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            //提交完成,关闭窗口清空数据
            that.cleanKCData();
            done();
          }, error => {
            window.console.log(error);
            //提交失败,关闭窗口清空数据
            that.cleanKCData();
            done();
          });
        }
      })
    mounted () {
    },
    handleChange(value) {
      if (value != null) {
        this.form.saleDestination = value[0];
        this.form.city = value[1];
        this.form.county = value[2];
    created () {
        this.initData()
        //初始化列表数据
        this.onLoad(this.page)
    },
    methods: {
        onSubmit () {
            console.log("submit!")
        },
        submitSole () {
            var that = this
            this.$refs.form.validate((vaild, done) => {
                if (vaild) {
                    add(this.form).then(() => {
                        this.onLoad(this.page)
                        this.$message({
                            type: "success",
                            message: "操作成功!"
                        })
                        //提交完成,关闭窗口清空数据
                        that.cleanData()
                        done()
                    }, error => {
                        window.console.log(error)
                        //提交失败,关闭窗口清空数据
                        that.cleanData()
                        done()
                    })
                }
            })
        },
        //加工产品
        submitJGloss () {
            var that = this
            this.$refs.form.validate((vaild, done) => {
                if (vaild) {
                    addjg(this.formJG).then(() => {
                        this.onLoad(this.page)
                        this.$message({
                            type: "success",
                            message: "操作成功!"
                        })
                        //提交完成,关闭窗口清空数据
                        that.cleanJGData()
                        done()
                    }, error => {
                        window.console.log(error)
                        //提交失败,关闭窗口清空数据
                        that.cleanJGData()
                        done()
                    })
                }
            })
        },
        submitKCloss () {
            var that = this
            this.$refs.form.validate((vaild, done) => {
                if (vaild) {
                    addKC(this.formKC).then(() => {
                        this.onLoad(this.page)
                        this.$message({
                            type: "success",
                            message: "操作成功!"
                        })
                        //提交完成,关闭窗口清空数据
                        that.cleanKCData()
                        done()
                    }, error => {
                        window.console.log(error)
                        //提交失败,关闭窗口清空数据
                        that.cleanKCData()
                        done()
                    })
                }
            })
        },
        handleChange (value) {
            if (value != null) {
                this.form.saleDestination = value[0]
                this.form.city = value[1]
                this.form.county = value[2]
      }
            }
        },
        initData () {
            // var that = this;
            //获取农产品数据
            // getStrainList(0).then((res) => {
            //   if (res.data.code == 200) {
            //     var strainId = that.findObject(that.option.column, "strainId");
            //     strainId.dicData = res.data.data;
            //   }
            // });
        },
        openWindow (index, data) {
            if (index == 0) {
                this.form.name = this.userInfo.nick_name
                this.form.createUser = this.userInfo.user_id
                this.form.weight = data.weight
                this.form.proid = data.id
                this.form.landId = data.landId
                this.form.strainId = data.strainId
                this.form.strainName = data.strainName
                this.visible = true
            } else if (index == 1) {
                this.formKC.name = this.userInfo.nick_name
                this.formKC.createUser = this.userInfo.user_id
                this.formKC.weight = data.weight
                this.formKC.proid = data.id
                this.formKC.landId = data.landId
                this.formKC.strainId = data.strainId
                this.formKC.strainName = data.strainName
                this.visibleKC = true
            }
            else if (index == 2) {
                this.formJG.name = this.userInfo.nick_name
                this.formJG.createUser = this.userInfo.user_id
                this.formJG.proid = data.id
                this.formJG.landId = data.landId
                this.formJG.weight = data.weight
                this.formJG.strainId = data.strainId
                this.formJG.strainName = data.strainName
                this.visibleJG = true
            }
        },
        cleanData () {
            var that = this
            that.form.saleDestination = ""
            that.$refs.form.resetFields()
            that.visible = false
        },
        cleanKCData () {
            var that = this
            that.$refs.form.resetFields()
            that.visibleKC = false
        },
        cleanJGData () {
            var that = this
            that.$refs.form.resetFields()
            that.visibleJG = false
        },
        handleSizeChange (val) {
            this.page.pageSize = val
            this.onLoad(this.page)
        },
        handleCurrentChange (val) {
            this.page.currentPage = val
            this.onLoad(this.page)
        },
        onLoad (page, params = {}) {
            params['tenantId'] = this.userInfo.tenant_id
            params['deptId'] = this.userInfo.dept_id
            getList(
                page.currentPage,
                page.pageSize,
                Object.assign(params, this.query)
            ).then((res) => {
                const data = res.data.data
                this.page.total = data.total
                this.data = data.records
                this.loading = false
                this.selectionClear()
            })
        },
    },
    initData() {
      // var that = this;
      //获取农产品数据
      // getStrainList(0).then((res) => {
      //   if (res.data.code == 200) {
      //     var strainId = that.findObject(that.option.column, "strainId");
      //     strainId.dicData = res.data.data;
      //   }
      // });
    },
    openWindow(index, data) {
      if (index == 0) {
        this.form.name = this.userInfo.nick_name;
        this.form.createUser = this.userInfo.user_id;
        this.form.weight = data.weight;
        this.form.proid=data.id;
        this.form.landId=data.landId;
        this.form.strainId = data.strainId;
        this.form.strainName = data.strainName;
        this.visible = true;
      } else if (index == 1) {
        this.formKC.name = this.userInfo.nick_name;
        this.formKC.createUser = this.userInfo.user_id;
        this.formKC.weight = data.weight;
        this.formKC.proid=data.id;
        this.formKC.landId=data.landId;
        this.formKC.strainId = data.strainId;
        this.formKC.strainName = data.strainName;
        this.visibleKC = true;
      }
      else if (index == 2) {
        this.formJG.name = this.userInfo.nick_name;
        this.formJG.createUser = this.userInfo.user_id;
        this.formJG.proid=data.id;
        this.formJG.landId=data.landId;
        this.formJG.weight = data.weight;
        this.formJG.strainId = data.strainId;
        this.formJG.strainName = data.strainName;
        this.visibleJG = true;
      }
    },
    cleanData() {
      var that = this;
      that.form.saleDestination = "";
      that.$refs.form.resetFields();
      that.visible = false;
    },
    cleanKCData() {
      var that = this;
      that.$refs.form.resetFields();
      that.visibleKC = false;
    },
    cleanJGData() {
      var that = this;
      that.$refs.form.resetFields();
      that.visibleJG = false;
    },
    handleSizeChange(val) {
      this.page.pageSize = val;
      this.onLoad(this.page);
    },
    handleCurrentChange(val) {
      this.page.currentPage = val;
      this.onLoad(this.page);
    },
    onLoad(page, params = {}) {
      params['tenantId'] = this.userInfo.tenant_id;
      params['deptId'] = this.userInfo.dept_id;
      getList(
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query)
      ).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
        this.selectionClear();
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.body {
  background-color: #fff;
  width: 98%;
  height: 95%;
  margin: 0 auto;
    background-color: #fff;
    width: 98%;
    height: 95%;
    margin: 0 auto;
  .search {
    padding-top: 20px;
    padding-left: 30px;
  }
  .table {
    .content {
      width: 99%;
      height: auto;
      min-height: 630px;
      margin: 0 auto;
      word-wrap: break-word;
      word-break: break-all;
      .farm {
        width: 168px;
        height: 240px;
        /*height: 315px;*/
        background-color: #f7f9fb;
        border-radius: 5px;
        margin-left: 30px;
        margin-top: 30px;
        float: left;
        .farm-img {
          width: 168px;
          height: 168px;
          .img {
            width: 168px;
            height: 168px;
            border-radius: 8px 8px 0px 0px;
          }
        }
        .cai {
          text-align: center;
          font-size: 18px;
          font-weight: 550;
          margin-top: 8px;
          color: #5abf78;
        }
        .area {
          text-align: center;
          font-size: 14px;
          margin-top: 5px;
          color: #333333;
          span {
            font-size: 15px;
            color: #333333;
          }
        }
        .btn {
          text-align: center;
          margin-top: 8px;
        }
      }
    .search {
        padding-top: 20px;
        padding-left: 30px;
    }
  }
  .el-page {
    padding-top: 30px;
    text-align: center;
  }
    .table {
        .content {
            width: 99%;
            height: auto;
            min-height: 630px;
            margin: 0 auto;
            word-wrap: break-word;
            word-break: break-all;
            .farm {
                width: 168px;
                height: 240px;
                /*height: 315px;*/
                background-color: #f7f9fb;
                border-radius: 5px;
                margin-left: 30px;
                margin-top: 30px;
                float: left;
                .farm-img {
                    width: 168px;
                    height: 168px;
                    .img {
                        width: 168px;
                        height: 168px;
                        border-radius: 8px 8px 0px 0px;
                    }
                }
                .cai {
                    text-align: center;
                    font-size: 18px;
                    font-weight: 550;
                    margin-top: 8px;
                    color: #5abf78;
                }
                .area {
                    text-align: center;
                    font-size: 14px;
                    margin-top: 5px;
                    color: #333333;
                    span {
                        font-size: 15px;
                        color: #333333;
                    }
                }
                .btn {
                    text-align: center;
                    margin-top: 8px;
                }
            }
        }
    }
    .el-page {
        padding-top: 30px;
        text-align: center;
    }
}
</style>