<template>
  <Collapse v-model="value1" class="property">
    <Panel name="1">
      列表设置
      <div slot="content">
      <div v-for="(config, index) in configList" :key="index">
        <Form :model="config" :label-width="80">
          <FormItem label="标题">
            <Input v-model="config.title"></Input>
          </FormItem>
          <FormItem label="查询标识">
            <Input v-model="config.query"></Input>
          </FormItem>
        </Form>
      </div>
      </div>
    </Panel>
  </Collapse>
</template>

<script>
export default {
  watch: {
    configList: {
      handler(newVal) {
        this.itemSetting.properties = newVal
      },
      deep: true,
    },
  },
  props: {
    itemSetting: {
      type: Array,
      default: () => [],
    },
  },
  data() {
    return {
      value1: null,
			configList: [
				{
					title: '',
					query: ''
				},
				{
					title: '',
					query: ''
				},
				{
					title: '',
					query: ''
				},
				{
					title: '',
					query: ''
				},
				{
					title: '',
					query: ''
				},
			]
    }
  },
  created() {
    let prop = this.itemSetting.properties
		if (prop) {
			this.configList = prop
		}
  },
}
</script>
<style scoped lang="scss">
</style>
