{"version":3,"file":"KrCity.cjs","sources":["../../../../../packages/src/kr-city/KrCity.vue"],"sourcesContent":["<template>\n    <div class=\"question-item\">\n        <div class=\"question-item-num\">\n            <question-title v-if=\"titleIsEdit\" :dataList=\"dataList\" @numberBlur=\"(e) => emits('numberChange', e)\" />\n            <div v-else style=\"margin-top: 8px\">{{ dataList.questionNumber }}</div>\n        </div>\n        <div class=\"question-item-content\">\n            <div class=\"title\">\n                <rich-text-editor ref=\"titileInput\" class=\"titile-input\" v-model:valueData=\"dataList.title\" />\n            </div>\n            <!-- 每个层级分开 -->\n            <ul class=\"content\" v-if=\"dataList.showStyle == '1'\">\n                <el-select\n                    style=\"margin-right: 20px\"\n                    v-for=\"(column, index) in columns\"\n                    v-model=\"valueObj[`${index + 1}`]\"\n                    value-key=\"value\"\n                    @change=\"changePreSelect($event, index + 1)\"\n                    class=\"m-2\"\n                    :placeholder=\"`请选择${cityPlace[index]}`\"\n                    size=\"large\"\n                >\n                    <el-option v-for=\"item in selectList[index + 1 + '']\" :key=\"item.value\" :label=\"item.label\" :value=\"item\" />\n                </el-select>\n                <div v-if=\"dataList.addressFormat == '4'\" style=\"width: 100%; margin-top: 20px\">\n                    <el-input style=\"width: 706px\" v-model=\"cityDetail\" placeholder=\"详细地址\" size=\"large\"></el-input>\n                </div>\n            </ul>\n\n            <!-- 一个选择框 -->\n            <ul class=\"content\" v-else>\n                <el-cascader v-model=\"valueList\" :options=\"dataList.optionsList\" @change=\"handleChange\" placeholder=\"请选择\" size=\"large\" />\n                <div v-if=\"dataList.addressFormat == '4' && valueList.length > 0\" style=\"width: 100%; margin-top: 20px\">\n                    <el-input style=\"width: 706px\" v-model=\"cityDetail\" placeholder=\"详细地址\" size=\"large\"></el-input>\n                </div>\n            </ul>\n            <!-- 底部操作栏 -->\n            <div class=\"footer-operation\" v-if=\"footerShow\">\n                <action-bar\n                    class=\"action-bar\"\n                    @addCopy=\"() => emits('copyQuestion', dataList)\"\n                    @deleteQuestion=\"() => emits('deleteQuestion')\"\n                    @view=\"(e) => emits('singlePreview', e)\"\n                >\n                </action-bar>\n            </div>\n        </div>\n    </div>\n</template>\n<script setup name=\"kr-city\">\n// js\nimport { ref, watch, computed } from \"vue\";\n\n// components\nimport RichTextEditor from \"@/components/editor/RichTextEditor.vue\";\nimport ActionBar from \"@/components/action/ActionBar.vue\";\nimport QuestionTitle from \"@/components/question/QuestionNumber.vue\";\n\n// props\nconst props = defineProps({\n    // 是否展示底部操作栏\n    footerShow: {\n        type: Boolean,\n        default: true,\n    },\n    // 题号是否可编辑\n    titleIsEdit: {\n        type: Boolean,\n        default: true,\n    },\n    // 数据渲染\n    dataList: {\n        type: Object,\n        default: () => ({}),\n    },\n});\n// 复制题目，删除题目, 数据改变, 单题预览, 标题修改后\nconst emits = defineEmits([\"copyQuestion\", \"deleteQuestion\", \"change\", \"singlePreview\", \"numberChange\"]);\nconst cityPlace = [\"省份\", \"城市\", \"地区\"];\nconst titileInput = ref(null); // 为了标题聚焦使用\nlet selectList = ref({});\nlet valueObj = ref({}); // 虚拟绑定值\nlet valueList = ref([]);\nlet cityDetail = ref(\"\");\nselectList.value[\"1\"] = JSON.parse(JSON.stringify(props.dataList.optionsList));\n\nlet columns = computed(() => {\n    return +props.dataList.addressFormat > 3 ? 3 : +props.dataList.addressFormat;\n});\nwatch(\n    () => props.dataList,\n    (curr, old) => {\n        // 绑定数据改变时调change方法\n        emits(\"change\", curr);\n    },\n    { deep: true }\n);\n\ndefineExpose({ titileInput });\n\n// 展示当前下拉框\nfunction changePreSelect(e, index) {\n    if (e.children) {\n        selectList.value[index + 1 + \"\"] = JSON.parse(JSON.stringify(e.children));\n    }\n}\nfunction handleChange(e) {}\n</script>\n<style lang=\"scss\" scoped>\n@use \"@/css/common.scss\" as *;\n\n:deep(.el-select--large) {\n    height: 34px;\n}\n.question-item {\n    .content {\n        display: flex;\n        flex-wrap: wrap;\n    }\n    .footer-operation {\n        .bottom-operation {\n            display: flex;\n            justify-content: space-between;\n            color: rgba(34, 64, 195, 1);\n            font-size: 13px;\n            .button1 {\n                cursor: pointer;\n                &:nth-child(2) {\n                    margin: 0 30px;\n                }\n                .icon {\n                    margin-right: 7px;\n                    font-size: 13px;\n                }\n            }\n        }\n    }\n}\n</style>\n"],"names":["cityPlace","titileInput","ref","selectList","valueObj","valueList","cityDetail","props","columns","computed","watch","curr","old","emits","expose","changePreSelect","e","index","handleChange"],"mappings":"w/BA8EAA,EAAA,CAAA,KAAA,KAAA,IAAA,EACAC,EAAAC,EAAAA,IAAA,IAAA,EACA,IAAAC,EAAAD,EAAAA,IAAA,CAAA,CAAA,EACAE,EAAAF,EAAAA,IAAA,CAAA,CAAA,EACAG,EAAAH,EAAAA,IAAA,CAAA,CAAA,EACAI,EAAAJ,EAAAA,IAAA,EAAA,EACAC,EAAA,MAAA,CAAA,EAAA,KAAA,MAAA,KAAA,UAAAI,EAAA,SAAA,WAAA,CAAA,EAEA,IAAAC,EAAAC,EAAA,SAAA,IACA,CAAAF,EAAA,SAAA,cAAA,EAAA,EAAA,CAAAA,EAAA,SAAA,aACA,EACAG,EAAA,MACA,IAAAH,EAAA,SACA,CAAAI,EAAAC,IAAA,CAEAC,EAAA,SAAAF,CAAA,CACA,EACA,CAAA,KAAA,EAAA,CACA,EAEAG,EAAA,CAAA,YAAAb,CAAA,CAAA,EAGA,SAAAc,EAAAC,EAAAC,EAAA,CACAD,EAAA,WACAb,EAAA,MAAAc,EAAA,EAAA,EAAA,EAAA,KAAA,MAAA,KAAA,UAAAD,EAAA,QAAA,CAAA,EAEA,CACA,SAAAE,EAAAF,EAAA,CAAA"}