<template>
  <basic-container>
    <avue-crud
      :data="data"
      :option="option"
      v-model="form"
      @on-load="onLoad"
    ></avue-crud>
  </basic-container>
</template>

<script>
const baseUrl = "https://cli2.avue.top/api/area";
import {
  getList,
  add,
  undo,
  submitApi,
  exportApi,
  exportApiUrl,
  personnel,
  edit as update,
} from "@/api/leaveReq/leaveReq.js";
export default {
  data() {
    return {
      form: {
        province: "110000",
        city: "110100",
        area: "110101",
      },
      data: [
        {
          name: "张33三",
          sex: "男",
          grade: 1,
          cascader: [0, 1],
          checkbox: [0, 1],
          tree: 0,
          province: "山西",
          city: "太原",
        },
        {
          name: "李四",
          sex: "女",
          grade: 0,
          cascader: [0, 2],
          checkbox: [0, 1],
          tree: 1,
          province: "北京",
          city: "太原",
        },
      ],
      option: {
        page: false,
        align: "center",
        menuAlign: "center",
        column: [
          {
            label: "省份",
            prop: "province",
            type: "select",
            props: {
              label: "name",
              value: "code",
            },
            // addDisplay: false,
            cascaderItem: ["city", "area"],
            cascaderChange: true,
            dicUrl: `${baseUrl}/getProvince`,
            rules: [
              {
                required: true,
                message: "请选择省份",
                trigger: "blur",
              },
            ],
          },
          {
            label: "城市",
            prop: "city",
            type: "select",
            props: {
              label: "name",
              value: "code",
            },
            // addDisplay: false,
            row: true,
            defaultIndex: 1,
            dicFlag: false,
            dicUrl: `${baseUrl}/getCity/`,
            rules: [
              {
                required: true,
                message: "请选择城市",
                trigger: "blur",
              },
            ],
          },
          {
            label: "姓名",
            prop: "name",
          },
          {
            label: "性别",
            prop: "aaa",
            type: "select",
            dicData: [
              {
                label: "男",
                value: 1,
              },
              {
                label: "女",
                value: 1,
              },
            ],
          },
          {
            label: "权限",
            prop: "grade",
            type: "select",
            dicData: [
              {
                label: "有权限",
                value: 1,
              },
              {
                label: "无权限",
                value: 0,
              },
              {
                label: "禁止项",
                disabled: true,
                value: -1,
              },
            ],
          },
          {
            label: "级别",
            prop: "cascader",
            type: "cascader",

            dicData: [
              {
                label: "一级",
                value: 0,
                children: [
                  {
                    label: "一级1",
                    value: 1,
                  },
                  {
                    label: "一级2",
                    value: 2,
                  },
                ],
              },
            ],
          },
          {
            width: 120,
            label: "多选",
            prop: "checkbox",
            type: "checkbox",
            span: 24,
            dicData: [
              {
                label: "有权限",
                value: 1,
              },
              {
                label: "无权限",
                value: 0,
              },
              {
                label: "禁止项",
                disabled: true,
                value: -1,
              },
            ],
          },
          {
            label: "树型",
            prop: "tree",
            type: "tree",
            dicData: [
              {
                label: "一级",
                value: 0,
                children: [
                  {
                    label: "一级1",
                    value: 1,
                  },
                  {
                    label: "一级2",
                    value: 2,
                  },
                ],
              },
            ],
          },
        ],
      },
    };
  },
  created() {
    // console.table(100888, baseUrl);
    this.onLoad()
  },
  methods: {
    onLoad() {
      getList(1,100,
        Object.assign(params, this.query)
      ).then((res) => {
       console.log(100998, res);
        const data = res.data.data;
      
        this.data = data.records;
      });
    },
  },
};
</script>
<style>
</style>
Logo

前往低代码交流专区

更多推荐