@idooel/components 0.0.2-beta.1 → 0.0.2-beta.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/@idooel/components.esm.js +62 -17
- package/dist/@idooel/components.umd.js +62 -17
- package/package.json +1 -1
- package/packages/composite-components/modal-img-crop/src/index.vue +1 -1
- package/packages/table/src/index.vue +20 -0
- package/packages/theme/index.scss +3 -2
- package/packages/upload/src/index.vue +54 -4
|
@@ -2009,11 +2009,11 @@ __vue_render__$C._withStripped = true;
|
|
|
2009
2009
|
/* style */
|
|
2010
2010
|
const __vue_inject_styles__$C = function (inject) {
|
|
2011
2011
|
if (!inject) return
|
|
2012
|
-
inject("data-v-42696953_0", { source: "@charset \"UTF-8\";\n.g-table__wrapper[data-v-42696953] {\n /* 外层采用列布局,确保分页始终可见,表格充满剩余空间 */\n display: flex;\n flex-direction: column;\n overflow: hidden;\n /* 表格区域占满剩余空间,启用纵向滚动 */\n /* 确保表体能够正常纵向滚动 */\n /* 分页区域固定在底部,不被挤出视口 */\n}\n.g-table__wrapper[data-v-42696953] .ant-table-wrapper {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper[data-v-42696953] .ant-spin-nested-loading {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper[data-v-42696953] .ant-spin-container {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper[data-v-42696953] .ant-table {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper[data-v-42696953] .ant-table-content {\n flex: 1 1 auto;\n min-height: 0;\n overflow: hidden;\n}\n.g-table__wrapper[data-v-42696953] .ant-table-scroll {\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper[data-v-42696953] .ant-table-header {\n flex: 0 0 auto;\n overflow: hidden;\n}\n.g-table__wrapper[data-v-42696953] .ant-table-body {\n flex: 1 1 auto;\n overflow: auto !important;\n /* 确保滚动条稳定,避免列宽抖动 */\n scrollbar-gutter: stable;\n}\n.g-table__wrapper .g-table__pagination[data-v-42696953] {\n flex: 0 0 auto;\n display: flex;\n flex-direction: row;\n justify-content: end;\n border-top: unset;\n padding-top: 8px;\n padding-bottom: 8px;\n background: #fff;\n z-index: 999;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["index.vue","/Users/huangshan/Goldgov/front/ganjiao/base-elearning-frontend-model/packages/components/packages/table/src/index.vue"],"names":[],"mappings":"AAAA,gBAAgB;ACwNhB;EACA,8BAAA;EACA,aAAA;EACA,sBAAA;EACA,gBAAA;EAEA,sBAAA;EA6BA,iBAAA;EAyBA,qBAAA;AD3QA;ACsNA;EACA,cAAA;EACA,aAAA;EACA,aAAA;EACA,sBAAA;ADpNA;ACuNA;EACA,cAAA;EACA,aAAA;EACA,aAAA;EACA,sBAAA;ADrNA;ACwNA;EACA,cAAA;EACA,aAAA;EACA,aAAA;EACA,sBAAA;ADtNA;ACyNA;EACA,cAAA;EACA,aAAA;EACA,aAAA;EACA,sBAAA;ADvNA;AC2NA;EACA,cAAA;EACA,aAAA;EACA,gBAAA;ADzNA;AC4NA;EACA,YAAA;EACA,aAAA;EACA,sBAAA;AD1NA;AC6NA;EACA,cAAA;EACA,gBAAA;AD3NA;AC8NA;EACA,cAAA;EACA,yBAAA;EACA,mBAAA;EACA,wBAAA;AD5NA;ACgOA;EACA,cAAA;EACA,aAAA;EACA,mBAAA;EACA,oBAAA;EACA,iBAAA;EACA,gBAAA;EACA,mBAAA;EACA,gBAAA;EACA,YAAA;AD9NA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["@charset \"UTF-8\";\n.g-table__wrapper {\n /* 外层采用列布局,确保分页始终可见,表格充满剩余空间 */\n display: flex;\n flex-direction: column;\n overflow: hidden;\n /* 表格区域占满剩余空间,启用纵向滚动 */\n /* 确保表体能够正常纵向滚动 */\n /* 分页区域固定在底部,不被挤出视口 */\n}\n.g-table__wrapper ::v-deep .ant-table-wrapper {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper ::v-deep .ant-spin-nested-loading {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper ::v-deep .ant-spin-container {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper ::v-deep .ant-table {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper ::v-deep .ant-table-content {\n flex: 1 1 auto;\n min-height: 0;\n overflow: hidden;\n}\n.g-table__wrapper ::v-deep .ant-table-scroll {\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper ::v-deep .ant-table-header {\n flex: 0 0 auto;\n overflow: hidden;\n}\n.g-table__wrapper ::v-deep .ant-table-body {\n flex: 1 1 auto;\n overflow: auto !important;\n /* 确保滚动条稳定,避免列宽抖动 */\n scrollbar-gutter: stable;\n}\n.g-table__wrapper .g-table__pagination {\n flex: 0 0 auto;\n display: flex;\n flex-direction: row;\n justify-content: end;\n border-top: unset;\n padding-top: 8px;\n padding-bottom: 8px;\n background: #fff;\n z-index: 999;\n}\n\n/*# sourceMappingURL=index.vue.map */","<template>\n <div class=\"g-table__wrapper\" :style=\"wrapperStyle\" :class=\"{ 'g-table--no-scroll-y': !needScrollY }\">\n <a-table\n :bordered=\"bordered\"\n :class=\"[isNoData && 'g-table__no-data']\"\n :pagination=\"false\"\n :loading=\"loading\"\n :columns=\"innerColumns\"\n :row-selection=\"rowSelection\"\n :row-class-name=\"setRowClassName\"\n :data-source=\"dataSource\"\n :scroll=\"getScroll\">\n <template slot=\"action\" slot-scope=\"record\">\n <Actions v-on=\"$listeners\" :data-source=\"actions\" :record=\"record\"></Actions>\n </template>\n </a-table>\n <div class=\"g-table__pagination\">\n <a-pagination\n :show-total=\"all => `共 ${all} 条数据`\"\n show-size-changer \n show-quick-jumper\n :pageSize=\"innerPageSize\"\n :current=\"innerCurrentPage\"\n :pageSizeOptions=\"pageSizeOptions\"\n @change=\"onChangePagination\"\n @showSizeChange=\"onShowSizeChange\"\n :total=\"total\">\n </a-pagination>\n </div>\n </div>\n</template>\n\n<script>\nimport Actions from './action.vue'\nexport default {\n name: 'ele-table',\n components: {\n Actions\n },\n props: {\n // ant table wrapper\n height: {\n type: Number\n },\n width: {\n type: Number\n },\n x: {\n type: Number,\n default: 1200\n },\n y: {\n type: Number,\n default: 200\n },\n scroll: {\n type: Object\n },\n rowSelection: {\n type: Object\n },\n actions: {\n type: Array,\n default: () => []\n },\n total: {\n type: Number,\n default: 0\n },\n loading: {\n type: Boolean,\n default: false\n },\n columns: {\n type: Array,\n default: () => []\n },\n dataSource: {\n type: Array,\n default: () => []\n },\n pageSize: {\n type: Number,\n default: 10\n },\n pageSizeOptions: {\n type: Array,\n default: () => ['10', '20', '30', '40']\n },\n bordered: {\n type: Boolean,\n default: true\n }\n },\n data() {\n return {\n tableHeaderHeight: 0,\n paginationHeight: 0,\n innerPageSize: 10,\n innerCurrentPage: 1,\n tableContentHeight: 0,\n obs: []\n }\n },\n computed: {\n wrapperStyle () {\n // 外层容器样式:确保分页始终可见,表格充满剩余空间\n if (!this.height) return {}\n return { height: `${this.height}px` }\n },\n needScrollY () {\n // 判断是否需要 y 轴滚动:基于数据行数与可用高度预估\n if (!this.height) return false\n \n const availableHeight = this.getScrollHeightByHeight\n if (availableHeight <= 0) return false\n \n // 预估每行高度(包含边框),antd 默认约 54px\n const estimatedRowHeight = 54\n const estimatedTableHeight = this.dataSource.length * estimatedRowHeight\n \n return estimatedTableHeight > availableHeight\n },\n innerColumns () {\n return this.columns.filter(col => !Object.keys(col).includes('multiple'))\n },\n isNoData () {\n return !this.dataSource.length\n },\n getScrollHeightByHeight () {\n // 始终返回可用的剩余高度,让表格内容不足时也能占满容器\n return this.height - this.tableHeaderHeight - this.paginationHeight\n },\n isFlexColumn () {\n return this.columns.every(col => !col.width)\n },\n getScroll () {\n if (this.scroll) {\n return this.scroll\n } else {\n const baseX = this.isFlexColumn ? 0 : (this.width > this.x ? 0 : this.x)\n if (this.height) {\n // 计算表体可用高度\n const availableHeight = this.tableHeaderHeight && this.paginationHeight \n ? this.getScrollHeightByHeight \n : this.height - 100 // 预估值,给表头和分页留空间\n \n if (availableHeight > 50) { // 确保有足够的最小高度\n console.log('Table scroll config:', { x: baseX, y: availableHeight, height: this.height, headerHeight: this.tableHeaderHeight, paginationHeight: this.paginationHeight })\n return { x: baseX, y: availableHeight }\n }\n }\n return { x: baseX }\n }\n }\n },\n watch: {\n pageSize: {\n handler (pageSize) {\n this.innerPageSize = pageSize\n },\n immediate: true\n }\n },\n methods: {\n onShowSizeChange (current, pageSize) {\n this.innerCurrentPage = current\n this.innerPageSize = pageSize\n this.$emit('change-page', current, pageSize)\n },\n setPaginationHeight () {\n this.$nextTick(() => {\n const { height } = document.querySelector('.g-table__pagination').getBoundingClientRect()\n this.paginationHeight = height\n })\n },\n setTableHeaderHeight () {\n this.$nextTick(() => {\n const el = document.querySelector('.ant-table-header')\n if (!el) return\n const { height } = el.getBoundingClientRect()\n this.tableHeaderHeight = height\n })\n },\n setTableTbodyHeight () {\n // 简化:仅需要获取表头高度,不再依赖表体高度的动态监听\n this.$nextTick(() => {\n this.setTableHeaderHeight()\n })\n },\n setRowClassName (record, idx) {\n return idx % 2 === 0 ? 'g-table__row--even' : 'g-table__row--odd'\n },\n onChangePagination (page, pageSize) {\n this.innerCurrentPage = page\n this.innerPageSize = pageSize\n this.$emit('change-page', page, pageSize)\n }\n },\n mounted() {\n this.$nextTick(() => {\n this.setPaginationHeight()\n setTimeout(() => {\n this.setTableTbodyHeight()\n // 再测一次分页高度,确保初次渲染完成后数值准确\n this.setPaginationHeight()\n }, 200)\n })\n },\n destroyed () {\n this.obs.forEach(ob => ob.disconnect())\n }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.g-table__wrapper {\n /* 外层采用列布局,确保分页始终可见,表格充满剩余空间 */\n display: flex;\n flex-direction: column;\n overflow: hidden;\n\n /* 表格区域占满剩余空间,启用纵向滚动 */\n ::v-deep .ant-table-wrapper {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n\n ::v-deep .ant-spin-nested-loading {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n\n ::v-deep .ant-spin-container {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n\n ::v-deep .ant-table {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n\n /* 确保表体能够正常纵向滚动 */\n ::v-deep .ant-table-content {\n flex: 1 1 auto;\n min-height: 0;\n overflow: hidden;\n }\n\n ::v-deep .ant-table-scroll {\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n\n ::v-deep .ant-table-header {\n flex: 0 0 auto;\n overflow: hidden;\n }\n\n ::v-deep .ant-table-body {\n flex: 1 1 auto;\n overflow: auto !important;\n /* 确保滚动条稳定,避免列宽抖动 */\n scrollbar-gutter: stable;\n }\n\n /* 分页区域固定在底部,不被挤出视口 */\n .g-table__pagination {\n flex: 0 0 auto;\n display: flex;\n flex-direction: row;\n justify-content: end;\n border-top: unset;\n padding-top: 8px;\n padding-bottom: 8px;\n background: #fff;\n z-index: 999;\n }\n}\n</style>"]}, media: undefined });
|
|
2012
|
+
inject("data-v-7943901f_0", { source: "@charset \"UTF-8\";\n.g-table__wrapper[data-v-7943901f] {\n /* 外层采用列布局,确保分页始终可见,表格充满剩余空间 */\n display: flex;\n flex-direction: column;\n overflow: hidden;\n /* 表格区域占满剩余空间,启用纵向滚动 */\n /* 确保表体能够正常纵向滚动 */\n /* 分页区域固定在底部,不被挤出视口 */\n}\n.g-table__wrapper[data-v-7943901f] .ant-table-wrapper {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper[data-v-7943901f] .ant-spin-nested-loading {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper[data-v-7943901f] .ant-spin-container {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper[data-v-7943901f] .ant-table {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper[data-v-7943901f] .ant-table-content {\n flex: 1 1 auto;\n min-height: 0;\n overflow: hidden;\n}\n.g-table__wrapper[data-v-7943901f] .ant-table-scroll {\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper[data-v-7943901f] .ant-table-header {\n flex: 0 0 auto;\n overflow: hidden;\n}\n.g-table__wrapper[data-v-7943901f] .ant-table-fixed .ant-table-tbody .g-table__row--odd.ant-table-row-hover .ant-table-selection-column {\n background-color: var(--idooel-row-hover-color) !important;\n}\n.g-table__wrapper[data-v-7943901f] .ant-table-fixed .ant-table-tbody .g-table__row--odd.ant-table-row-hover .ant-table-row-cell-break-word {\n background-color: var(--idooel-row-hover-color) !important;\n}\n.g-table__wrapper[data-v-7943901f] .ant-table-fixed .ant-table-tbody .g-table__row--odd .ant-table-selection-column {\n background-color: var(--idooel-row-odd-color);\n}\n.g-table__wrapper[data-v-7943901f] .ant-table-fixed .ant-table-tbody .g-table__row--odd .ant-table-row-cell-break-word {\n background-color: var(--idooel-row-odd-color);\n}\n.g-table__wrapper[data-v-7943901f] .ant-table-body {\n flex: 1 1 auto;\n overflow: auto !important;\n /* 确保滚动条稳定,避免列宽抖动 */\n scrollbar-gutter: stable;\n}\n.g-table__wrapper .g-table__pagination[data-v-7943901f] {\n flex: 0 0 auto;\n display: flex;\n flex-direction: row;\n justify-content: end;\n border-top: unset;\n padding-top: 8px;\n padding-bottom: 8px;\n background: #fff;\n z-index: 999;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["index.vue","/Users/huangshan/Goldgov/front/ganjiao/base-elearning-frontend-model/packages/components/packages/table/src/index.vue"],"names":[],"mappings":"AAAA,gBAAgB;ACwNhB;EACA,8BAAA;EACA,aAAA;EACA,sBAAA;EACA,gBAAA;EAEA,sBAAA;EA6BA,iBAAA;EA6CA,qBAAA;AD/RA;ACsNA;EACA,cAAA;EACA,aAAA;EACA,aAAA;EACA,sBAAA;ADpNA;ACuNA;EACA,cAAA;EACA,aAAA;EACA,aAAA;EACA,sBAAA;ADrNA;ACwNA;EACA,cAAA;EACA,aAAA;EACA,aAAA;EACA,sBAAA;ADtNA;ACyNA;EACA,cAAA;EACA,aAAA;EACA,aAAA;EACA,sBAAA;ADvNA;AC2NA;EACA,cAAA;EACA,aAAA;EACA,gBAAA;ADzNA;AC4NA;EACA,YAAA;EACA,aAAA;EACA,sBAAA;AD1NA;AC6NA;EACA,cAAA;EACA,gBAAA;AD3NA;ACiOA;EACA,0DAAA;AD/NA;ACiOA;EACA,0DAAA;AD/NA;ACkOA;EACA,6CAAA;ADhOA;ACkOA;EACA,6CAAA;ADhOA;ACsOA;EACA,cAAA;EACA,yBAAA;EACA,mBAAA;EACA,wBAAA;ADpOA;ACwOA;EACA,cAAA;EACA,aAAA;EACA,mBAAA;EACA,oBAAA;EACA,iBAAA;EACA,gBAAA;EACA,mBAAA;EACA,gBAAA;EACA,YAAA;ADtOA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["@charset \"UTF-8\";\n.g-table__wrapper {\n /* 外层采用列布局,确保分页始终可见,表格充满剩余空间 */\n display: flex;\n flex-direction: column;\n overflow: hidden;\n /* 表格区域占满剩余空间,启用纵向滚动 */\n /* 确保表体能够正常纵向滚动 */\n /* 分页区域固定在底部,不被挤出视口 */\n}\n.g-table__wrapper ::v-deep .ant-table-wrapper {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper ::v-deep .ant-spin-nested-loading {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper ::v-deep .ant-spin-container {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper ::v-deep .ant-table {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper ::v-deep .ant-table-content {\n flex: 1 1 auto;\n min-height: 0;\n overflow: hidden;\n}\n.g-table__wrapper ::v-deep .ant-table-scroll {\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n.g-table__wrapper ::v-deep .ant-table-header {\n flex: 0 0 auto;\n overflow: hidden;\n}\n.g-table__wrapper ::v-deep .ant-table-fixed .ant-table-tbody .g-table__row--odd.ant-table-row-hover .ant-table-selection-column {\n background-color: var(--idooel-row-hover-color) !important;\n}\n.g-table__wrapper ::v-deep .ant-table-fixed .ant-table-tbody .g-table__row--odd.ant-table-row-hover .ant-table-row-cell-break-word {\n background-color: var(--idooel-row-hover-color) !important;\n}\n.g-table__wrapper ::v-deep .ant-table-fixed .ant-table-tbody .g-table__row--odd .ant-table-selection-column {\n background-color: var(--idooel-row-odd-color);\n}\n.g-table__wrapper ::v-deep .ant-table-fixed .ant-table-tbody .g-table__row--odd .ant-table-row-cell-break-word {\n background-color: var(--idooel-row-odd-color);\n}\n.g-table__wrapper ::v-deep .ant-table-body {\n flex: 1 1 auto;\n overflow: auto !important;\n /* 确保滚动条稳定,避免列宽抖动 */\n scrollbar-gutter: stable;\n}\n.g-table__wrapper .g-table__pagination {\n flex: 0 0 auto;\n display: flex;\n flex-direction: row;\n justify-content: end;\n border-top: unset;\n padding-top: 8px;\n padding-bottom: 8px;\n background: #fff;\n z-index: 999;\n}\n\n/*# sourceMappingURL=index.vue.map */","<template>\n <div class=\"g-table__wrapper\" :style=\"wrapperStyle\" :class=\"{ 'g-table--no-scroll-y': !needScrollY }\">\n <a-table\n :bordered=\"bordered\"\n :class=\"[isNoData && 'g-table__no-data']\"\n :pagination=\"false\"\n :loading=\"loading\"\n :columns=\"innerColumns\"\n :row-selection=\"rowSelection\"\n :row-class-name=\"setRowClassName\"\n :data-source=\"dataSource\"\n :scroll=\"getScroll\">\n <template slot=\"action\" slot-scope=\"record\">\n <Actions v-on=\"$listeners\" :data-source=\"actions\" :record=\"record\"></Actions>\n </template>\n </a-table>\n <div class=\"g-table__pagination\">\n <a-pagination\n :show-total=\"all => `共 ${all} 条数据`\"\n show-size-changer \n show-quick-jumper\n :pageSize=\"innerPageSize\"\n :current=\"innerCurrentPage\"\n :pageSizeOptions=\"pageSizeOptions\"\n @change=\"onChangePagination\"\n @showSizeChange=\"onShowSizeChange\"\n :total=\"total\">\n </a-pagination>\n </div>\n </div>\n</template>\n\n<script>\nimport Actions from './action.vue'\nexport default {\n name: 'ele-table',\n components: {\n Actions\n },\n props: {\n // ant table wrapper\n height: {\n type: Number\n },\n width: {\n type: Number\n },\n x: {\n type: Number,\n default: 1200\n },\n y: {\n type: Number,\n default: 200\n },\n scroll: {\n type: Object\n },\n rowSelection: {\n type: Object\n },\n actions: {\n type: Array,\n default: () => []\n },\n total: {\n type: Number,\n default: 0\n },\n loading: {\n type: Boolean,\n default: false\n },\n columns: {\n type: Array,\n default: () => []\n },\n dataSource: {\n type: Array,\n default: () => []\n },\n pageSize: {\n type: Number,\n default: 10\n },\n pageSizeOptions: {\n type: Array,\n default: () => ['10', '20', '30', '40']\n },\n bordered: {\n type: Boolean,\n default: true\n }\n },\n data() {\n return {\n tableHeaderHeight: 0,\n paginationHeight: 0,\n innerPageSize: 10,\n innerCurrentPage: 1,\n tableContentHeight: 0,\n obs: []\n }\n },\n computed: {\n wrapperStyle () {\n // 外层容器样式:确保分页始终可见,表格充满剩余空间\n if (!this.height) return {}\n return { height: `${this.height}px` }\n },\n needScrollY () {\n // 判断是否需要 y 轴滚动:基于数据行数与可用高度预估\n if (!this.height) return false\n \n const availableHeight = this.getScrollHeightByHeight\n if (availableHeight <= 0) return false\n \n // 预估每行高度(包含边框),antd 默认约 54px\n const estimatedRowHeight = 54\n const estimatedTableHeight = this.dataSource.length * estimatedRowHeight\n \n return estimatedTableHeight > availableHeight\n },\n innerColumns () {\n return this.columns.filter(col => !Object.keys(col).includes('multiple'))\n },\n isNoData () {\n return !this.dataSource.length\n },\n getScrollHeightByHeight () {\n // 始终返回可用的剩余高度,让表格内容不足时也能占满容器\n return this.height - this.tableHeaderHeight - this.paginationHeight\n },\n isFlexColumn () {\n return this.columns.every(col => !col.width)\n },\n getScroll () {\n if (this.scroll) {\n return this.scroll\n } else {\n const baseX = this.isFlexColumn ? 0 : (this.width > this.x ? 0 : this.x)\n if (this.height) {\n // 计算表体可用高度\n const availableHeight = this.tableHeaderHeight && this.paginationHeight \n ? this.getScrollHeightByHeight \n : this.height - 100 // 预估值,给表头和分页留空间\n \n if (availableHeight > 50) { // 确保有足够的最小高度\n console.log('Table scroll config:', { x: baseX, y: availableHeight, height: this.height, headerHeight: this.tableHeaderHeight, paginationHeight: this.paginationHeight })\n return { x: baseX, y: availableHeight }\n }\n }\n return { x: baseX }\n }\n }\n },\n watch: {\n pageSize: {\n handler (pageSize) {\n this.innerPageSize = pageSize\n },\n immediate: true\n }\n },\n methods: {\n onShowSizeChange (current, pageSize) {\n this.innerCurrentPage = current\n this.innerPageSize = pageSize\n this.$emit('change-page', current, pageSize)\n },\n setPaginationHeight () {\n this.$nextTick(() => {\n const { height } = document.querySelector('.g-table__pagination').getBoundingClientRect()\n this.paginationHeight = height\n })\n },\n setTableHeaderHeight () {\n this.$nextTick(() => {\n const el = document.querySelector('.ant-table-header')\n if (!el) return\n const { height } = el.getBoundingClientRect()\n this.tableHeaderHeight = height\n })\n },\n setTableTbodyHeight () {\n // 简化:仅需要获取表头高度,不再依赖表体高度的动态监听\n this.$nextTick(() => {\n this.setTableHeaderHeight()\n })\n },\n setRowClassName (record, idx) {\n return idx % 2 === 0 ? 'g-table__row--even' : 'g-table__row--odd'\n },\n onChangePagination (page, pageSize) {\n this.innerCurrentPage = page\n this.innerPageSize = pageSize\n this.$emit('change-page', page, pageSize)\n }\n },\n mounted() {\n this.$nextTick(() => {\n this.setPaginationHeight()\n setTimeout(() => {\n this.setTableTbodyHeight()\n // 再测一次分页高度,确保初次渲染完成后数值准确\n this.setPaginationHeight()\n }, 200)\n })\n },\n destroyed () {\n this.obs.forEach(ob => ob.disconnect())\n }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.g-table__wrapper {\n /* 外层采用列布局,确保分页始终可见,表格充满剩余空间 */\n display: flex;\n flex-direction: column;\n overflow: hidden;\n\n /* 表格区域占满剩余空间,启用纵向滚动 */\n ::v-deep .ant-table-wrapper {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n\n ::v-deep .ant-spin-nested-loading {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n\n ::v-deep .ant-spin-container {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n\n ::v-deep .ant-table {\n flex: 1 1 auto;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n\n /* 确保表体能够正常纵向滚动 */\n ::v-deep .ant-table-content {\n flex: 1 1 auto;\n min-height: 0;\n overflow: hidden;\n }\n\n ::v-deep .ant-table-scroll {\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n\n ::v-deep .ant-table-header {\n flex: 0 0 auto;\n overflow: hidden;\n }\n ::v-deep .ant-table-fixed {\n .ant-table-tbody {\n .g-table__row--odd {\n &.ant-table-row-hover {\n .ant-table-selection-column {\n background-color: var(--idooel-row-hover-color) !important;\n }\n .ant-table-row-cell-break-word {\n background-color: var(--idooel-row-hover-color) !important;\n }\n }\n .ant-table-selection-column {\n background-color: var(--idooel-row-odd-color);\n }\n .ant-table-row-cell-break-word {\n background-color: var(--idooel-row-odd-color);\n }\n }\n }\n }\n\n ::v-deep .ant-table-body {\n flex: 1 1 auto;\n overflow: auto !important;\n /* 确保滚动条稳定,避免列宽抖动 */\n scrollbar-gutter: stable;\n }\n\n /* 分页区域固定在底部,不被挤出视口 */\n .g-table__pagination {\n flex: 0 0 auto;\n display: flex;\n flex-direction: row;\n justify-content: end;\n border-top: unset;\n padding-top: 8px;\n padding-bottom: 8px;\n background: #fff;\n z-index: 999;\n }\n}\n</style>"]}, media: undefined });
|
|
2013
2013
|
|
|
2014
2014
|
};
|
|
2015
2015
|
/* scoped */
|
|
2016
|
-
const __vue_scope_id__$C = "data-v-
|
|
2016
|
+
const __vue_scope_id__$C = "data-v-7943901f";
|
|
2017
2017
|
/* module identifier */
|
|
2018
2018
|
const __vue_module_identifier__$C = undefined;
|
|
2019
2019
|
/* functional template */
|
|
@@ -4332,7 +4332,7 @@ __vue_render__$w._withStripped = true;
|
|
|
4332
4332
|
/* style */
|
|
4333
4333
|
const __vue_inject_styles__$w = function (inject) {
|
|
4334
4334
|
if (!inject) return
|
|
4335
|
-
inject("data-v-cb05e1de_0", { source: ".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n.margin-t-8 {\n margin-top: 8px;\n}\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-even-color: #
|
|
4335
|
+
inject("data-v-cb05e1de_0", { source: ".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n.margin-t-8 {\n margin-top: 8px;\n}\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-odd-color: rgba(0, 0, 0, 0.04);\n --idooel-row-even-color: #FFF;\n --idooel-row-hover-color: #E6F7FF;\n --idooel-form-title-border-color: rgba(0, 0, 0, 0.16);\n --idooel-form-upload-bg-color: rgba(0, 0, 0, 0.02);\n --idooel-form-upload-border-hover-color: #40A9FF;\n --idooel-form-border-radius: 2px;\n --idooel-form-border-err-color: #F5222D;\n --idooel-link-06: #1890FF;\n --idooel-link-03: #91D5FF;\n --idooel-img-crop-err-color: #FFA39E;\n}\n.ant-input-disabled {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n.ant-select-disabled .ant-select-selection {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["index.vue"],"names":[],"mappings":"AAAA;EACE,qBAAqB;AACvB;AACA;EACE,cAAc;AAChB;AACA;EACE,cAAc;AAChB;AACA;EACE,cAAc;AAChB;AAEA;EACE,eAAe;AACjB;AAEA;EACE,+BAA+B;EAC/B,sCAAsC;EACtC,sCAAsC;EACtC,sCAAsC;EACtC,uCAAuC;EACvC,uCAAuC;EACvC,uCAAuC;EACvC,mDAAmD;EACnD,4BAA4B;EAC5B,4BAA4B;EAC5B,0BAA0B;EAC1B,wBAAwB;EACxB,8BAA8B;EAC9B,+BAA+B;EAC/B,qCAAqC;EACrC,2CAA2C;EAC3C,6BAA6B;EAC7B,iCAAiC;EACjC,qDAAqD;EACrD,kDAAkD;EAClD,gDAAgD;EAChD,gCAAgC;EAChC,uCAAuC;EACvC,yBAAyB;EACzB,yBAAyB;EACzB,oCAAoC;AACtC;AAEA;EACE,4DAA4D;AAC9D;AAEA;EACE,4DAA4D;AAC9D;;AAEA,oCAAoC","file":"index.vue","sourcesContent":[".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n\n.margin-t-8 {\n margin-top: 8px;\n}\n\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-odd-color: rgba(0, 0, 0, 0.04);\n --idooel-row-even-color: #FFF;\n --idooel-row-hover-color: #E6F7FF;\n --idooel-form-title-border-color: rgba(0, 0, 0, 0.16);\n --idooel-form-upload-bg-color: rgba(0, 0, 0, 0.02);\n --idooel-form-upload-border-hover-color: #40A9FF;\n --idooel-form-border-radius: 2px;\n --idooel-form-border-err-color: #F5222D;\n --idooel-link-06: #1890FF;\n --idooel-link-03: #91D5FF;\n --idooel-img-crop-err-color: #FFA39E;\n}\n\n.ant-input-disabled {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n.ant-select-disabled .ant-select-selection {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
|
|
4336
4336
|
|
|
4337
4337
|
};
|
|
4338
4338
|
/* scoped */
|
|
@@ -5240,6 +5240,7 @@ __vue_render__$u._withStripped = true;
|
|
|
5240
5240
|
__vue_component__$u.install = Vue => Vue.component(__vue_component__$u.name, __vue_component__$u);
|
|
5241
5241
|
|
|
5242
5242
|
//
|
|
5243
|
+
// import { message } from 'ant-design-vue'
|
|
5243
5244
|
var script$t = {
|
|
5244
5245
|
name: 'ele-upload',
|
|
5245
5246
|
components: {
|
|
@@ -5317,7 +5318,8 @@ var script$t = {
|
|
|
5317
5318
|
return {
|
|
5318
5319
|
files: [],
|
|
5319
5320
|
buildedFiles: [],
|
|
5320
|
-
saveToServerAsyncPageTimer: null
|
|
5321
|
+
saveToServerAsyncPageTimer: null,
|
|
5322
|
+
uploadRefId: null
|
|
5321
5323
|
};
|
|
5322
5324
|
},
|
|
5323
5325
|
watch: {
|
|
@@ -5402,7 +5404,10 @@ var script$t = {
|
|
|
5402
5404
|
return `${this.prefixPath}${this.url}?${ret}`;
|
|
5403
5405
|
},
|
|
5404
5406
|
uploadRef() {
|
|
5405
|
-
|
|
5407
|
+
if (!this.uploadRefId) {
|
|
5408
|
+
this.uploadRefId = `uploadRef_${v4()}`;
|
|
5409
|
+
}
|
|
5410
|
+
return this.uploadRefId;
|
|
5406
5411
|
},
|
|
5407
5412
|
fileSuffixIcon() {
|
|
5408
5413
|
return {
|
|
@@ -5532,10 +5537,51 @@ var script$t = {
|
|
|
5532
5537
|
// })
|
|
5533
5538
|
// return ret
|
|
5534
5539
|
},
|
|
5540
|
+
// 验证文件类型
|
|
5541
|
+
validateFileType(file) {
|
|
5542
|
+
if (!file || !file.name) {
|
|
5543
|
+
console.log('文件或文件名不存在');
|
|
5544
|
+
return false;
|
|
5545
|
+
}
|
|
5546
|
+
const fileName = file.name.toLowerCase();
|
|
5547
|
+
const fileExt = fileName.substring(fileName.lastIndexOf('.'));
|
|
5548
|
+
console.log('文件扩展名:', fileExt);
|
|
5549
|
+
|
|
5550
|
+
// 只检查 extensions,accept 由 vue-upload-component 处理
|
|
5551
|
+
if (this.extensions) {
|
|
5552
|
+
const allowedExts = this.extensions.toLowerCase().split(',').map(ext => ext.trim().startsWith('.') ? ext.trim() : `.${ext.trim()}`);
|
|
5553
|
+
console.log('允许的扩展名:', allowedExts);
|
|
5554
|
+
if (!allowedExts.includes(fileExt)) {
|
|
5555
|
+
console.log('扩展名不在允许列表中');
|
|
5556
|
+
this.$message.error(`不支持的文件类型 "${fileExt}",请上传 ${this.extensions} 格式的文件`);
|
|
5557
|
+
return false;
|
|
5558
|
+
}
|
|
5559
|
+
}
|
|
5560
|
+
console.log('文件类型验证通过');
|
|
5561
|
+
return true;
|
|
5562
|
+
},
|
|
5535
5563
|
onWatchInputFiles(newFile, oldFile) {
|
|
5536
5564
|
if (newFile && !oldFile) {
|
|
5537
5565
|
// add file
|
|
5538
|
-
console.log('add', newFile);
|
|
5566
|
+
console.log('add file:', newFile);
|
|
5567
|
+
console.log('extensions:', this.extensions);
|
|
5568
|
+
console.log('accept:', this.accept);
|
|
5569
|
+
|
|
5570
|
+
// 验证文件类型
|
|
5571
|
+
if (!this.validateFileType(newFile)) {
|
|
5572
|
+
// 如果验证失败,移除文件
|
|
5573
|
+
console.log('文件类型验证失败,尝试移除文件');
|
|
5574
|
+
console.log('uploadRef:', this.uploadRef);
|
|
5575
|
+
console.log('$refs:', this.$refs);
|
|
5576
|
+
if (this.$refs[this.uploadRef]) {
|
|
5577
|
+
this.$refs[this.uploadRef].remove(newFile);
|
|
5578
|
+
} else {
|
|
5579
|
+
console.error('无法找到 uploadRef 引用');
|
|
5580
|
+
}
|
|
5581
|
+
return;
|
|
5582
|
+
}
|
|
5583
|
+
console.log('文件类型验证通过,继续上传');
|
|
5584
|
+
// 不要在这里 return,让文件继续走原有的上传逻辑
|
|
5539
5585
|
}
|
|
5540
5586
|
if (newFile && oldFile) {
|
|
5541
5587
|
// update file
|
|
@@ -5611,7 +5657,6 @@ var __vue_render__$t = function () {
|
|
|
5611
5657
|
"chunk-enabled": _vm.chunkEnabled,
|
|
5612
5658
|
chunk: _vm.chunkConfig,
|
|
5613
5659
|
accept: _vm.accept,
|
|
5614
|
-
extensions: _vm.extensions,
|
|
5615
5660
|
size: _vm.fileSizeLimit,
|
|
5616
5661
|
"post-action": _vm.postAction,
|
|
5617
5662
|
multiple: _vm.multiple,
|
|
@@ -5752,11 +5797,11 @@ __vue_render__$t._withStripped = true;
|
|
|
5752
5797
|
/* style */
|
|
5753
5798
|
const __vue_inject_styles__$t = function (inject) {
|
|
5754
5799
|
if (!inject) return
|
|
5755
|
-
inject("data-v-11828382_0", { source: "[data-v-11828382] .ele-upload__inner {\n opacity: 1 !important;\n cursor: pointer;\n border: 1px dashed var(--idooel-form-title-border-color);\n background: var(--idooel-form-upload-bg-color) !important;\n border-radius: var(--idooel-form-border-radius);\n}\n[data-v-11828382] .ele-upload__inner:hover {\n border-color: var(--idooel-form-upload-border-hover-color);\n}\n.ele-upload__wrapper[data-v-11828382] {\n width: 100%;\n}\n.ele-upload__wrapper .ele-upload__area[data-v-11828382] {\n padding: 16px;\n width: 100%;\n height: 80px;\n display: flex;\n flex-direction: row;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--icon[data-v-11828382] {\n color: var(--idooel-primary-color);\n display: flex;\n flex-direction: row;\n align-items: center;\n font-size: 16x;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload[data-v-11828382] {\n font-size: 48px;\n color: var(--idooel-primary-color);\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--icon .anticon[data-v-11828382] {\n font-size: 48px;\n color: var(--idooel-primary-color);\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--text[data-v-11828382] {\n margin-left: 16px;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--text .ele-upload__message[data-v-11828382] {\n font-size: 16px;\n color: var(--idoole-black-088);\n text-align: left;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--text .ele-upload__ext[data-v-11828382] {\n text-align: left;\n font-size: 14px;\n color: var(--idoole-black-06);\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item[data-v-11828382] {\n width: 100%;\n margin-top: 8px;\n padding: 8px 12px;\n border-radius: var(--idooel-form-border-radius);\n background: var(--idooel-form-upload-bg-color);\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__name[data-v-11828382] {\n flex: 1;\n text-align: left;\n white-space: nowrap;\n overflow: hidden;\n font-size: 14px;\n margin-left: 8px;\n cursor: pointer;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__name .ele-file__inner[data-v-11828382] {\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__delete[data-v-11828382] {\n margin-left: 8px;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__delete .ele-file__delete--icon[data-v-11828382] {\n margin-left: 8px;\n cursor: pointer;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["/Users/huangshan/Goldgov/front/ganjiao/base-elearning-frontend-model/packages/components/packages/upload/src/index.vue","index.vue"],"names":[],"mappings":"AA2WA;EACA,qBAAA;EACA,eAAA;EACA,wDAAA;EACA,yDAAA;EAIA,+CAAA;AC7WA;AD0WA;EACA,0DAAA;ACxWA;AD4WA;EACA,WAAA;ACzWA;AD0WA;EACA,aAAA;EACA,WAAA;EACA,YAAA;EACA,aAAA;EACA,mBAAA;ACxWA;ADyWA;EACA,kCAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;EACA,cAAA;ACvWA;ADwWA;EACA,eAAA;EACA,kCAAA;ACtWA;ADwWA;EACA,eAAA;EACA,kCAAA;ACtWA;ADyWA;EACA,iBAAA;ACvWA;ADwWA;EACA,eAAA;EACA,8BAAA;EACA,gBAAA;ACtWA;ADwWA;EACA,gBAAA;EACA,eAAA;EACA,6BAAA;ACtWA;AD2WA;EACA,WAAA;EACA,eAAA;EACA,iBAAA;EACA,+CAAA;EACA,8CAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;ACzWA;AD2WA;EACA,OAAA;EACA,gBAAA;EACA,mBAAA;EACA,gBAAA;EACA,eAAA;EACA,gBAAA;EACA,eAAA;ACzWA;AD0WA;EACA,gBAAA;EACA,uBAAA;ACxWA;AD2WA;EACA,gBAAA;ACzWA;AD0WA;EACA,gBAAA;EACA,eAAA;ACxWA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\n <div class=\"ele-upload__wrapper\">\n <FileUpload\n class=\"ele-upload__inner\"\n v-show=\"isShowUploadContainer\"\n v-model=\"files\"\n :ref=\"uploadRef\"\n :drop=\"drop\"\n :chunk-enabled=\"chunkEnabled\"\n :chunk=\"chunkConfig\"\n :accept=\"accept\"\n :extensions=\"extensions\"\n :size=\"fileSizeLimit\"\n :post-action=\"postAction\"\n :multiple=\"multiple\"\n :headers=\"headers\"\n :maximum=\"getMaximum\"\n @input-file=\"onWatchInputFiles\"\n @input=\"onWatchFiles\"\n style=\"width: 100%;\">\n <section class=\"ele-upload__area\">\n <div class=\"ele-upload__area--icon\">\n <template v-if=\"iconIsZhWrod\">\n {{ icon }}\n </template>\n <template v-else>\n <ele-icon :type=\"icon\"></ele-icon>\n </template>\n </div>\n <div class=\"ele-upload__area--text\">\n <div class=\"ele-upload__message\" v-if=\"message\" v-html=\"message\"></div>\n <div class=\"ele-upload__message\" v-else>单击或拖动文件到该区域以上传</div>\n <div class=\"ele-upload__ext\" v-if=\"ext\" v-html=\"ext\"></div>\n <div class=\"ele-upload__ext\" v-else>文件小于{{ size }}M</div>\n </div>\n </section>\n </FileUpload>\n <section class=\"ele-files__wrapper\">\n <div class=\"ele-file__item\" v-for=\"(file, idx) in buildedFiles\" :key=\"idx\">\n <div class=\"ele-file__suffix--icon\">\n <ele-icon :type=\"fileSuffixIcon[file.suffix] ? fileSuffixIcon[file.suffix].name : 'icon-file'\"></ele-icon>\n </div>\n <div class=\"ele-file__name\">\n <div class=\"ele-file__inner\" @click=\"handleClickDownload(file)\">{{ file.name }}</div>\n <div v-if=\"(!file.success && file.progress)\" class=\"ele-uplpad__progress\">\n <a-progress :strokeWidth=\"2\" :percent=\"Number(file.progress)\" size=\"small\" />\n </div>\n </div>\n <div class=\"ele-file__delete\" v-if=\"file.success || file.error || !file.response\">\n <span class=\"ele-file__size\">{{ (file.size / byteConversion).toFixed(2) }}M</span>\n <span class=\"ele-file__delete--icon\" @click=\"handleClickDelete(file)\">\n <ele-icon type=\"delete\"></ele-icon>\n </span>\n </div>\n </div>\n </section>\n </div>\n</template>\n\n<script>\nimport FileUpload from 'vue-upload-component'\nimport { v4 as uuidv4 } from 'uuid'\nimport { route, net, type } from '@idooel/shared'\nexport default {\n name: 'ele-upload',\n components: {\n FileUpload\n },\n model: {\n prop: 'value',\n event: 'change'\n },\n props: {\n url: {\n type: String,\n //TODO\n default: `zuul/api-file/workbench/file`\n },\n icon: {\n type: String,\n default: '上传'\n },\n size: {\n type: Number,\n default: 100\n },\n message: {\n type: String,\n default: '单击或拖动文件到该区域以上传'\n },\n ext: {\n type: String\n },\n extensions: {\n type: String\n },\n accept: {\n type: String\n },\n maximum: {\n type: Number,\n default: 10\n },\n multiple: {\n type: Boolean,\n default: false\n },\n drop: {\n type: Boolean,\n default: true\n },\n value: {\n type: [String, Array]\n },\n querys: {\n type: Object,\n default: () => ({\n _csrf: localStorage.getItem('token'),\n _t: new Date().valueOf()\n })\n },\n headers: {\n type: Object,\n default: () => ({\n 'X-XSRF-TOKEN': localStorage.getItem('token')\n })\n },\n byteConversion: {\n type: Number,\n default: 1024 * 1024\n },\n chunkEnabled: {\n type: Boolean,\n default: true\n }\n },\n data() {\n return {\n files: [],\n buildedFiles: [],\n saveToServerAsyncPageTimer: null\n }\n },\n watch: {\n value: {\n async handler (value) {\n if (type.isArray(value)) {\n // multiple\n } else if (type.isEmpty(value)) {\n this.files = []\n this.buildedFiles = []\n } else {\n // single\n this.fetchFileWithFileId()\n }\n },\n immediate: true\n }\n },\n computed: {\n prefixPath () {\n return window.prefixPath\n },\n iconIsZhWrod () {\n return type.isZhWord(this.icon)\n },\n getPayloads () {\n return {\n override: false\n }\n },\n chunkConfig () {\n return {\n action: `${this.prefixPath}zuul/api-file/workbench/file/temp/chunk/vue`,\n headers: {\n ...this.headers\n },\n minSize: 3 * this.byteConversion,\n maxActive: 3,\n maxRetries: 5,\n startBody: {\n override: true,\n path: '/cw'\n },\n uploadBody: {\n override: true,\n path: '/cw'\n },\n finishBody: {\n override: true,\n path: '/cw'\n }\n }\n },\n isFileUploadSuccessed () {\n return this.files.every(file => file.success)\n },\n isShowUploadContainer () {\n if (this.multiple) {\n if (this.isFileUploadSuccessed && this.buildedFiles.length >= this.maximum) {\n return false\n } else {\n return true\n }\n } else {\n const [file = {}] = this.buildedFiles\n if (this.buildedFiles.length < 1) {\n return true\n }\n if ((this.isFileUploadSuccessed && this.buildedFiles.length >= 1) || !file.response) {\n return false\n } else {\n return true\n }\n }\n },\n getMaximum () {\n return this.multiple ? this.maximum : 1\n },\n fileSizeLimit () {\n return this.size * this.byteConversion\n },\n postAction () {\n const ret = route.toQueryString(this.querys)\n return `${this.prefixPath}${this.url}?${ret}`\n },\n uploadRef () {\n return uuidv4()\n },\n fileSuffixIcon () {\n return {\n 'doc': { name: 'icon-doc' },\n 'html': { name: 'icon-html' },\n 'mp4': { name: 'icon-mp' },\n 'pdf': { name: 'icon-pdf' },\n 'ppt': { name: 'icon-ppt' },\n 'psd': { name: 'icon-psd' },\n 'rtf': { name: 'icon-rtf' },\n 'txt': { name: 'icon-txt' },\n 'vis': { name: 'icon-vis' },\n 'xls': { name: 'icon-xls' },\n 'xml': { name: 'icon-xml' },\n 'zip': { name: 'icon-zip' },\n 'jpg': { name: 'icon-img' },\n 'mp3': { name: 'icon-mp1' },\n }\n },\n fileIds () {\n const fileIds = this.buildedFiles.map(file => {\n return file.fileID\n })\n return this.multiple ? fileIds : fileIds[0]\n },\n fileResponseData () {\n return this.multiple ? this.buildedFiles : this.buildedFiles[0]\n }\n },\n methods: {\n async fetchFileWithFileId () {\n if (!this.value) return\n await net.get(\n `/api-file/file/${this.value}`\n ).then(resp => {\n const { data } = resp\n this.buildedFiles = [data]\n this.files = [data]\n })\n },\n handleClickDownload (file) {\n const { fileID: fileId } = file\n window.open(`/api-file/workbench/file/stream/${fileId}?origin=true`)\n },\n handleClickDelete (file) {\n this.$refs[this.uploadRef].remove(file)\n const { fileID } = file\n this.files = this.files.filter(file => file.fileID !== fileID)\n this.buildedFiles = this.buildedFiles.filter(file => file.fileID !== fileID)\n this.$emit('change', this.fileIds)\n },\n onWatchFiles (files) {\n this.files = files\n this.buildedFiles = this.files.map(file => {\n return {\n ...file.response.data,\n ...file\n }\n })\n if (this.isFileUploadSuccessed) {\n this.$emit('change', this.fileIds)\n this.$emit('on-success', this.fileResponseData)\n }\n },\n async saveToServerAsyncPage (payloads = {}) {\n net.post('zuul/api-file/workbench/file/temp/saveToServerAsyncPage', payloads, { \n headers: {\n 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'\n }\n }).then(resp =>{\n const { data } = resp\n if (data !== 'saveToServerAsyncPage') {\n clearInterval(this.saveToServerAsyncPageTimer)\n }\n })\n // const ret = await net.post({\n // url: 'zuul/api-file/workbench/file/temp/saveToServerAsyncPage',\n // method: 'POST',\n // data: { ...payloads }\n // }).then(resp => {\n // const { data: { data, code, message } } = resp\n // if (code !== '2000') {\n // this.$Message.error(message)\n // return\n // }\n // if (data !== 'saveToServerAsyncPage') {\n // clearInterval(timer)\n // const { fileID, size } = data\n // this.$emit('on-success', { ...data, fileId: fileID })\n // this.$Message.success('同步成功')\n // return { fileId: fileID, size }\n // }\n // })\n // return ret\n },\n onWatchInputFiles (newFile, oldFile) {\n if (newFile && !oldFile) {\n // add file\n console.log('add', newFile)\n }\n if (newFile && oldFile) {\n // update file\n console.log('update', newFile)\n const { success, active, chunk, response } = newFile\n if (chunk && success && !active) {\n console.log('chunk end')\n const { data: { file, type } } = response\n const payloads = {\n filePath: file.match(/\\/cw(.*)/) ? file.match(/\\/cw(.*)/)[0] : void 0,\n asyncID: uuidv4(),\n isDeleteOrigin: false,\n toImage: type === 'pdf' ? true : false,\n unzip: type === 'zip' ? true : false,\n _csrf: localStorage.getItem('token')\n }\n this.saveToServerAsyncPageTimer = setInterval(() => {\n this.saveToServerAsyncPage(payloads)\n }, 2000)\n }\n }\n if (!newFile && oldFile) {\n // delete file\n console.log('delete')\n }\n if (Boolean(newFile) !== Boolean(oldFile) || oldFile.error !== newFile.error) {\n if (!this.$refs[this.uploadRef].active) {\n this.$refs[this.uploadRef].active = true\n }\n }\n }\n }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n::v-deep .ele-upload__inner {\n opacity: 1 !important;\n cursor: pointer;\n border: 1px dashed var(--idooel-form-title-border-color);\n background: var(--idooel-form-upload-bg-color) !important;\n &:hover {\n border-color: var(--idooel-form-upload-border-hover-color);\n }\n border-radius: var(--idooel-form-border-radius);\n}\n.ele-upload__wrapper {\n width: 100%;\n .ele-upload__area {\n padding: 16px;\n width: 100%;\n height: 80px;\n display: flex;\n flex-direction: row;\n .ele-upload__area--icon {\n color: var(--idooel-primary-color);\n display: flex;\n flex-direction: row;\n align-items: center;\n font-size: 16x;\n .anticon-cloud-upload {\n font-size: 48px;\n color: var(--idooel-primary-color);\n }\n .anticon {\n font-size: 48px;\n color: var(--idooel-primary-color);\n }\n }\n .ele-upload__area--text {\n margin-left: 16px;\n .ele-upload__message {\n font-size: 16px;\n color: var(--idoole-black-088);\n text-align: left;\n }\n .ele-upload__ext {\n text-align: left;\n font-size: 14px;\n color: var(--idoole-black-06);\n }\n }\n }\n .ele-files__wrapper {\n .ele-file__item {\n width: 100%;\n margin-top: 8px;\n padding: 8px 12px;\n border-radius: var(--idooel-form-border-radius);\n background: var(--idooel-form-upload-bg-color);\n display: flex;\n flex-direction: row;\n align-items: center;\n .ele-file__suffix--icon {}\n .ele-file__name {\n flex: 1;\n text-align: left;\n white-space: nowrap;\n overflow: hidden;\n font-size: 14px;\n margin-left: 8px;\n cursor: pointer;\n .ele-file__inner {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n .ele-file__delete {\n margin-left: 8px;\n .ele-file__delete--icon {\n margin-left: 8px;\n cursor: pointer;\n }\n }\n }\n }\n}\n</style>","::v-deep .ele-upload__inner {\n opacity: 1 !important;\n cursor: pointer;\n border: 1px dashed var(--idooel-form-title-border-color);\n background: var(--idooel-form-upload-bg-color) !important;\n border-radius: var(--idooel-form-border-radius);\n}\n::v-deep .ele-upload__inner:hover {\n border-color: var(--idooel-form-upload-border-hover-color);\n}\n\n.ele-upload__wrapper {\n width: 100%;\n}\n.ele-upload__wrapper .ele-upload__area {\n padding: 16px;\n width: 100%;\n height: 80px;\n display: flex;\n flex-direction: row;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--icon {\n color: var(--idooel-primary-color);\n display: flex;\n flex-direction: row;\n align-items: center;\n font-size: 16x;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n font-size: 48px;\n color: var(--idooel-primary-color);\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--icon .anticon {\n font-size: 48px;\n color: var(--idooel-primary-color);\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--text {\n margin-left: 16px;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--text .ele-upload__message {\n font-size: 16px;\n color: var(--idoole-black-088);\n text-align: left;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n text-align: left;\n font-size: 14px;\n color: var(--idoole-black-06);\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item {\n width: 100%;\n margin-top: 8px;\n padding: 8px 12px;\n border-radius: var(--idooel-form-border-radius);\n background: var(--idooel-form-upload-bg-color);\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__name {\n flex: 1;\n text-align: left;\n white-space: nowrap;\n overflow: hidden;\n font-size: 14px;\n margin-left: 8px;\n cursor: pointer;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__name .ele-file__inner {\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__delete {\n margin-left: 8px;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__delete .ele-file__delete--icon {\n margin-left: 8px;\n cursor: pointer;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
|
|
5800
|
+
inject("data-v-b00d3688_0", { source: "[data-v-b00d3688] .ele-upload__inner {\n opacity: 1 !important;\n cursor: pointer;\n border: 1px dashed var(--idooel-form-title-border-color);\n background: var(--idooel-form-upload-bg-color) !important;\n border-radius: var(--idooel-form-border-radius);\n}\n[data-v-b00d3688] .ele-upload__inner:hover {\n border-color: var(--idooel-form-upload-border-hover-color);\n}\n.ele-upload__wrapper[data-v-b00d3688] {\n width: 100%;\n}\n.ele-upload__wrapper .ele-upload__area[data-v-b00d3688] {\n padding: 16px;\n width: 100%;\n height: 80px;\n display: flex;\n flex-direction: row;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--icon[data-v-b00d3688] {\n color: var(--idooel-primary-color);\n display: flex;\n flex-direction: row;\n align-items: center;\n font-size: 16x;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload[data-v-b00d3688] {\n font-size: 48px;\n color: var(--idooel-primary-color);\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--icon .anticon[data-v-b00d3688] {\n font-size: 48px;\n color: var(--idooel-primary-color);\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--text[data-v-b00d3688] {\n margin-left: 16px;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--text .ele-upload__message[data-v-b00d3688] {\n font-size: 16px;\n color: var(--idoole-black-088);\n text-align: left;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--text .ele-upload__ext[data-v-b00d3688] {\n text-align: left;\n font-size: 14px;\n color: var(--idoole-black-06);\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item[data-v-b00d3688] {\n width: 100%;\n margin-top: 8px;\n padding: 8px 12px;\n border-radius: var(--idooel-form-border-radius);\n background: var(--idooel-form-upload-bg-color);\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__name[data-v-b00d3688] {\n flex: 1;\n text-align: left;\n white-space: nowrap;\n overflow: hidden;\n font-size: 14px;\n margin-left: 8px;\n cursor: pointer;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__name .ele-file__inner[data-v-b00d3688] {\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__delete[data-v-b00d3688] {\n margin-left: 8px;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__delete .ele-file__delete--icon[data-v-b00d3688] {\n margin-left: 8px;\n cursor: pointer;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["/Users/huangshan/Goldgov/front/ganjiao/base-elearning-frontend-model/packages/components/packages/upload/src/index.vue","index.vue"],"names":[],"mappings":"AA6ZA;EACA,qBAAA;EACA,eAAA;EACA,wDAAA;EACA,yDAAA;EAIA,+CAAA;AC/ZA;AD4ZA;EACA,0DAAA;AC1ZA;AD8ZA;EACA,WAAA;AC3ZA;AD4ZA;EACA,aAAA;EACA,WAAA;EACA,YAAA;EACA,aAAA;EACA,mBAAA;AC1ZA;AD2ZA;EACA,kCAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;EACA,cAAA;ACzZA;AD0ZA;EACA,eAAA;EACA,kCAAA;ACxZA;AD0ZA;EACA,eAAA;EACA,kCAAA;ACxZA;AD2ZA;EACA,iBAAA;ACzZA;AD0ZA;EACA,eAAA;EACA,8BAAA;EACA,gBAAA;ACxZA;AD0ZA;EACA,gBAAA;EACA,eAAA;EACA,6BAAA;ACxZA;AD6ZA;EACA,WAAA;EACA,eAAA;EACA,iBAAA;EACA,+CAAA;EACA,8CAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;AC3ZA;AD6ZA;EACA,OAAA;EACA,gBAAA;EACA,mBAAA;EACA,gBAAA;EACA,eAAA;EACA,gBAAA;EACA,eAAA;AC3ZA;AD4ZA;EACA,gBAAA;EACA,uBAAA;AC1ZA;AD6ZA;EACA,gBAAA;AC3ZA;AD4ZA;EACA,gBAAA;EACA,eAAA;AC1ZA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\n <div class=\"ele-upload__wrapper\">\n <FileUpload\n class=\"ele-upload__inner\"\n v-show=\"isShowUploadContainer\"\n v-model=\"files\"\n :ref=\"uploadRef\"\n :drop=\"drop\"\n :chunk-enabled=\"chunkEnabled\"\n :chunk=\"chunkConfig\"\n :accept=\"accept\"\n :size=\"fileSizeLimit\"\n :post-action=\"postAction\"\n :multiple=\"multiple\"\n :headers=\"headers\"\n :maximum=\"getMaximum\"\n @input-file=\"onWatchInputFiles\"\n @input=\"onWatchFiles\"\n style=\"width: 100%;\">\n <section class=\"ele-upload__area\">\n <div class=\"ele-upload__area--icon\">\n <template v-if=\"iconIsZhWrod\">\n {{ icon }}\n </template>\n <template v-else>\n <ele-icon :type=\"icon\"></ele-icon>\n </template>\n </div>\n <div class=\"ele-upload__area--text\">\n <div class=\"ele-upload__message\" v-if=\"message\" v-html=\"message\"></div>\n <div class=\"ele-upload__message\" v-else>单击或拖动文件到该区域以上传</div>\n <div class=\"ele-upload__ext\" v-if=\"ext\" v-html=\"ext\"></div>\n <div class=\"ele-upload__ext\" v-else>文件小于{{ size }}M</div>\n </div>\n </section>\n </FileUpload>\n <section class=\"ele-files__wrapper\">\n <div class=\"ele-file__item\" v-for=\"(file, idx) in buildedFiles\" :key=\"idx\">\n <div class=\"ele-file__suffix--icon\">\n <ele-icon :type=\"fileSuffixIcon[file.suffix] ? fileSuffixIcon[file.suffix].name : 'icon-file'\"></ele-icon>\n </div>\n <div class=\"ele-file__name\">\n <div class=\"ele-file__inner\" @click=\"handleClickDownload(file)\">{{ file.name }}</div>\n <div v-if=\"(!file.success && file.progress)\" class=\"ele-uplpad__progress\">\n <a-progress :strokeWidth=\"2\" :percent=\"Number(file.progress)\" size=\"small\" />\n </div>\n </div>\n <div class=\"ele-file__delete\" v-if=\"file.success || file.error || !file.response\">\n <span class=\"ele-file__size\">{{ (file.size / byteConversion).toFixed(2) }}M</span>\n <span class=\"ele-file__delete--icon\" @click=\"handleClickDelete(file)\">\n <ele-icon type=\"delete\"></ele-icon>\n </span>\n </div>\n </div>\n </section>\n </div>\n</template>\n\n<script>\nimport FileUpload from 'vue-upload-component'\nimport { v4 as uuidv4 } from 'uuid'\nimport { route, net, type } from '@idooel/shared'\n// import { message } from 'ant-design-vue'\nexport default {\n name: 'ele-upload',\n components: {\n FileUpload\n },\n model: {\n prop: 'value',\n event: 'change'\n },\n props: {\n url: {\n type: String,\n //TODO\n default: `zuul/api-file/workbench/file`\n },\n icon: {\n type: String,\n default: '上传'\n },\n size: {\n type: Number,\n default: 100\n },\n message: {\n type: String,\n default: '单击或拖动文件到该区域以上传'\n },\n ext: {\n type: String\n },\n extensions: {\n type: String\n },\n accept: {\n type: String\n },\n maximum: {\n type: Number,\n default: 10\n },\n multiple: {\n type: Boolean,\n default: false\n },\n drop: {\n type: Boolean,\n default: true\n },\n value: {\n type: [String, Array]\n },\n querys: {\n type: Object,\n default: () => ({\n _csrf: localStorage.getItem('token'),\n _t: new Date().valueOf()\n })\n },\n headers: {\n type: Object,\n default: () => ({\n 'X-XSRF-TOKEN': localStorage.getItem('token')\n })\n },\n byteConversion: {\n type: Number,\n default: 1024 * 1024\n },\n chunkEnabled: {\n type: Boolean,\n default: true\n }\n },\n data() {\n return {\n files: [],\n buildedFiles: [],\n saveToServerAsyncPageTimer: null,\n uploadRefId: null\n }\n },\n watch: {\n value: {\n async handler (value) {\n if (type.isArray(value)) {\n // multiple\n } else if (type.isEmpty(value)) {\n this.files = []\n this.buildedFiles = []\n } else {\n // single\n this.fetchFileWithFileId()\n }\n },\n immediate: true\n }\n },\n computed: {\n prefixPath () {\n return window.prefixPath\n },\n iconIsZhWrod () {\n return type.isZhWord(this.icon)\n },\n getPayloads () {\n return {\n override: false\n }\n },\n chunkConfig () {\n return {\n action: `${this.prefixPath}zuul/api-file/workbench/file/temp/chunk/vue`,\n headers: {\n ...this.headers\n },\n minSize: 3 * this.byteConversion,\n maxActive: 3,\n maxRetries: 5,\n startBody: {\n override: true,\n path: '/cw'\n },\n uploadBody: {\n override: true,\n path: '/cw'\n },\n finishBody: {\n override: true,\n path: '/cw'\n }\n }\n },\n isFileUploadSuccessed () {\n return this.files.every(file => file.success)\n },\n isShowUploadContainer () {\n if (this.multiple) {\n if (this.isFileUploadSuccessed && this.buildedFiles.length >= this.maximum) {\n return false\n } else {\n return true\n }\n } else {\n const [file = {}] = this.buildedFiles\n if (this.buildedFiles.length < 1) {\n return true\n }\n if ((this.isFileUploadSuccessed && this.buildedFiles.length >= 1) || !file.response) {\n return false\n } else {\n return true\n }\n }\n },\n getMaximum () {\n return this.multiple ? this.maximum : 1\n },\n fileSizeLimit () {\n return this.size * this.byteConversion\n },\n postAction () {\n const ret = route.toQueryString(this.querys)\n return `${this.prefixPath}${this.url}?${ret}`\n },\n uploadRef () {\n if (!this.uploadRefId) {\n this.uploadRefId = `uploadRef_${uuidv4()}`\n }\n return this.uploadRefId\n },\n fileSuffixIcon () {\n return {\n 'doc': { name: 'icon-doc' },\n 'html': { name: 'icon-html' },\n 'mp4': { name: 'icon-mp' },\n 'pdf': { name: 'icon-pdf' },\n 'ppt': { name: 'icon-ppt' },\n 'psd': { name: 'icon-psd' },\n 'rtf': { name: 'icon-rtf' },\n 'txt': { name: 'icon-txt' },\n 'vis': { name: 'icon-vis' },\n 'xls': { name: 'icon-xls' },\n 'xml': { name: 'icon-xml' },\n 'zip': { name: 'icon-zip' },\n 'jpg': { name: 'icon-img' },\n 'mp3': { name: 'icon-mp1' },\n }\n },\n fileIds () {\n const fileIds = this.buildedFiles.map(file => {\n return file.fileID\n })\n return this.multiple ? fileIds : fileIds[0]\n },\n fileResponseData () {\n return this.multiple ? this.buildedFiles : this.buildedFiles[0]\n }\n },\n methods: {\n async fetchFileWithFileId () {\n if (!this.value) return\n await net.get(\n `/api-file/file/${this.value}`\n ).then(resp => {\n const { data } = resp\n this.buildedFiles = [data]\n this.files = [data]\n })\n },\n handleClickDownload (file) {\n const { fileID: fileId } = file\n window.open(`/api-file/workbench/file/stream/${fileId}?origin=true`)\n },\n handleClickDelete (file) {\n this.$refs[this.uploadRef].remove(file)\n const { fileID } = file\n this.files = this.files.filter(file => file.fileID !== fileID)\n this.buildedFiles = this.buildedFiles.filter(file => file.fileID !== fileID)\n this.$emit('change', this.fileIds)\n },\n onWatchFiles (files) {\n this.files = files\n this.buildedFiles = this.files.map(file => {\n return {\n ...file.response.data,\n ...file\n }\n })\n if (this.isFileUploadSuccessed) {\n this.$emit('change', this.fileIds)\n this.$emit('on-success', this.fileResponseData)\n }\n },\n async saveToServerAsyncPage (payloads = {}) {\n net.post('zuul/api-file/workbench/file/temp/saveToServerAsyncPage', payloads, { \n headers: {\n 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'\n }\n }).then(resp =>{\n const { data } = resp\n if (data !== 'saveToServerAsyncPage') {\n clearInterval(this.saveToServerAsyncPageTimer)\n }\n })\n // const ret = await net.post({\n // url: 'zuul/api-file/workbench/file/temp/saveToServerAsyncPage',\n // method: 'POST',\n // data: { ...payloads }\n // }).then(resp => {\n // const { data: { data, code, message } } = resp\n // if (code !== '2000') {\n // this.$Message.error(message)\n // return\n // }\n // if (data !== 'saveToServerAsyncPage') {\n // clearInterval(timer)\n // const { fileID, size } = data\n // this.$emit('on-success', { ...data, fileId: fileID })\n // this.$Message.success('同步成功')\n // return { fileId: fileID, size }\n // }\n // })\n // return ret\n },\n // 验证文件类型\n validateFileType(file) {\n if (!file || !file.name) {\n console.log('文件或文件名不存在')\n return false\n }\n \n const fileName = file.name.toLowerCase()\n const fileExt = fileName.substring(fileName.lastIndexOf('.'))\n console.log('文件扩展名:', fileExt)\n \n // 只检查 extensions,accept 由 vue-upload-component 处理\n if (this.extensions) {\n const allowedExts = this.extensions.toLowerCase()\n .split(',')\n .map(ext => ext.trim().startsWith('.') ? ext.trim() : `.${ext.trim()}`)\n console.log('允许的扩展名:', allowedExts)\n \n if (!allowedExts.includes(fileExt)) {\n console.log('扩展名不在允许列表中')\n this.$message.error(`不支持的文件类型 \"${fileExt}\",请上传 ${this.extensions} 格式的文件`)\n return false\n }\n }\n \n console.log('文件类型验证通过')\n return true\n },\n onWatchInputFiles (newFile, oldFile) {\n if (newFile && !oldFile) {\n // add file\n console.log('add file:', newFile)\n console.log('extensions:', this.extensions)\n console.log('accept:', this.accept)\n \n // 验证文件类型\n if (!this.validateFileType(newFile)) {\n // 如果验证失败,移除文件\n console.log('文件类型验证失败,尝试移除文件')\n console.log('uploadRef:', this.uploadRef)\n console.log('$refs:', this.$refs)\n if (this.$refs[this.uploadRef]) {\n this.$refs[this.uploadRef].remove(newFile)\n } else {\n console.error('无法找到 uploadRef 引用')\n }\n return\n }\n console.log('文件类型验证通过,继续上传')\n // 不要在这里 return,让文件继续走原有的上传逻辑\n }\n if (newFile && oldFile) {\n // update file\n console.log('update', newFile)\n const { success, active, chunk, response } = newFile\n if (chunk && success && !active) {\n console.log('chunk end')\n const { data: { file, type } } = response\n const payloads = {\n filePath: file.match(/\\/cw(.*)/) ? file.match(/\\/cw(.*)/)[0] : void 0,\n asyncID: uuidv4(),\n isDeleteOrigin: false,\n toImage: type === 'pdf' ? true : false,\n unzip: type === 'zip' ? true : false,\n _csrf: localStorage.getItem('token')\n }\n this.saveToServerAsyncPageTimer = setInterval(() => {\n this.saveToServerAsyncPage(payloads)\n }, 2000)\n }\n }\n if (!newFile && oldFile) {\n // delete file\n console.log('delete')\n }\n if (Boolean(newFile) !== Boolean(oldFile) || oldFile.error !== newFile.error) {\n if (!this.$refs[this.uploadRef].active) {\n this.$refs[this.uploadRef].active = true\n }\n }\n }\n }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n::v-deep .ele-upload__inner {\n opacity: 1 !important;\n cursor: pointer;\n border: 1px dashed var(--idooel-form-title-border-color);\n background: var(--idooel-form-upload-bg-color) !important;\n &:hover {\n border-color: var(--idooel-form-upload-border-hover-color);\n }\n border-radius: var(--idooel-form-border-radius);\n}\n.ele-upload__wrapper {\n width: 100%;\n .ele-upload__area {\n padding: 16px;\n width: 100%;\n height: 80px;\n display: flex;\n flex-direction: row;\n .ele-upload__area--icon {\n color: var(--idooel-primary-color);\n display: flex;\n flex-direction: row;\n align-items: center;\n font-size: 16x;\n .anticon-cloud-upload {\n font-size: 48px;\n color: var(--idooel-primary-color);\n }\n .anticon {\n font-size: 48px;\n color: var(--idooel-primary-color);\n }\n }\n .ele-upload__area--text {\n margin-left: 16px;\n .ele-upload__message {\n font-size: 16px;\n color: var(--idoole-black-088);\n text-align: left;\n }\n .ele-upload__ext {\n text-align: left;\n font-size: 14px;\n color: var(--idoole-black-06);\n }\n }\n }\n .ele-files__wrapper {\n .ele-file__item {\n width: 100%;\n margin-top: 8px;\n padding: 8px 12px;\n border-radius: var(--idooel-form-border-radius);\n background: var(--idooel-form-upload-bg-color);\n display: flex;\n flex-direction: row;\n align-items: center;\n .ele-file__suffix--icon {}\n .ele-file__name {\n flex: 1;\n text-align: left;\n white-space: nowrap;\n overflow: hidden;\n font-size: 14px;\n margin-left: 8px;\n cursor: pointer;\n .ele-file__inner {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n .ele-file__delete {\n margin-left: 8px;\n .ele-file__delete--icon {\n margin-left: 8px;\n cursor: pointer;\n }\n }\n }\n }\n}\n</style>","::v-deep .ele-upload__inner {\n opacity: 1 !important;\n cursor: pointer;\n border: 1px dashed var(--idooel-form-title-border-color);\n background: var(--idooel-form-upload-bg-color) !important;\n border-radius: var(--idooel-form-border-radius);\n}\n::v-deep .ele-upload__inner:hover {\n border-color: var(--idooel-form-upload-border-hover-color);\n}\n\n.ele-upload__wrapper {\n width: 100%;\n}\n.ele-upload__wrapper .ele-upload__area {\n padding: 16px;\n width: 100%;\n height: 80px;\n display: flex;\n flex-direction: row;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--icon {\n color: var(--idooel-primary-color);\n display: flex;\n flex-direction: row;\n align-items: center;\n font-size: 16x;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n font-size: 48px;\n color: var(--idooel-primary-color);\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--icon .anticon {\n font-size: 48px;\n color: var(--idooel-primary-color);\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--text {\n margin-left: 16px;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--text .ele-upload__message {\n font-size: 16px;\n color: var(--idoole-black-088);\n text-align: left;\n}\n.ele-upload__wrapper .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n text-align: left;\n font-size: 14px;\n color: var(--idoole-black-06);\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item {\n width: 100%;\n margin-top: 8px;\n padding: 8px 12px;\n border-radius: var(--idooel-form-border-radius);\n background: var(--idooel-form-upload-bg-color);\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__name {\n flex: 1;\n text-align: left;\n white-space: nowrap;\n overflow: hidden;\n font-size: 14px;\n margin-left: 8px;\n cursor: pointer;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__name .ele-file__inner {\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__delete {\n margin-left: 8px;\n}\n.ele-upload__wrapper .ele-files__wrapper .ele-file__item .ele-file__delete .ele-file__delete--icon {\n margin-left: 8px;\n cursor: pointer;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
|
|
5756
5801
|
|
|
5757
5802
|
};
|
|
5758
5803
|
/* scoped */
|
|
5759
|
-
const __vue_scope_id__$t = "data-v-
|
|
5804
|
+
const __vue_scope_id__$t = "data-v-b00d3688";
|
|
5760
5805
|
/* module identifier */
|
|
5761
5806
|
const __vue_module_identifier__$t = undefined;
|
|
5762
5807
|
/* functional template */
|
|
@@ -6681,7 +6726,7 @@ __vue_render__$m._withStripped = true;
|
|
|
6681
6726
|
/* style */
|
|
6682
6727
|
const __vue_inject_styles__$m = function (inject) {
|
|
6683
6728
|
if (!inject) return
|
|
6684
|
-
inject("data-v-06685ad4_0", { source: ".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n.margin-t-8 {\n margin-top: 8px;\n}\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-even-color: #
|
|
6729
|
+
inject("data-v-06685ad4_0", { source: ".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n.margin-t-8 {\n margin-top: 8px;\n}\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-odd-color: rgba(0, 0, 0, 0.04);\n --idooel-row-even-color: #FFF;\n --idooel-row-hover-color: #E6F7FF;\n --idooel-form-title-border-color: rgba(0, 0, 0, 0.16);\n --idooel-form-upload-bg-color: rgba(0, 0, 0, 0.02);\n --idooel-form-upload-border-hover-color: #40A9FF;\n --idooel-form-border-radius: 2px;\n --idooel-form-border-err-color: #F5222D;\n --idooel-link-06: #1890FF;\n --idooel-link-03: #91D5FF;\n --idooel-img-crop-err-color: #FFA39E;\n}\n.ant-input-disabled {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n.ant-select-disabled .ant-select-selection {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["index.vue"],"names":[],"mappings":"AAAA;EACE,qBAAqB;AACvB;AACA;EACE,cAAc;AAChB;AACA;EACE,cAAc;AAChB;AACA;EACE,cAAc;AAChB;AAEA;EACE,eAAe;AACjB;AAEA;EACE,+BAA+B;EAC/B,sCAAsC;EACtC,sCAAsC;EACtC,sCAAsC;EACtC,uCAAuC;EACvC,uCAAuC;EACvC,uCAAuC;EACvC,mDAAmD;EACnD,4BAA4B;EAC5B,4BAA4B;EAC5B,0BAA0B;EAC1B,wBAAwB;EACxB,8BAA8B;EAC9B,+BAA+B;EAC/B,qCAAqC;EACrC,2CAA2C;EAC3C,6BAA6B;EAC7B,iCAAiC;EACjC,qDAAqD;EACrD,kDAAkD;EAClD,gDAAgD;EAChD,gCAAgC;EAChC,uCAAuC;EACvC,yBAAyB;EACzB,yBAAyB;EACzB,oCAAoC;AACtC;AAEA;EACE,4DAA4D;AAC9D;AAEA;EACE,4DAA4D;AAC9D;;AAEA,oCAAoC","file":"index.vue","sourcesContent":[".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n\n.margin-t-8 {\n margin-top: 8px;\n}\n\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-odd-color: rgba(0, 0, 0, 0.04);\n --idooel-row-even-color: #FFF;\n --idooel-row-hover-color: #E6F7FF;\n --idooel-form-title-border-color: rgba(0, 0, 0, 0.16);\n --idooel-form-upload-bg-color: rgba(0, 0, 0, 0.02);\n --idooel-form-upload-border-hover-color: #40A9FF;\n --idooel-form-border-radius: 2px;\n --idooel-form-border-err-color: #F5222D;\n --idooel-link-06: #1890FF;\n --idooel-link-03: #91D5FF;\n --idooel-img-crop-err-color: #FFA39E;\n}\n\n.ant-input-disabled {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n.ant-select-disabled .ant-select-selection {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined })
|
|
6685
6730
|
,inject("data-v-06685ad4_1", { source: ".ele-batch-export__content[data-v-06685ad4] {\n height: 106px;\n}\n.ele-batch-export__content .ele-batch-export__container[data-v-06685ad4] {\n border-width: 1px;\n border-style: dashed;\n height: 80px;\n border-color: var(--idooel-link-06);\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 0 16px;\n}\n.ele-batch-export__content .ele-batch-export__container .ele-batch-export__icon[data-v-06685ad4] {\n font-size: 48px;\n color: var(--idooel-link-06);\n}\n.ele-batch-export__content .ele-batch-export__container .ele-batch-export__handle[data-v-06685ad4] {\n margin-left: 16px;\n}\n.ele-batch-export__content .ele-batch-export__container .ele-batch-export__handle .ele-batch-export__btn[data-v-06685ad4] {\n color: var(--idooel-link-06);\n font-size: 16px;\n cursor: pointer;\n}\n.ele-batch-export__content .ele-batch-export__container .ele-batch-export__handle .ele-batch-export__btn--hint[data-v-06685ad4] {\n color: var(--idooel-link-03);\n font-size: 14px;\n}\n.ele-batch-export__content .ele-batch-export__message[data-v-06685ad4] {\n color: var(--idooel-link-06);\n font-size: 14px;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["/Users/huangshan/Goldgov/front/ganjiao/base-elearning-frontend-model/packages/components/packages/batch-export/src/index.vue","index.vue"],"names":[],"mappings":"AAuEA;EACA,aAAA;ACtEA;ADuEA;EACA,iBAAA;EACA,oBAAA;EACA,YAAA;EACA,mCAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;EACA,eAAA;ACrEA;ADsEA;EACA,eAAA;EACA,4BAAA;ACpEA;ADsEA;EACA,iBAAA;ACpEA;ADqEA;EACA,4BAAA;EACA,eAAA;EACA,eAAA;ACnEA;ADqEA;EACA,4BAAA;EACA,eAAA;ACnEA;ADuEA;EACA,4BAAA;EACA,eAAA;ACrEA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\n <ele-modal \n v-model=\"innerValue\" \n v-on=\"$listeners\"\n :buttonGroupMeta=\"buttonGroupMeta\" \n title=\"批量导出\">\n <div class=\"ele-batch-export__content\">\n <div class=\"ele-batch-export__container\">\n <ele-icon class=\"ele-batch-export__icon\" type=\"download\"></ele-icon>\n <div class=\"ele-batch-export__handle\">\n <div class=\"ele-batch-export__btn\" @click=\"handleClick\">导出任务处理中..... 请点击此按钮跳转到“批处理管理”菜单查看任务进度</div>\n <div class=\"ele-batch-export__btn--hint\">批处理任务的准备工作会在后台运行</div>\n </div>\n </div>\n <div class=\"ele-batch-export__message\">\n 您可以请点击上方按钮查看任务进度或关闭弹框\n </div>\n </div>\n </ele-modal>\n</template>\n\n<script>\nexport default {\n name: 'ele-batch-export',\n props: {\n value: {\n type: Boolean,\n default: false\n },\n buttonGroupMeta: {\n type: Object,\n default: () => {\n return {\n elements: [\n {\n label: '关闭',\n key: 'close',\n type: 'primary',\n eventName: 'handleClose'\n }\n ]\n }\n }\n }\n },\n data() {\n return {\n innerValue: false\n }\n },\n watch: {\n value: {\n handler (value) {\n this.$nextTick(() => {\n this.innerValue = value\n })\n },\n immediate: true\n }\n },\n methods: {\n handleClick () {\n this.$emit('on-batch-export')\n }\n }\n}\n</script>\n<style lang=\"scss\">\n@import '../../theme/index';\n</style>\n<style lang=\"scss\" scoped>\n.ele-batch-export__content {\n height: 106px;\n .ele-batch-export__container {\n border-width: 1px;\n border-style: dashed;\n height: 80px;\n border-color: var(--idooel-link-06);\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 0 16px;\n .ele-batch-export__icon {\n font-size: 48px;\n color: var(--idooel-link-06);\n }\n .ele-batch-export__handle {\n margin-left: 16px;\n .ele-batch-export__btn {\n color: var(--idooel-link-06);\n font-size: 16px;\n cursor: pointer;\n }\n .ele-batch-export__btn--hint {\n color: var(--idooel-link-03);\n font-size: 14px;\n }\n }\n }\n .ele-batch-export__message {\n color: var(--idooel-link-06);\n font-size: 14px;\n }\n}\n</style>",".ele-batch-export__content {\n height: 106px;\n}\n.ele-batch-export__content .ele-batch-export__container {\n border-width: 1px;\n border-style: dashed;\n height: 80px;\n border-color: var(--idooel-link-06);\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 0 16px;\n}\n.ele-batch-export__content .ele-batch-export__container .ele-batch-export__icon {\n font-size: 48px;\n color: var(--idooel-link-06);\n}\n.ele-batch-export__content .ele-batch-export__container .ele-batch-export__handle {\n margin-left: 16px;\n}\n.ele-batch-export__content .ele-batch-export__container .ele-batch-export__handle .ele-batch-export__btn {\n color: var(--idooel-link-06);\n font-size: 16px;\n cursor: pointer;\n}\n.ele-batch-export__content .ele-batch-export__container .ele-batch-export__handle .ele-batch-export__btn--hint {\n color: var(--idooel-link-03);\n font-size: 14px;\n}\n.ele-batch-export__content .ele-batch-export__message {\n color: var(--idooel-link-06);\n font-size: 14px;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
|
|
6686
6731
|
|
|
6687
6732
|
};
|
|
@@ -7000,7 +7045,7 @@ __vue_render__$k._withStripped = true;
|
|
|
7000
7045
|
/* style */
|
|
7001
7046
|
const __vue_inject_styles__$k = function (inject) {
|
|
7002
7047
|
if (!inject) return
|
|
7003
|
-
inject("data-v-bfb18322_0", { source: ".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n.margin-t-8 {\n margin-top: 8px;\n}\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-even-color: #
|
|
7048
|
+
inject("data-v-bfb18322_0", { source: ".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n.margin-t-8 {\n margin-top: 8px;\n}\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-odd-color: rgba(0, 0, 0, 0.04);\n --idooel-row-even-color: #FFF;\n --idooel-row-hover-color: #E6F7FF;\n --idooel-form-title-border-color: rgba(0, 0, 0, 0.16);\n --idooel-form-upload-bg-color: rgba(0, 0, 0, 0.02);\n --idooel-form-upload-border-hover-color: #40A9FF;\n --idooel-form-border-radius: 2px;\n --idooel-form-border-err-color: #F5222D;\n --idooel-link-06: #1890FF;\n --idooel-link-03: #91D5FF;\n --idooel-img-crop-err-color: #FFA39E;\n}\n.ant-input-disabled {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n.ant-select-disabled .ant-select-selection {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["index.vue"],"names":[],"mappings":"AAAA;EACE,qBAAqB;AACvB;AACA;EACE,cAAc;AAChB;AACA;EACE,cAAc;AAChB;AACA;EACE,cAAc;AAChB;AAEA;EACE,eAAe;AACjB;AAEA;EACE,+BAA+B;EAC/B,sCAAsC;EACtC,sCAAsC;EACtC,sCAAsC;EACtC,uCAAuC;EACvC,uCAAuC;EACvC,uCAAuC;EACvC,mDAAmD;EACnD,4BAA4B;EAC5B,4BAA4B;EAC5B,0BAA0B;EAC1B,wBAAwB;EACxB,8BAA8B;EAC9B,+BAA+B;EAC/B,qCAAqC;EACrC,2CAA2C;EAC3C,6BAA6B;EAC7B,iCAAiC;EACjC,qDAAqD;EACrD,kDAAkD;EAClD,gDAAgD;EAChD,gCAAgC;EAChC,uCAAuC;EACvC,yBAAyB;EACzB,yBAAyB;EACzB,oCAAoC;AACtC;AAEA;EACE,4DAA4D;AAC9D;AAEA;EACE,4DAA4D;AAC9D;;AAEA,oCAAoC","file":"index.vue","sourcesContent":[".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n\n.margin-t-8 {\n margin-top: 8px;\n}\n\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-odd-color: rgba(0, 0, 0, 0.04);\n --idooel-row-even-color: #FFF;\n --idooel-row-hover-color: #E6F7FF;\n --idooel-form-title-border-color: rgba(0, 0, 0, 0.16);\n --idooel-form-upload-bg-color: rgba(0, 0, 0, 0.02);\n --idooel-form-upload-border-hover-color: #40A9FF;\n --idooel-form-border-radius: 2px;\n --idooel-form-border-err-color: #F5222D;\n --idooel-link-06: #1890FF;\n --idooel-link-03: #91D5FF;\n --idooel-img-crop-err-color: #FFA39E;\n}\n\n.ant-input-disabled {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n.ant-select-disabled .ant-select-selection {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined })
|
|
7004
7049
|
,inject("data-v-bfb18322_1", { source: ".ele-timeline__wrapper[data-v-bfb18322] {\n width: 100%;\n height: 100%;\n}\n.ele-timeline__wrapper .ele-timeline__item[data-v-bfb18322] {\n display: flex;\n flex-direction: row;\n}\n.ele-timeline__wrapper .ele-timeline__item:last-child .ele-timeline__middle .ele-timeline__traline[data-v-bfb18322] {\n display: none;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__left[data-v-bfb18322] {\n flex: 1;\n padding-right: 12px;\n padding-top: 16px;\n padding-bottom: 16px;\n text-align: right;\n display: flex;\n flex-direction: row;\n justify-content: end;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__left .titleline-left__date[data-v-bfb18322] {\n width: 100px;\n font-size: 14px;\n color: var(--idoole-black-064);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__middle[data-v-bfb18322] {\n width: 10px;\n display: flex;\n flex-direction: column;\n align-items: center;\n transform: translate(0, 20px);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__middle .ele-timeline__circle[data-v-bfb18322] {\n width: 100%;\n height: 10px;\n border-radius: 50%;\n border-width: 2px;\n border-style: solid;\n border-color: var(--idooel-primary-color);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__middle .ele-timeline__traline[data-v-bfb18322] {\n width: 1px;\n height: calc(100% - 10px);\n border-width: 1px;\n border-style: solid;\n border-color: var(--idoole-black-016);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right[data-v-bfb18322] {\n text-align: left;\n flex: 2;\n padding-left: 12px;\n padding-top: 16px;\n padding-bottom: 16px;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__title[data-v-bfb18322] {\n line-height: 22px;\n display: flex;\n flex-direction: row;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__title .title[data-v-bfb18322] {\n color: var(--idoole-black-088);\n font-size: 14px;\n font-weight: bold;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__title .title-info[data-v-bfb18322] {\n font-size: 14px;\n color: var(--idoole-black-064);\n margin-left: 16px;\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__title .title-info[data-v-bfb18322]::before {\n content: \"\";\n display: inline-block;\n width: 6px;\n height: 6px;\n border-radius: 50%;\n margin-right: 8px;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__title .title-info.success[data-v-bfb18322]::before {\n background: var(--idoole-success-06);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__title .title-info.warning[data-v-bfb18322]::before {\n background: var(--idoole-warning-06);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__title .title-info.error[data-v-bfb18322]::before {\n background: var(--idoole-error-06);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__oper[data-v-bfb18322] {\n line-height: 22px;\n margin-top: 8px;\n margin-left: 12px;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__oper .oper-name[data-v-bfb18322] {\n color: var(--idoole-black-088);\n font-size: 14px;\n font-weight: bold;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__subtitle[data-v-bfb18322] {\n margin-left: 12px;\n display: flex;\n flex-direction: row;\n line-height: 22px;\n margin-top: 4px;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__subtitle .right-subtitle__field[data-v-bfb18322] {\n flex-shrink: 0;\n font-size: 14px;\n color: var(--idoole-black-064);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__subtitle .right-subtitle__content[data-v-bfb18322] {\n font-size: 14px;\n color: var(--idoole-black-088);\n font-weight: bold;\n margin-left: 4px;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["/Users/huangshan/Goldgov/front/ganjiao/base-elearning-frontend-model/packages/components/packages/timeline/src/index.vue","index.vue"],"names":[],"mappings":"AAiIA;EACA,WAAA;EACA,YAAA;AChIA;ADiIA;EACA,aAAA;EACA,mBAAA;AC/HA;ADkIA;EACA,aAAA;AChIA;ADoIA;EACA,OAAA;EACA,mBAAA;EACA,iBAAA;EACA,oBAAA;EACA,iBAAA;EACA,aAAA;EACA,mBAAA;EACA,oBAAA;AClIA;ADmIA;EACA,YAAA;EACA,eAAA;EACA,8BAAA;ACjIA;ADoIA;EACA,WAAA;EACA,aAAA;EACA,sBAAA;EACA,mBAAA;EACA,6BAAA;AClIA;ADmIA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,iBAAA;EACA,mBAAA;EACA,yCAAA;ACjIA;ADmIA;EACA,UAAA;EACA,yBAAA;EACA,iBAAA;EACA,mBAAA;EACA,qCAAA;ACjIA;ADoIA;EACA,gBAAA;EACA,OAAA;EACA,kBAAA;EACA,iBAAA;EACA,oBAAA;AClIA;ADmIA;EACA,iBAAA;EACA,aAAA;EACA,mBAAA;ACjIA;ADkIA;EACA,8BAAA;EACA,eAAA;EACA,iBAAA;AChIA;ADkIA;EACA,eAAA;EACA,8BAAA;EACA,iBAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;AChIA;ADiIA;EACA,WAAA;EACA,qBAAA;EACA,UAAA;EACA,WAAA;EACA,kBAAA;EACA,iBAAA;AC/HA;ADkIA;EACA,oCAAA;AChIA;ADoIA;EACA,oCAAA;AClIA;ADsIA;EACA,kCAAA;ACpIA;ADyIA;EACA,iBAAA;EACA,eAAA;EACA,iBAAA;ACvIA;ADwIA;EACA,8BAAA;EACA,eAAA;EACA,iBAAA;ACtIA;ADyIA;EACA,iBAAA;EACA,aAAA;EACA,mBAAA;EACA,iBAAA;EACA,eAAA;ACvIA;ADwIA;EACA,cAAA;EACA,eAAA;EACA,8BAAA;ACtIA;ADwIA;EACA,eAAA;EACA,8BAAA;EACA,iBAAA;EACA,gBAAA;ACtIA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\n <div class=\"ele-timeline__wrapper\">\n <div class=\"ele-timeline__item\" v-for=\"item in innerDataSource\" :key=\"item.key\">\n <div class=\"ele-timeline__left\">\n <div class=\"titleline-left__date\">{{ item.date }}</div>\n </div>\n <div class=\"ele-timeline__middle\">\n <div class=\"ele-timeline__circle\"></div>\n <div class=\"ele-timeline__traline\"></div>\n </div>\n <div class=\"ele-timeline__right\">\n <slot v-if=\"$scopedSlots.right\" name=\"right\" :data=\"item\"></slot>\n <template v-else>\n <div class=\"timeline-right__title\">\n <span class=\"title\">{{ item.title }}</span>\n <span :class=\"['title-info', item.state == 1 && 'success', item.state == 2 && 'warning', item.state == 3 && 'error']\">{{ item.stateName }}</span>\n </div>\n <div class=\"timeline-right__oper\">\n 由\n <span class=\"oper-name\">{{ item.userName }}</span>\n 操作\n </div>\n <div class=\"timeline-right__subtitle\" v-for=\"label in item.labelList\" :key=\"label.value\">\n <div class=\"right-subtitle__field\">{{ label.label }}:</div>\n <div class=\"right-subtitle__content\">{{ label.value }}</div>\n </div>\n </template>\n </div>\n </div>\n </div>\n</template>\n\n<script>\nimport { net, type } from '@idooel/shared'\nimport { v4 as uuidv4 } from 'uuid'\nimport { CONTEXT, parseFieldMap } from '../../utils'\nexport default {\n name: 'ele-timeline',\n props: {\n url: {\n type: String\n },\n params: {\n type: Object,\n default: () => ({})\n },\n requestType: {\n type: String,\n default: 'GET'\n },\n fieldMap: {\n type: Object,\n default: () => ({})\n },\n params: {\n type: Object,\n default: () => ({})\n },\n dataSource: {\n type: Array,\n default: () => ([\n // {\n // date: '2023/05/09 03:34:56',\n // title: 123,\n // state: 1,\n // stateName: '成功',\n // userName: 'Name',\n // labelList: [\n // {\n // label: 'label',\n // value: 'value'\n // }\n // ],\n // action: '结班',\n // opinion: '意见'\n // }\n ])\n }\n },\n data () {\n return {\n innerDataSource: []\n }\n },\n inject: {\n [CONTEXT]: {\n default: () => (() => ({}))\n }\n },\n computed: {\n expressionData () {\n return {\n _route: this.$route.query,\n ...this[CONTEXT]()\n }\n }\n },\n async created() {\n if (this.url) {\n this.innerDataSource = await this.requestData()\n } else if (!type.isEmpty(this.dataSource)) {\n this.innerDataSource = this.dataSource\n } else {\n console.warn('ele-timeline: 请传入数据源')\n }\n },\n methods: {\n async requestData () {\n const ret = await net[this.requestType.toLowerCase()](\n this.url,\n { ...this.params, ...parseFieldMap(this.fieldMap, this.expressionData) }\n ).then(resp => {\n const { data } = resp || {}\n return data.map(item => {\n return {\n key: uuidv4(),\n ...item\n }\n })\n })\n return ret\n }\n }\n}\n</script>\n<style lang=\"scss\">\n@import '../../theme/index';\n</style>\n<style lang=\"scss\" scoped>\n.ele-timeline__wrapper {\n width: 100%;\n height: 100%;\n .ele-timeline__item {\n display: flex;\n flex-direction: row;\n &:last-child {\n .ele-timeline__middle {\n .ele-timeline__traline {\n display: none;\n }\n }\n }\n .ele-timeline__left {\n flex: 1;\n padding-right: 12px;\n padding-top: 16px;\n padding-bottom: 16px;\n text-align: right;\n display: flex;\n flex-direction: row;\n justify-content: end;\n .titleline-left__date {\n width: 100px;\n font-size: 14px;\n color: var(--idoole-black-064);\n }\n }\n .ele-timeline__middle {\n width: 10px;\n display: flex;\n flex-direction: column;\n align-items: center;\n transform: translate(0, 20px);\n .ele-timeline__circle {\n width: 100%;\n height: 10px;\n border-radius: 50%;\n border-width: 2px;\n border-style: solid;\n border-color: var(--idooel-primary-color);\n }\n .ele-timeline__traline {\n width: 1px;\n height: calc(100% - 10px);\n border-width: 1px;\n border-style: solid;\n border-color: var(--idoole-black-016);\n }\n }\n .ele-timeline__right {\n text-align: left;\n flex: 2;\n padding-left: 12px;\n padding-top: 16px;\n padding-bottom: 16px;\n .timeline-right__title {\n line-height: 22px;\n display: flex;\n flex-direction: row;\n .title {\n color: var(--idoole-black-088);\n font-size: 14px;\n font-weight: bold;\n }\n .title-info {\n font-size: 14px;\n color: var(--idoole-black-064);\n margin-left: 16px;\n display: flex;\n flex-direction: row;\n align-items: center;\n &::before {\n content: '';\n display: inline-block;\n width: 6px;\n height: 6px;\n border-radius: 50%;\n margin-right: 8px;\n }\n &.success {\n &::before {\n background: var(--idoole-success-06);\n }\n }\n &.warning {\n &::before {\n background: var(--idoole-warning-06);\n }\n }\n &.error {\n &::before {\n background: var(--idoole-error-06);\n }\n }\n }\n }\n .timeline-right__oper {\n line-height: 22px;\n margin-top: 8px;\n margin-left: 12px;\n .oper-name {\n color: var(--idoole-black-088);\n font-size: 14px;\n font-weight: bold;\n }\n }\n .timeline-right__subtitle {\n margin-left: 12px;\n display: flex;\n flex-direction: row;\n line-height: 22px;\n margin-top: 4px;\n .right-subtitle__field {\n flex-shrink: 0;\n font-size: 14px;\n color: var(--idoole-black-064);\n }\n .right-subtitle__content {\n font-size: 14px;\n color: var(--idoole-black-088);\n font-weight: bold;\n margin-left: 4px;\n }\n }\n }\n }\n}\n</style>",".ele-timeline__wrapper {\n width: 100%;\n height: 100%;\n}\n.ele-timeline__wrapper .ele-timeline__item {\n display: flex;\n flex-direction: row;\n}\n.ele-timeline__wrapper .ele-timeline__item:last-child .ele-timeline__middle .ele-timeline__traline {\n display: none;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__left {\n flex: 1;\n padding-right: 12px;\n padding-top: 16px;\n padding-bottom: 16px;\n text-align: right;\n display: flex;\n flex-direction: row;\n justify-content: end;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__left .titleline-left__date {\n width: 100px;\n font-size: 14px;\n color: var(--idoole-black-064);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__middle {\n width: 10px;\n display: flex;\n flex-direction: column;\n align-items: center;\n transform: translate(0, 20px);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__middle .ele-timeline__circle {\n width: 100%;\n height: 10px;\n border-radius: 50%;\n border-width: 2px;\n border-style: solid;\n border-color: var(--idooel-primary-color);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__middle .ele-timeline__traline {\n width: 1px;\n height: calc(100% - 10px);\n border-width: 1px;\n border-style: solid;\n border-color: var(--idoole-black-016);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right {\n text-align: left;\n flex: 2;\n padding-left: 12px;\n padding-top: 16px;\n padding-bottom: 16px;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__title {\n line-height: 22px;\n display: flex;\n flex-direction: row;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__title .title {\n color: var(--idoole-black-088);\n font-size: 14px;\n font-weight: bold;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__title .title-info {\n font-size: 14px;\n color: var(--idoole-black-064);\n margin-left: 16px;\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__title .title-info::before {\n content: \"\";\n display: inline-block;\n width: 6px;\n height: 6px;\n border-radius: 50%;\n margin-right: 8px;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__title .title-info.success::before {\n background: var(--idoole-success-06);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__title .title-info.warning::before {\n background: var(--idoole-warning-06);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__title .title-info.error::before {\n background: var(--idoole-error-06);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__oper {\n line-height: 22px;\n margin-top: 8px;\n margin-left: 12px;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__oper .oper-name {\n color: var(--idoole-black-088);\n font-size: 14px;\n font-weight: bold;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__subtitle {\n margin-left: 12px;\n display: flex;\n flex-direction: row;\n line-height: 22px;\n margin-top: 4px;\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__subtitle .right-subtitle__field {\n flex-shrink: 0;\n font-size: 14px;\n color: var(--idoole-black-064);\n}\n.ele-timeline__wrapper .ele-timeline__item .ele-timeline__right .timeline-right__subtitle .right-subtitle__content {\n font-size: 14px;\n color: var(--idoole-black-088);\n font-weight: bold;\n margin-left: 4px;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
|
|
7005
7050
|
|
|
7006
7051
|
};
|
|
@@ -11202,7 +11247,7 @@ var __vue_render__$h = function () {
|
|
|
11202
11247
|
_vm._v(_vm._s(_vm.fileName)),
|
|
11203
11248
|
]),
|
|
11204
11249
|
_vm._v(" "),
|
|
11205
|
-
_vm.fileName
|
|
11250
|
+
_vm.fileId || _vm.fileName
|
|
11206
11251
|
? _c("a-icon", {
|
|
11207
11252
|
staticStyle: {
|
|
11208
11253
|
cursor: "pointer",
|
|
@@ -11249,11 +11294,11 @@ __vue_render__$h._withStripped = true;
|
|
|
11249
11294
|
/* style */
|
|
11250
11295
|
const __vue_inject_styles__$h = function (inject) {
|
|
11251
11296
|
if (!inject) return
|
|
11252
|
-
inject("data-v-54a0392d_0", { source: "[data-v-54a0392d] .ant-modal-body {\n padding: 16px;\n}\n[data-v-54a0392d] .ant-modal-header {\n padding: 16px;\n}\n.ele-imgCrop__wrapper[data-v-54a0392d] {\n display: flex;\n gap: 16px;\n justify-content: center;\n margin-bottom: 30px;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg[data-v-54a0392d] {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n position: relative;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .img-crop-left__image[data-v-54a0392d] {\n width: 100%;\n height: 100%;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload[data-v-54a0392d] {\n width: 100%;\n height: 100%;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload[data-v-54a0392d] .ele-upload__inner {\n height: 100%;\n border: unset;\n background: transparent !important;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload[data-v-54a0392d] .ele-upload__inner .ele-upload__area {\n display: flex;\n flex-direction: column;\n height: 100%;\n align-items: center;\n justify-content: center;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload[data-v-54a0392d] .ele-upload__inner .ele-upload__area .ele-upload__area--text {\n margin-top: 16px;\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-imgCrop__font1[data-v-54a0392d] {\n color: var(--idoole-black-088);\n font-size: 16px;\n line-height: 24px !important;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-imgCrop__font2[data-v-54a0392d] {\n color: var(--idoole-black-06);\n font-size: 14px;\n line-height: 22px;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__update[data-v-54a0392d] {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n cursor: pointer;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__right[data-v-54a0392d] {\n position: relative;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__right span[data-v-54a0392d] {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n.ele-imgCrop__wrapper .ele-imgCrop__right .img-crop-right__image[data-v-54a0392d] {\n width: 100%;\n height: 100%;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__item[data-v-54a0392d] {\n width: 480px;\n height: 300px;\n border-radius: 2px;\n border: 1px dashed var(--idooel-form-title-border-color);\n background: var(--idooel-form-upload-bg-color);\n}\n.ele-imgCrop__tips[data-v-54a0392d] {\n float: left;\n width: 80%;\n}\n.ele-imgCrop__error[data-v-54a0392d] {\n color: var(--idooel-form-border-err-color) !important;\n}\n.ele-imgCrop__error2[data-v-54a0392d] {\n color: var(--idooel-img-crop-err-color) !important;\n}\n.ele-imgCrop__icon[data-v-54a0392d] {\n font-size: 48px;\n color: var(--idooel-link-06);\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["/Users/huangshan/Goldgov/front/ganjiao/base-elearning-frontend-model/packages/components/packages/composite-components/modal-img-crop/src/index.vue","index.vue"],"names":[],"mappings":"AAoMA;EACA,aAAA;ACnMA;ADqMA;EACA,aAAA;AClMA;ADoMA;EACA,aAAA;EACA,SAAA;EACA,uBAAA;EACA,mBAAA;ACjMA;ADmMA;EACA,aAAA;EACA,sBAAA;EACA,uBAAA;EACA,mBAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;ACjMA;ADkMA;EACA,WAAA;EACA,YAAA;AChMA;ADkMA;EACA,WAAA;EACA,YAAA;AChMA;ADiMA;EACA,YAAA;EACA,aAAA;EACA,kCAAA;AC/LA;ADgMA;EACA,aAAA;EACA,sBAAA;EACA,YAAA;EACA,mBAAA;EACA,uBAAA;AC9LA;AD+LA;EACA,gBAAA;EACA,aAAA;EACA,sBAAA;EACA,mBAAA;AC7LA;ADkMA;EACA,8BAAA;EACA,eAAA;EACA,4BAAA;AChMA;ADkMA;EACA,6BAAA;EACA,eAAA;EACA,iBAAA;AChMA;ADmMA;EACA,kBAAA;EACA,MAAA;EACA,OAAA;EACA,WAAA;EACA,YAAA;EACA,UAAA;EACA,eAAA;ACjMA;ADoMA;EACA,kBAAA;AClMA;ADmMA;EACA,kBAAA;EACA,QAAA;EACA,SAAA;EACA,gCAAA;ACjMA;ADmMA;EACA,WAAA;EACA,YAAA;ACjMA;ADoMA;EACA,YAAA;EACA,aAAA;EACA,kBAAA;EACA,wDAAA;EACA,8CAAA;AClMA;ADqMA;EACA,WAAA;EACA,UAAA;AClMA;ADoMA;EACA,qDAAA;ACjMA;ADmMA;EACA,kDAAA;AChMA;ADkMA;EACA,eAAA;EACA,4BAAA;AC/LA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\n <div>\n <ele-modal\n :ref=\"getEleModal\"\n :title=\"title\"\n :cancelText=\"cancelText\"\n :maskClosable=\"maskClosable\"\n v-on=\"$listeners\"\n :size=\"size\"\n :value=\"value\"\n @ok=\"handleOk\"\n @cancel=\"handleCancel\"\n :showDefaultFooter=\"true\"\n >\n <div class=\"ele-imgCrop__wrapper\">\n <div class=\"ele-imgCrop__left ele-imgCrop__item\">\n <div class=\"ele-imgCrop__noImg\">\n <ele-upload v-if=\"!fileId\" v-bind=\"uploadFileConfig\" class=\"ele-img-crop__upload\" @on-success=\"onUploadFileSuccess\" icon=\"inbox\" url=\"api/zuul/api-file/workbench/file\"></ele-upload>\n <template v-else>\n <img :ref=\"leftImage\" class=\"img-crop-left__image\" :src=\"imageUrl\" alt=\"\">\n </template>\n </div>\n <div class=\"margin-t-8\">\n <span v-if=\"imgtips\" class=\"ele-imgCrop__font1 ele-imgCrop__tips\" :class=\"isFail? 'ele-imgCrop__error' : ''\">{{ imgtips }}</span>\n <template v-else>\n <span class=\"ele-imgCrop__font1\">{{ fileName }}</span>\n <a-icon v-if=\"fileName\" @click=\"handleClickDeleteFile\" type=\"close\" style=\"cursor: pointer;float: right; line-height: 24px;\"/>\n </template>\n </div>\n </div>\n <div class=\"ele-imgCrop__right ele-imgCrop__item\">\n <span v-if=\"!fileId\" class=\"ele-imgCrop__font2\">左侧上传图片后可预览</span>\n <template v-else>\n <img class=\"img-crop-right__image\" :src=\"previewBase\" alt=\"\">\n </template>\n </div>\n </div>\n </ele-modal>\n </div>\n</template>\n\n<script>\nimport { v4 as uuidv4 } from 'uuid'\nimport Cropper from 'cropperjs'\nimport { util, net } from '@idooel/shared'\nexport default {\n name: 'ele-modal-img-crop',\n model: {\n event: 'input',\n prop: 'value'\n },\n props: {\n title: {\n type: String,\n default: '图像裁剪'\n },\n uploadFileConfig: {\n type: Object,\n default: () => {\n return {\n size: 10,\n accept: '*',\n byteConversion: 1024 * 1024\n }\n }\n },\n imageId: {\n type: String\n },\n maskClosable: {\n type: Boolean,\n default () {\n return false\n }\n },\n size: {\n type: String,\n default () {\n return 'big'\n }\n },\n value: {\n type: Boolean,\n default () {\n return false\n }\n },\n cropperConfig: {\n type: Object,\n default: () => {\n return {\n aspectRatio: 16 / 9\n }\n }\n }\n },\n data () {\n return {\n haveImg: false,\n imgtips: null,\n isFail: false,\n cancelText: '取消',\n fileName: null,\n fileId: null,\n previewBase: null,\n cropper: null\n }\n },\n computed: {\n leftImage () {\n return uuidv4()\n },\n imageUrl () {\n return `/api-file/workbench/file/stream/${this.fileId}?origin=true`\n },\n getEleModal () {\n return uuidv4()\n }\n },\n watch: {\n value: {\n handler (value) {\n this.fileId = this.imageId\n if (value && this.fileId) {\n setTimeout(() => {\n this.initCropper()\n })\n }\n },\n immediate: true\n }\n },\n methods: {\n handleCancel () {\n this.$emit('input', false)\n this.$emit('change', this.fileId)\n },\n handleClickDeleteFile () {\n this.fileId = null\n this.fileName = null\n this.cropper && this.cropper.destroy()\n },\n blobToFile(blob, fileName = 'file.png') {\n return new File([blob], fileName, {\n type: blob.type,\n lastModified: Date.now()\n })\n },\n handleOk () {\n this.cropper && this.cropper.getCroppedCanvas().toBlob(async (blob) => {\n await this.uploadFile(this.blobToFile(blob, this.fileName))\n this.$emit('input', false)\n this.$emit('change', this.fileId)\n })\n },\n async uploadFile (file) {\n const formData = new FormData()\n formData.append('serviceCode', 'cover-image')\n formData.append('_t', Math.random())\n formData.append('file', file)\n await net.post(\n 'zuul/api-file/workbench/file' + '?_csrf=' + localStorage.getItem('token'),\n formData\n ).then((resp) => {\n const { data: { fileID } } = resp\n this.fileId = fileID\n })\n },\n initCropper () {\n let previewReady = false\n this.cropper = new Cropper(this.$refs[this.leftImage], {\n aspectRatio: this.cropperConfig.aspectRatio,\n ready: () => {\n previewReady = true\n },\n crop: util.debounce(() => {\n if (!previewReady) {\n return\n }\n this.previewBase = this.cropper.getCroppedCanvas().toDataURL()\n }, 200)\n })\n },\n onUploadFileSuccess (props) {\n const { response: { data: { fileID } }, name } = props\n this.fileId = fileID\n this.fileName = name\n this.$nextTick(() => {\n this.initCropper()\n })\n }\n }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n::v-deep .ant-modal-body {\n padding: 16px;\n}\n::v-deep .ant-modal-header {\n padding: 16px;\n}\n.ele-imgCrop__wrapper {\n display: flex;\n gap: 16px;\n justify-content: center;\n margin-bottom: 30px;\n .ele-imgCrop__left {\n .ele-imgCrop__noImg {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n position: relative;\n .img-crop-left__image {\n width: 100%;\n height: 100%;\n }\n .ele-img-crop__upload {\n width: 100%;\n height: 100%;\n ::v-deep .ele-upload__inner {\n height: 100%;\n border: unset;\n background: transparent !important;\n .ele-upload__area {\n display: flex;\n flex-direction: column;\n height: 100%;\n align-items: center;\n justify-content: center;\n .ele-upload__area--text {\n margin-top: 16px;\n display: flex;\n flex-direction: column;\n align-items: center;\n }\n }\n }\n }\n .ele-imgCrop__font1 {\n color: var(--idoole-black-088);\n font-size: 16px;\n line-height: 24px !important;\n }\n .ele-imgCrop__font2 {\n color: var(--idoole-black-06);\n font-size: 14px;\n line-height: 22px; \n }\n }\n .ele-imgCrop__update {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n cursor: pointer;\n }\n }\n .ele-imgCrop__right {\n position: relative;\n span {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n .img-crop-right__image {\n width: 100%;\n height: 100%;\n }\n }\n .ele-imgCrop__item {\n width: 480px;\n height: 300px;\n border-radius: 2px;\n border: 1px dashed var(--idooel-form-title-border-color);\n background: var(--idooel-form-upload-bg-color);\n }\n}\n.ele-imgCrop__tips {\n float: left;\n width: 80%;\n}\n.ele-imgCrop__error {\n color: var(--idooel-form-border-err-color) !important;\n}\n.ele-imgCrop__error2 {\n color: var(--idooel-img-crop-err-color) !important;\n}\n.ele-imgCrop__icon {\n font-size: 48px;\n color: var(--idooel-link-06);\n}\n</style>","::v-deep .ant-modal-body {\n padding: 16px;\n}\n\n::v-deep .ant-modal-header {\n padding: 16px;\n}\n\n.ele-imgCrop__wrapper {\n display: flex;\n gap: 16px;\n justify-content: center;\n margin-bottom: 30px;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n position: relative;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .img-crop-left__image {\n width: 100%;\n height: 100%;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload {\n width: 100%;\n height: 100%;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload ::v-deep .ele-upload__inner {\n height: 100%;\n border: unset;\n background: transparent !important;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload ::v-deep .ele-upload__inner .ele-upload__area {\n display: flex;\n flex-direction: column;\n height: 100%;\n align-items: center;\n justify-content: center;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload ::v-deep .ele-upload__inner .ele-upload__area .ele-upload__area--text {\n margin-top: 16px;\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-imgCrop__font1 {\n color: var(--idoole-black-088);\n font-size: 16px;\n line-height: 24px !important;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-imgCrop__font2 {\n color: var(--idoole-black-06);\n font-size: 14px;\n line-height: 22px;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__update {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n cursor: pointer;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__right {\n position: relative;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__right span {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n.ele-imgCrop__wrapper .ele-imgCrop__right .img-crop-right__image {\n width: 100%;\n height: 100%;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__item {\n width: 480px;\n height: 300px;\n border-radius: 2px;\n border: 1px dashed var(--idooel-form-title-border-color);\n background: var(--idooel-form-upload-bg-color);\n}\n\n.ele-imgCrop__tips {\n float: left;\n width: 80%;\n}\n\n.ele-imgCrop__error {\n color: var(--idooel-form-border-err-color) !important;\n}\n\n.ele-imgCrop__error2 {\n color: var(--idooel-img-crop-err-color) !important;\n}\n\n.ele-imgCrop__icon {\n font-size: 48px;\n color: var(--idooel-link-06);\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
|
|
11297
|
+
inject("data-v-600a1f56_0", { source: "[data-v-600a1f56] .ant-modal-body {\n padding: 16px;\n}\n[data-v-600a1f56] .ant-modal-header {\n padding: 16px;\n}\n.ele-imgCrop__wrapper[data-v-600a1f56] {\n display: flex;\n gap: 16px;\n justify-content: center;\n margin-bottom: 30px;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg[data-v-600a1f56] {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n position: relative;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .img-crop-left__image[data-v-600a1f56] {\n width: 100%;\n height: 100%;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload[data-v-600a1f56] {\n width: 100%;\n height: 100%;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload[data-v-600a1f56] .ele-upload__inner {\n height: 100%;\n border: unset;\n background: transparent !important;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload[data-v-600a1f56] .ele-upload__inner .ele-upload__area {\n display: flex;\n flex-direction: column;\n height: 100%;\n align-items: center;\n justify-content: center;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload[data-v-600a1f56] .ele-upload__inner .ele-upload__area .ele-upload__area--text {\n margin-top: 16px;\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-imgCrop__font1[data-v-600a1f56] {\n color: var(--idoole-black-088);\n font-size: 16px;\n line-height: 24px !important;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-imgCrop__font2[data-v-600a1f56] {\n color: var(--idoole-black-06);\n font-size: 14px;\n line-height: 22px;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__update[data-v-600a1f56] {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n cursor: pointer;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__right[data-v-600a1f56] {\n position: relative;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__right span[data-v-600a1f56] {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n.ele-imgCrop__wrapper .ele-imgCrop__right .img-crop-right__image[data-v-600a1f56] {\n width: 100%;\n height: 100%;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__item[data-v-600a1f56] {\n width: 480px;\n height: 300px;\n border-radius: 2px;\n border: 1px dashed var(--idooel-form-title-border-color);\n background: var(--idooel-form-upload-bg-color);\n}\n.ele-imgCrop__tips[data-v-600a1f56] {\n float: left;\n width: 80%;\n}\n.ele-imgCrop__error[data-v-600a1f56] {\n color: var(--idooel-form-border-err-color) !important;\n}\n.ele-imgCrop__error2[data-v-600a1f56] {\n color: var(--idooel-img-crop-err-color) !important;\n}\n.ele-imgCrop__icon[data-v-600a1f56] {\n font-size: 48px;\n color: var(--idooel-link-06);\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["/Users/huangshan/Goldgov/front/ganjiao/base-elearning-frontend-model/packages/components/packages/composite-components/modal-img-crop/src/index.vue","index.vue"],"names":[],"mappings":"AAoMA;EACA,aAAA;ACnMA;ADqMA;EACA,aAAA;AClMA;ADoMA;EACA,aAAA;EACA,SAAA;EACA,uBAAA;EACA,mBAAA;ACjMA;ADmMA;EACA,aAAA;EACA,sBAAA;EACA,uBAAA;EACA,mBAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;ACjMA;ADkMA;EACA,WAAA;EACA,YAAA;AChMA;ADkMA;EACA,WAAA;EACA,YAAA;AChMA;ADiMA;EACA,YAAA;EACA,aAAA;EACA,kCAAA;AC/LA;ADgMA;EACA,aAAA;EACA,sBAAA;EACA,YAAA;EACA,mBAAA;EACA,uBAAA;AC9LA;AD+LA;EACA,gBAAA;EACA,aAAA;EACA,sBAAA;EACA,mBAAA;AC7LA;ADkMA;EACA,8BAAA;EACA,eAAA;EACA,4BAAA;AChMA;ADkMA;EACA,6BAAA;EACA,eAAA;EACA,iBAAA;AChMA;ADmMA;EACA,kBAAA;EACA,MAAA;EACA,OAAA;EACA,WAAA;EACA,YAAA;EACA,UAAA;EACA,eAAA;ACjMA;ADoMA;EACA,kBAAA;AClMA;ADmMA;EACA,kBAAA;EACA,QAAA;EACA,SAAA;EACA,gCAAA;ACjMA;ADmMA;EACA,WAAA;EACA,YAAA;ACjMA;ADoMA;EACA,YAAA;EACA,aAAA;EACA,kBAAA;EACA,wDAAA;EACA,8CAAA;AClMA;ADqMA;EACA,WAAA;EACA,UAAA;AClMA;ADoMA;EACA,qDAAA;ACjMA;ADmMA;EACA,kDAAA;AChMA;ADkMA;EACA,eAAA;EACA,4BAAA;AC/LA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\n <div>\n <ele-modal\n :ref=\"getEleModal\"\n :title=\"title\"\n :cancelText=\"cancelText\"\n :maskClosable=\"maskClosable\"\n v-on=\"$listeners\"\n :size=\"size\"\n :value=\"value\"\n @ok=\"handleOk\"\n @cancel=\"handleCancel\"\n :showDefaultFooter=\"true\"\n >\n <div class=\"ele-imgCrop__wrapper\">\n <div class=\"ele-imgCrop__left ele-imgCrop__item\">\n <div class=\"ele-imgCrop__noImg\">\n <ele-upload v-if=\"!fileId\" v-bind=\"uploadFileConfig\" class=\"ele-img-crop__upload\" @on-success=\"onUploadFileSuccess\" icon=\"inbox\" url=\"api/zuul/api-file/workbench/file\"></ele-upload>\n <template v-else>\n <img :ref=\"leftImage\" class=\"img-crop-left__image\" :src=\"imageUrl\" alt=\"\">\n </template>\n </div>\n <div class=\"margin-t-8\">\n <span v-if=\"imgtips\" class=\"ele-imgCrop__font1 ele-imgCrop__tips\" :class=\"isFail? 'ele-imgCrop__error' : ''\">{{ imgtips }}</span>\n <template v-else>\n <span class=\"ele-imgCrop__font1\">{{ fileName }}</span>\n <a-icon v-if=\"fileId || fileName\" @click=\"handleClickDeleteFile\" type=\"close\" style=\"cursor: pointer;float: right; line-height: 24px;\"/>\n </template>\n </div>\n </div>\n <div class=\"ele-imgCrop__right ele-imgCrop__item\">\n <span v-if=\"!fileId\" class=\"ele-imgCrop__font2\">左侧上传图片后可预览</span>\n <template v-else>\n <img class=\"img-crop-right__image\" :src=\"previewBase\" alt=\"\">\n </template>\n </div>\n </div>\n </ele-modal>\n </div>\n</template>\n\n<script>\nimport { v4 as uuidv4 } from 'uuid'\nimport Cropper from 'cropperjs'\nimport { util, net } from '@idooel/shared'\nexport default {\n name: 'ele-modal-img-crop',\n model: {\n event: 'input',\n prop: 'value'\n },\n props: {\n title: {\n type: String,\n default: '图像裁剪'\n },\n uploadFileConfig: {\n type: Object,\n default: () => {\n return {\n size: 10,\n accept: '*',\n byteConversion: 1024 * 1024\n }\n }\n },\n imageId: {\n type: String\n },\n maskClosable: {\n type: Boolean,\n default () {\n return false\n }\n },\n size: {\n type: String,\n default () {\n return 'big'\n }\n },\n value: {\n type: Boolean,\n default () {\n return false\n }\n },\n cropperConfig: {\n type: Object,\n default: () => {\n return {\n aspectRatio: 16 / 9\n }\n }\n }\n },\n data () {\n return {\n haveImg: false,\n imgtips: null,\n isFail: false,\n cancelText: '取消',\n fileName: null,\n fileId: null,\n previewBase: null,\n cropper: null\n }\n },\n computed: {\n leftImage () {\n return uuidv4()\n },\n imageUrl () {\n return `/api-file/workbench/file/stream/${this.fileId}?origin=true`\n },\n getEleModal () {\n return uuidv4()\n }\n },\n watch: {\n value: {\n handler (value) {\n this.fileId = this.imageId\n if (value && this.fileId) {\n setTimeout(() => {\n this.initCropper()\n })\n }\n },\n immediate: true\n }\n },\n methods: {\n handleCancel () {\n this.$emit('input', false)\n this.$emit('change', this.fileId)\n },\n handleClickDeleteFile () {\n this.fileId = null\n this.fileName = null\n this.cropper && this.cropper.destroy()\n },\n blobToFile(blob, fileName = 'file.png') {\n return new File([blob], fileName, {\n type: blob.type,\n lastModified: Date.now()\n })\n },\n handleOk () {\n this.cropper && this.cropper.getCroppedCanvas().toBlob(async (blob) => {\n await this.uploadFile(this.blobToFile(blob, this.fileName))\n this.$emit('input', false)\n this.$emit('change', this.fileId)\n })\n },\n async uploadFile (file) {\n const formData = new FormData()\n formData.append('serviceCode', 'cover-image')\n formData.append('_t', Math.random())\n formData.append('file', file)\n await net.post(\n 'zuul/api-file/workbench/file' + '?_csrf=' + localStorage.getItem('token'),\n formData\n ).then((resp) => {\n const { data: { fileID } } = resp\n this.fileId = fileID\n })\n },\n initCropper () {\n let previewReady = false\n this.cropper = new Cropper(this.$refs[this.leftImage], {\n aspectRatio: this.cropperConfig.aspectRatio,\n ready: () => {\n previewReady = true\n },\n crop: util.debounce(() => {\n if (!previewReady) {\n return\n }\n this.previewBase = this.cropper.getCroppedCanvas().toDataURL()\n }, 200)\n })\n },\n onUploadFileSuccess (props) {\n const { response: { data: { fileID } }, name } = props\n this.fileId = fileID\n this.fileName = name\n this.$nextTick(() => {\n this.initCropper()\n })\n }\n }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n::v-deep .ant-modal-body {\n padding: 16px;\n}\n::v-deep .ant-modal-header {\n padding: 16px;\n}\n.ele-imgCrop__wrapper {\n display: flex;\n gap: 16px;\n justify-content: center;\n margin-bottom: 30px;\n .ele-imgCrop__left {\n .ele-imgCrop__noImg {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n position: relative;\n .img-crop-left__image {\n width: 100%;\n height: 100%;\n }\n .ele-img-crop__upload {\n width: 100%;\n height: 100%;\n ::v-deep .ele-upload__inner {\n height: 100%;\n border: unset;\n background: transparent !important;\n .ele-upload__area {\n display: flex;\n flex-direction: column;\n height: 100%;\n align-items: center;\n justify-content: center;\n .ele-upload__area--text {\n margin-top: 16px;\n display: flex;\n flex-direction: column;\n align-items: center;\n }\n }\n }\n }\n .ele-imgCrop__font1 {\n color: var(--idoole-black-088);\n font-size: 16px;\n line-height: 24px !important;\n }\n .ele-imgCrop__font2 {\n color: var(--idoole-black-06);\n font-size: 14px;\n line-height: 22px; \n }\n }\n .ele-imgCrop__update {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n cursor: pointer;\n }\n }\n .ele-imgCrop__right {\n position: relative;\n span {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n .img-crop-right__image {\n width: 100%;\n height: 100%;\n }\n }\n .ele-imgCrop__item {\n width: 480px;\n height: 300px;\n border-radius: 2px;\n border: 1px dashed var(--idooel-form-title-border-color);\n background: var(--idooel-form-upload-bg-color);\n }\n}\n.ele-imgCrop__tips {\n float: left;\n width: 80%;\n}\n.ele-imgCrop__error {\n color: var(--idooel-form-border-err-color) !important;\n}\n.ele-imgCrop__error2 {\n color: var(--idooel-img-crop-err-color) !important;\n}\n.ele-imgCrop__icon {\n font-size: 48px;\n color: var(--idooel-link-06);\n}\n</style>","::v-deep .ant-modal-body {\n padding: 16px;\n}\n\n::v-deep .ant-modal-header {\n padding: 16px;\n}\n\n.ele-imgCrop__wrapper {\n display: flex;\n gap: 16px;\n justify-content: center;\n margin-bottom: 30px;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n position: relative;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .img-crop-left__image {\n width: 100%;\n height: 100%;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload {\n width: 100%;\n height: 100%;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload ::v-deep .ele-upload__inner {\n height: 100%;\n border: unset;\n background: transparent !important;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload ::v-deep .ele-upload__inner .ele-upload__area {\n display: flex;\n flex-direction: column;\n height: 100%;\n align-items: center;\n justify-content: center;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-img-crop__upload ::v-deep .ele-upload__inner .ele-upload__area .ele-upload__area--text {\n margin-top: 16px;\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-imgCrop__font1 {\n color: var(--idoole-black-088);\n font-size: 16px;\n line-height: 24px !important;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__noImg .ele-imgCrop__font2 {\n color: var(--idoole-black-06);\n font-size: 14px;\n line-height: 22px;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__left .ele-imgCrop__update {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n cursor: pointer;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__right {\n position: relative;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__right span {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n.ele-imgCrop__wrapper .ele-imgCrop__right .img-crop-right__image {\n width: 100%;\n height: 100%;\n}\n.ele-imgCrop__wrapper .ele-imgCrop__item {\n width: 480px;\n height: 300px;\n border-radius: 2px;\n border: 1px dashed var(--idooel-form-title-border-color);\n background: var(--idooel-form-upload-bg-color);\n}\n\n.ele-imgCrop__tips {\n float: left;\n width: 80%;\n}\n\n.ele-imgCrop__error {\n color: var(--idooel-form-border-err-color) !important;\n}\n\n.ele-imgCrop__error2 {\n color: var(--idooel-img-crop-err-color) !important;\n}\n\n.ele-imgCrop__icon {\n font-size: 48px;\n color: var(--idooel-link-06);\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
|
|
11253
11298
|
|
|
11254
11299
|
};
|
|
11255
11300
|
/* scoped */
|
|
11256
|
-
const __vue_scope_id__$h = "data-v-
|
|
11301
|
+
const __vue_scope_id__$h = "data-v-600a1f56";
|
|
11257
11302
|
/* module identifier */
|
|
11258
11303
|
const __vue_module_identifier__$h = undefined;
|
|
11259
11304
|
/* functional template */
|
|
@@ -13108,7 +13153,7 @@ __vue_render__$7._withStripped = true;
|
|
|
13108
13153
|
/* style */
|
|
13109
13154
|
const __vue_inject_styles__$7 = function (inject) {
|
|
13110
13155
|
if (!inject) return
|
|
13111
|
-
inject("data-v-3cb4e50a_0", { source: ".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n.margin-t-8 {\n margin-top: 8px;\n}\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-even-color: #
|
|
13156
|
+
inject("data-v-3cb4e50a_0", { source: ".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n.margin-t-8 {\n margin-top: 8px;\n}\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-odd-color: rgba(0, 0, 0, 0.04);\n --idooel-row-even-color: #FFF;\n --idooel-row-hover-color: #E6F7FF;\n --idooel-form-title-border-color: rgba(0, 0, 0, 0.16);\n --idooel-form-upload-bg-color: rgba(0, 0, 0, 0.02);\n --idooel-form-upload-border-hover-color: #40A9FF;\n --idooel-form-border-radius: 2px;\n --idooel-form-border-err-color: #F5222D;\n --idooel-link-06: #1890FF;\n --idooel-link-03: #91D5FF;\n --idooel-img-crop-err-color: #FFA39E;\n}\n.ant-input-disabled {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n.ant-select-disabled .ant-select-selection {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["index.vue"],"names":[],"mappings":"AAAA;EACE,qBAAqB;AACvB;AACA;EACE,cAAc;AAChB;AACA;EACE,cAAc;AAChB;AACA;EACE,cAAc;AAChB;AAEA;EACE,eAAe;AACjB;AAEA;EACE,+BAA+B;EAC/B,sCAAsC;EACtC,sCAAsC;EACtC,sCAAsC;EACtC,uCAAuC;EACvC,uCAAuC;EACvC,uCAAuC;EACvC,mDAAmD;EACnD,4BAA4B;EAC5B,4BAA4B;EAC5B,0BAA0B;EAC1B,wBAAwB;EACxB,8BAA8B;EAC9B,+BAA+B;EAC/B,qCAAqC;EACrC,2CAA2C;EAC3C,6BAA6B;EAC7B,iCAAiC;EACjC,qDAAqD;EACrD,kDAAkD;EAClD,gDAAgD;EAChD,gCAAgC;EAChC,uCAAuC;EACvC,yBAAyB;EACzB,yBAAyB;EACzB,oCAAoC;AACtC;AAEA;EACE,4DAA4D;AAC9D;AAEA;EACE,4DAA4D;AAC9D;;AAEA,oCAAoC","file":"index.vue","sourcesContent":[".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n\n.margin-t-8 {\n margin-top: 8px;\n}\n\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-odd-color: rgba(0, 0, 0, 0.04);\n --idooel-row-even-color: #FFF;\n --idooel-row-hover-color: #E6F7FF;\n --idooel-form-title-border-color: rgba(0, 0, 0, 0.16);\n --idooel-form-upload-bg-color: rgba(0, 0, 0, 0.02);\n --idooel-form-upload-border-hover-color: #40A9FF;\n --idooel-form-border-radius: 2px;\n --idooel-form-border-err-color: #F5222D;\n --idooel-link-06: #1890FF;\n --idooel-link-03: #91D5FF;\n --idooel-img-crop-err-color: #FFA39E;\n}\n\n.ant-input-disabled {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n.ant-select-disabled .ant-select-selection {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined })
|
|
13112
13157
|
,inject("data-v-3cb4e50a_1", { source: ".ele-modal-confirm__content[data-v-3cb4e50a] {\n margin-top: 8px;\n color: var(--idoole-black-088);\n font-size: 14px;\n line-height: 22px;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["/Users/huangshan/Goldgov/front/ganjiao/base-elearning-frontend-model/packages/components/packages/composite-components/modal-confirm/src/index.vue","index.vue"],"names":[],"mappings":"AAiGA;EACA,eAAA;EACA,8BAAA;EACA,eAAA;EACA,iBAAA;AChGA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\n <ele-modal :title=\"title\" :value=\"value\" :size=\"size\" @cancel=\"onCancel\" v-on=\"overrideEvents\" :buttonGroupMeta=\"buttonGroupMeta\">\n <ele-alert v-if=\"alert\" v-bind=\"alert\"></ele-alert>\n <div v-if=\"contentText\" class=\"ele-modal-confirm__content\">\n {{ contentText }}\n </div>\n </ele-modal>\n</template>\n\n<script>\nimport { CONTEXT } from '../../../utils'\nexport default {\n name: 'ele-modal-confirm',\n model: {\n event: 'change',\n prop: 'value'\n },\n props: {\n title: {\n type: String\n },\n size: {\n type: String,\n default: 'small'\n },\n alert: {\n type: [Object, Boolean],\n default: () => ({\n type: 'warning',\n message: '确定要删除吗?',\n description: '删除后将无法恢复',\n closable: false\n })\n },\n contentText: {\n type: String\n },\n value: {\n type: Boolean,\n default: false\n },\n buttonGroupMeta: {\n type: Object\n },\n //!deprecated\n contextProp: {\n type: Object,\n default: () => ({})\n }\n },\n inject: {\n [CONTEXT]: {\n default: () => (() => ({}))\n }\n },\n data () {\n return {}\n },\n computed: {\n currentContext () {\n const { exposed: exposedData = {} } = this[CONTEXT]()\n const exposed = Object.assign({}, exposedData, { closeModalConfirm: this.closeModalConfirm })\n return {\n _route: this.$route.query,\n _routeMeta: this.$route.meta,\n ...this[CONTEXT](),\n exposed\n }\n },\n overrideEvents () {\n if (!this.buttonGroupMeta) return {}\n const { elements = [] } = this.buttonGroupMeta\n const events = elements.reduce((ret, ele) =>{\n ret[ele.eventName || 'click'] = (e) => {\n this.$emit(ele.eventName || 'click', { ...e, ...this.currentContext })\n }\n return ret\n }, {})\n return {\n ...events\n }\n }\n },\n methods: {\n closeModalConfirm () {\n this.$emit('change', false)\n },\n onCancel () {\n this.$emit('change', false)\n }\n }\n}\n</script>\n<style lang=\"scss\">\n@import '../../../theme/index';\n</style>\n<style lang=\"scss\" scoped>\n.ele-modal-confirm__content {\n margin-top: 8px;\n color: var(--idoole-black-088);\n font-size: 14px;\n line-height: 22px;\n}\n</style>",".ele-modal-confirm__content {\n margin-top: 8px;\n color: var(--idoole-black-088);\n font-size: 14px;\n line-height: 22px;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
|
|
13113
13158
|
|
|
13114
13159
|
};
|
|
@@ -13992,7 +14037,7 @@ __vue_render__$3._withStripped = true;
|
|
|
13992
14037
|
/* style */
|
|
13993
14038
|
const __vue_inject_styles__$3 = function (inject) {
|
|
13994
14039
|
if (!inject) return
|
|
13995
|
-
inject("data-v-202eba99_0", { source: ".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n.margin-t-8 {\n margin-top: 8px;\n}\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-even-color: #
|
|
14040
|
+
inject("data-v-202eba99_0", { source: ".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n.margin-t-8 {\n margin-top: 8px;\n}\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-odd-color: rgba(0, 0, 0, 0.04);\n --idooel-row-even-color: #FFF;\n --idooel-row-hover-color: #E6F7FF;\n --idooel-form-title-border-color: rgba(0, 0, 0, 0.16);\n --idooel-form-upload-bg-color: rgba(0, 0, 0, 0.02);\n --idooel-form-upload-border-hover-color: #40A9FF;\n --idooel-form-border-radius: 2px;\n --idooel-form-border-err-color: #F5222D;\n --idooel-link-06: #1890FF;\n --idooel-link-03: #91D5FF;\n --idooel-img-crop-err-color: #FFA39E;\n}\n.ant-input-disabled {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n.ant-select-disabled .ant-select-selection {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["index.vue"],"names":[],"mappings":"AAAA;EACE,qBAAqB;AACvB;AACA;EACE,cAAc;AAChB;AACA;EACE,cAAc;AAChB;AACA;EACE,cAAc;AAChB;AAEA;EACE,eAAe;AACjB;AAEA;EACE,+BAA+B;EAC/B,sCAAsC;EACtC,sCAAsC;EACtC,sCAAsC;EACtC,uCAAuC;EACvC,uCAAuC;EACvC,uCAAuC;EACvC,mDAAmD;EACnD,4BAA4B;EAC5B,4BAA4B;EAC5B,0BAA0B;EAC1B,wBAAwB;EACxB,8BAA8B;EAC9B,+BAA+B;EAC/B,qCAAqC;EACrC,2CAA2C;EAC3C,6BAA6B;EAC7B,iCAAiC;EACjC,qDAAqD;EACrD,kDAAkD;EAClD,gDAAgD;EAChD,gCAAgC;EAChC,uCAAuC;EACvC,yBAAyB;EACzB,yBAAyB;EACzB,oCAAoC;AACtC;AAEA;EACE,4DAA4D;AAC9D;AAEA;EACE,4DAA4D;AAC9D;;AAEA,oCAAoC","file":"index.vue","sourcesContent":[".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n\n.margin-t-8 {\n margin-top: 8px;\n}\n\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-odd-color: rgba(0, 0, 0, 0.04);\n --idooel-row-even-color: #FFF;\n --idooel-row-hover-color: #E6F7FF;\n --idooel-form-title-border-color: rgba(0, 0, 0, 0.16);\n --idooel-form-upload-bg-color: rgba(0, 0, 0, 0.02);\n --idooel-form-upload-border-hover-color: #40A9FF;\n --idooel-form-border-radius: 2px;\n --idooel-form-border-err-color: #F5222D;\n --idooel-link-06: #1890FF;\n --idooel-link-03: #91D5FF;\n --idooel-img-crop-err-color: #FFA39E;\n}\n\n.ant-input-disabled {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n.ant-select-disabled .ant-select-selection {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined })
|
|
13996
14041
|
,inject("data-v-202eba99_1", { source: ".import-download__link[data-v-202eba99] {\n color: var(--idooel-link-06);\n font-size: 14px;\n cursor: pointer;\n line-height: 22px;\n}\n.ele-modal-import__hint .import-hint__content[data-v-202eba99] {\n padding: 16px;\n border-radius: 2px;\n height: 82px;\n border: 1px dashed var(--idooel-link-06);\n background: var(--idoole-black-02);\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.ele-modal-import__hint .import-hint__content .import-hint__left .anticon-upload[data-v-202eba99] {\n font-size: 48px;\n color: var(--idooel-link-06);\n}\n.ele-modal-import__hint .import-hint__content .import-hint__right[data-v-202eba99] {\n margin-left: 16px;\n}\n.ele-modal-import__hint .import-hint__content .import-hint__right .hint-right__title[data-v-202eba99] {\n font-size: 16px;\n color: var(--idooel-link-06);\n cursor: pointer;\n}\n.ele-modal-import__hint .import-hint__content .import-hint__right .hint-right__sub-title[data-v-202eba99] {\n font-size: 14px;\n color: var(--idooel-link-03);\n}\n.ele-modal-import__hint .import-footer__hint--text[data-v-202eba99] {\n font-size: 14px;\n color: var(--idooel-link-06);\n line-height: 22px;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["/Users/huangshan/Goldgov/front/ganjiao/base-elearning-frontend-model/packages/components/packages/business-components/modal-import/src/index.vue","index.vue"],"names":[],"mappings":"AAkGA;EACA,4BAAA;EACA,eAAA;EACA,eAAA;EACA,iBAAA;ACjGA;ADoGA;EACA,aAAA;EACA,kBAAA;EACA,YAAA;EACA,wCAAA;EACA,kCAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;ACjGA;ADmGA;EACA,eAAA;EACA,4BAAA;ACjGA;ADoGA;EACA,iBAAA;AClGA;ADmGA;EACA,eAAA;EACA,4BAAA;EACA,eAAA;ACjGA;ADmGA;EACA,eAAA;EACA,4BAAA;ACjGA;ADqGA;EACA,eAAA;EACA,4BAAA;EACA,iBAAA;ACnGA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\n <ele-modal :value=\"innerValue\" :buttonGroupMeta=\"buttonGroupMeta\" @cancel=\"onCancel\" @handleClose=\"handleClose\" title=\"导入\">\n <div class=\"ele-modal-import__upload\" v-if=\"isFileEmpty\">\n <div class=\"import-download__link\" @click=\"handleClickDownloadTpl\">点击此链接下载导入模板</div>\n <ele-upload v-model=\"file\" @on-success=\"uploadFileSuccess\"></ele-upload>\n </div>\n <div v-else class=\"ele-modal-import__hint\">\n <div class=\"import-hint__content\">\n <div class=\"import-hint__left\">\n <ele-icon></ele-icon>\n </div>\n <div class=\"import-hint__right\">\n <div class=\"hint-right__title\" @click=\"handleClickJump\">文件上传成功,任务处理中..... 请点击此按钮跳转到“批处理管理”菜单查看任务进度</div>\n <div class=\"hint-right__sub-title\">批处理任务的准备工作会在后台运行</div>\n </div>\n </div>\n <div class=\"import-footer__hint--text\">\n 您可以请点击上方按钮查看任务进度或关闭弹框\n </div>\n </div>\n </ele-modal>\n</template>\n\n<script>\nimport { type } from '@idooel/shared'\nexport default {\n name: 'ele-modal-import',\n model: {\n prop: 'value',\n event: 'change'\n },\n props: {\n value: {\n type: Boolean,\n default: false\n }\n },\n data() {\n return {\n innerValue: false,\n file: [],\n buttonGroupMeta: {\n elements: [\n {\n label: '关闭',\n key: 'close',\n type: 'default',\n eventName: 'handleClose'\n }\n ]\n }\n }\n },\n computed: {\n isFileEmpty () {\n return type.isEmpty(this.file)\n }\n },\n watch: {\n value: {\n handler (value) {\n this.innerValue = value\n },\n immediate: true\n }\n },\n methods: {\n emitEvent (props = {}) {\n this.$emit('on-actions', { ...props })\n },\n onCancel () {\n this.innerValue = false\n this.$emit('change', false)\n },\n handleClickJump () {\n this.emitEvent({ action: 'jump' })\n },\n uploadFileSuccess (props) {\n this.emitEvent({ action: 'uploaded', file: props })\n },\n handleClickDownloadTpl () {\n this.emitEvent({ action: 'download' })\n },\n cleanFile () {\n this.file = []\n },\n handleClose () {\n this.cleanFile()\n this.innerValue = false\n this.$emit('change', false)\n }\n }\n}\n</script>\n<style lang=\"scss\">\n@import '../../../theme/index';\n</style>\n<style lang=\"scss\" scoped>\n.import-download__link {\n color: var(--idooel-link-06);\n font-size: 14px;\n cursor: pointer;\n line-height: 22px;\n}\n.ele-modal-import__hint {\n .import-hint__content {\n padding: 16px;\n border-radius: 2px;\n height: 82px;\n border: 1px dashed var(--idooel-link-06);\n background: var(--idoole-black-02);\n display: flex;\n flex-direction: row;\n align-items: center;\n .import-hint__left {\n .anticon-upload {\n font-size: 48px;\n color: var(--idooel-link-06);\n }\n }\n .import-hint__right {\n margin-left: 16px;\n .hint-right__title {\n font-size: 16px;\n color: var(--idooel-link-06);\n cursor: pointer;\n }\n .hint-right__sub-title {\n font-size: 14px;\n color: var(--idooel-link-03);\n }\n }\n }\n .import-footer__hint--text {\n font-size: 14px;\n color: var(--idooel-link-06);\n line-height: 22px;\n }\n}\n</style>",".import-download__link {\n color: var(--idooel-link-06);\n font-size: 14px;\n cursor: pointer;\n line-height: 22px;\n}\n\n.ele-modal-import__hint .import-hint__content {\n padding: 16px;\n border-radius: 2px;\n height: 82px;\n border: 1px dashed var(--idooel-link-06);\n background: var(--idoole-black-02);\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.ele-modal-import__hint .import-hint__content .import-hint__left .anticon-upload {\n font-size: 48px;\n color: var(--idooel-link-06);\n}\n.ele-modal-import__hint .import-hint__content .import-hint__right {\n margin-left: 16px;\n}\n.ele-modal-import__hint .import-hint__content .import-hint__right .hint-right__title {\n font-size: 16px;\n color: var(--idooel-link-06);\n cursor: pointer;\n}\n.ele-modal-import__hint .import-hint__content .import-hint__right .hint-right__sub-title {\n font-size: 14px;\n color: var(--idooel-link-03);\n}\n.ele-modal-import__hint .import-footer__hint--text {\n font-size: 14px;\n color: var(--idooel-link-06);\n line-height: 22px;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
|
|
13997
14042
|
|
|
13998
14043
|
};
|
|
@@ -14351,7 +14396,7 @@ __vue_render__$1._withStripped = true;
|
|
|
14351
14396
|
/* style */
|
|
14352
14397
|
const __vue_inject_styles__$1 = function (inject) {
|
|
14353
14398
|
if (!inject) return
|
|
14354
|
-
inject("data-v-47597df6_0", { source: ".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n.margin-t-8 {\n margin-top: 8px;\n}\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-even-color: #
|
|
14399
|
+
inject("data-v-47597df6_0", { source: ".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n.margin-t-8 {\n margin-top: 8px;\n}\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-odd-color: rgba(0, 0, 0, 0.04);\n --idooel-row-even-color: #FFF;\n --idooel-row-hover-color: #E6F7FF;\n --idooel-form-title-border-color: rgba(0, 0, 0, 0.16);\n --idooel-form-upload-bg-color: rgba(0, 0, 0, 0.02);\n --idooel-form-upload-border-hover-color: #40A9FF;\n --idooel-form-border-radius: 2px;\n --idooel-form-border-err-color: #F5222D;\n --idooel-link-06: #1890FF;\n --idooel-link-03: #91D5FF;\n --idooel-img-crop-err-color: #FFA39E;\n}\n.ant-input-disabled {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n.ant-select-disabled .ant-select-selection {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["index.vue"],"names":[],"mappings":"AAAA;EACE,qBAAqB;AACvB;AACA;EACE,cAAc;AAChB;AACA;EACE,cAAc;AAChB;AACA;EACE,cAAc;AAChB;AAEA;EACE,eAAe;AACjB;AAEA;EACE,+BAA+B;EAC/B,sCAAsC;EACtC,sCAAsC;EACtC,sCAAsC;EACtC,uCAAuC;EACvC,uCAAuC;EACvC,uCAAuC;EACvC,mDAAmD;EACnD,4BAA4B;EAC5B,4BAA4B;EAC5B,0BAA0B;EAC1B,wBAAwB;EACxB,8BAA8B;EAC9B,+BAA+B;EAC/B,qCAAqC;EACrC,2CAA2C;EAC3C,6BAA6B;EAC7B,iCAAiC;EACjC,qDAAqD;EACrD,kDAAkD;EAClD,gDAAgD;EAChD,gCAAgC;EAChC,uCAAuC;EACvC,yBAAyB;EACzB,yBAAyB;EACzB,oCAAoC;AACtC;AAEA;EACE,4DAA4D;AAC9D;AAEA;EACE,4DAA4D;AAC9D;;AAEA,oCAAoC","file":"index.vue","sourcesContent":[".has-error .ele-upload__wrapper .ele-upload__inner {\n border-color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--icon .anticon-cloud-upload {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__message {\n color: #F5222D;\n}\n.has-error .ele-upload__wrapper .ele-upload__inner .ele-upload__area .ele-upload__area--text .ele-upload__ext {\n color: #FFA39E;\n}\n\n.margin-t-8 {\n margin-top: 8px;\n}\n\n:root {\n --idooel-primary-color: #1890FF;\n --idoole-black-02: rgba(0, 0, 0, 0.04);\n --idoole-black-06: rgba(0, 0, 0, 0.44);\n --idoole-black-07: rgba(0, 0, 0, 0.64);\n --idoole-black-064: rgba(0, 0, 0, 0.64);\n --idoole-black-088: rgba(0, 0, 0, 0.88);\n --idoole-black-016: rgba(0, 0, 0, 0.16);\n --idooel-disabled-border-color: rgba(0, 0, 0, 0.16);\n --idoole-success-06: #52C41A;\n --idoole-warning-06: #FAAD14;\n --idoole-error-06: #F5222D;\n --idooel-border-width: 2;\n --idooel-border-color: #53a8ff;\n --idooel-column-border-width: 1;\n --idooel-column-border-color: #d9ecff;\n --idooel-row-odd-color: rgba(0, 0, 0, 0.04);\n --idooel-row-even-color: #FFF;\n --idooel-row-hover-color: #E6F7FF;\n --idooel-form-title-border-color: rgba(0, 0, 0, 0.16);\n --idooel-form-upload-bg-color: rgba(0, 0, 0, 0.02);\n --idooel-form-upload-border-hover-color: #40A9FF;\n --idooel-form-border-radius: 2px;\n --idooel-form-border-err-color: #F5222D;\n --idooel-link-06: #1890FF;\n --idooel-link-03: #91D5FF;\n --idooel-img-crop-err-color: #FFA39E;\n}\n\n.ant-input-disabled {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n.ant-select-disabled .ant-select-selection {\n border-color: var(--idooel-disabled-border-color) !important;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined })
|
|
14355
14400
|
,inject("data-v-47597df6_1", { source: ".ele-modal-fsm__display[data-v-47597df6] {\n display: flex;\n flex-direction: row;\n font-size: 14px;\n line-height: 22px;\n}\n.ele-modal-fsm__display .fms-display__name[data-v-47597df6], .ele-modal-fsm__display .fms-display__action[data-v-47597df6] {\n font-weight: bold;\n color: var(--idoole-black-088);\n}\n.ele-modal-fsm__display .fms-display__name[data-v-47597df6]::before, .ele-modal-fsm__display .fms-display__action[data-v-47597df6]::before {\n content: \"\";\n margin-left: 4px;\n}\n.ele-modal-fsm__display .fms-display__name[data-v-47597df6]::after, .ele-modal-fsm__display .fms-display__action[data-v-47597df6]::after {\n content: \"\";\n margin-right: 4px;\n}\n.ele-modal-fsm__display .title-info[data-v-47597df6] {\n font-size: 14px;\n color: var(--idoole-black-064);\n margin-left: 16px;\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.ele-modal-fsm__display .title-info[data-v-47597df6]::before {\n content: \"\";\n display: inline-block;\n width: 6px;\n height: 6px;\n border-radius: 50%;\n margin-right: 8px;\n}\n.ele-modal-fsm__display .title-info.success[data-v-47597df6]::before {\n background: var(--idoole-success-06);\n}\n.ele-modal-fsm__display .title-info.warning[data-v-47597df6]::before {\n background: var(--idoole-warning-06);\n}\n.ele-modal-fsm__display .title-info.error[data-v-47597df6]::before {\n background: var(--idoole-error-06);\n}\n.ele-modal-fsm__opinion-wrapper[data-v-47597df6] {\n margin-top: 4px;\n line-height: 22px;\n font-size: 14px;\n display: flex;\n flex-direction: row;\n}\n.ele-modal-fsm__opinion-wrapper .fsm-opinion__label[data-v-47597df6] {\n width: 42px;\n flex-shrink: 0;\n color: var(--idoole-black-064);\n}\n.ele-modal-fsm__opinion-wrapper .fsm-opinion__value[data-v-47597df6] {\n color: var(--idoole-black-088);\n font-weight: bold;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["/Users/huangshan/Goldgov/front/ganjiao/base-elearning-frontend-model/packages/components/packages/business-components/modal-fsm/src/index.vue","index.vue"],"names":[],"mappings":"AAkGA;EACA,aAAA;EACA,mBAAA;EACA,eAAA;EACA,iBAAA;ACjGA;ADkGA;EACA,iBAAA;EACA,8BAAA;AChGA;ADiGA;EACA,WAAA;EACA,gBAAA;AC/FA;ADiGA;EACA,WAAA;EACA,iBAAA;AC/FA;ADkGA;EACA,eAAA;EACA,8BAAA;EACA,iBAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;AChGA;ADiGA;EACA,WAAA;EACA,qBAAA;EACA,UAAA;EACA,WAAA;EACA,kBAAA;EACA,iBAAA;AC/FA;ADkGA;EACA,oCAAA;AChGA;ADoGA;EACA,oCAAA;AClGA;ADsGA;EACA,kCAAA;ACpGA;ADyGA;EACA,eAAA;EACA,iBAAA;EACA,eAAA;EACA,aAAA;EACA,mBAAA;ACtGA;ADuGA;EACA,WAAA;EACA,cAAA;EACA,8BAAA;ACrGA;ADuGA;EACA,8BAAA;EACA,iBAAA;ACrGA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\n <ele-modal v-on=\"$listeners\" :value=\"value\" :title=\"meta.title || title\" @cancel=\"handleCancel\" :buttonGroupMeta=\"buttonGroupMeta\">\n <slot name=\"alert\"></slot>\n <ele-timeline v-bind=\"meta\">\n <template #right=\"{ data: item }\">\n <div class=\"ele-modal-fsm__display\">\n <span>由</span>\n <span class=\"fms-display__name\">{{ item.userName || '管理员' }}</span>\n <span>执行了</span>\n <span class=\"fms-display__action\">{{ item.action || '结班' }}</span>\n <span>操作</span>\n <span :class=\"['title-info', item.state == 1 && 'success', item.state == 2 && 'warning', item.state == 3 && 'error']\">{{ item.stateName }}</span>\n </div>\n <div class=\"ele-modal-fsm__opinion-wrapper\">\n <div class=\"fsm-opinion__label\">意见:</div>\n <div class=\"fsm-opinion__value\">{{ item.opinion }}</div>\n </div>\n </template>\n </ele-timeline>\n <template v-if=\"showTextSlot\" #footer-text>\n <ele-text v-bind=\"textAttrs\"></ele-text>\n </template>\n </ele-modal>\n</template>\n\n<script>\nimport { CONTEXT } from '../../../utils'\nimport { type } from '@idooel/shared'\nexport default {\n name: 'ele-modal-fsm',\n model: {\n prop: 'value',\n event: 'change'\n },\n props: {\n value: {\n type: Boolean,\n default: false\n },\n title: {\n type: String,\n default: '状态变更记录'\n },\n meta: {\n type: Object,\n default: () => ({})\n },\n buttonGroupMeta: {\n type: Object,\n default: () => {\n return {\n elements: [\n {\n label: '关闭',\n key: 'cancel',\n type: 'default',\n eventName: 'cancel'\n }\n ]\n }\n }\n },\n contextProp: {\n type: Object,\n default: () => ({})\n }\n },\n provide() {\n return {\n [CONTEXT]: () => {\n return {\n _route: this.$route.query,\n _routeMeta: this.$route.meta,\n ...this.contextProp\n }\n }\n }\n },\n computed: {\n showTextSlot () {\n return !type.isEmpty(this.textAttrs)\n },\n textAttrs() {\n const { text = {} } = this.buttonGroupMeta\n return text\n }\n },\n methods: {\n handleCancel () {\n this.$emit('change', false)\n }\n }\n}\n</script>\n<style lang=\"scss\">\n@import '../../../theme/index';\n</style>\n<style lang=\"scss\" scoped>\n.ele-modal-fsm__display {\n display: flex;\n flex-direction: row;\n font-size: 14px;\n line-height: 22px;\n .fms-display__name, .fms-display__action {\n font-weight: bold;\n color: var(--idoole-black-088);\n &::before {\n content: '';\n margin-left: 4px;\n }\n &::after {\n content: '';\n margin-right: 4px;\n }\n }\n .title-info {\n font-size: 14px;\n color: var(--idoole-black-064);\n margin-left: 16px;\n display: flex;\n flex-direction: row;\n align-items: center;\n &::before {\n content: '';\n display: inline-block;\n width: 6px;\n height: 6px;\n border-radius: 50%;\n margin-right: 8px;\n }\n &.success {\n &::before {\n background: var(--idoole-success-06);\n }\n }\n &.warning {\n &::before {\n background: var(--idoole-warning-06);\n }\n }\n &.error {\n &::before {\n background: var(--idoole-error-06);\n }\n }\n }\n}\n.ele-modal-fsm__opinion-wrapper {\n margin-top: 4px;\n line-height: 22px;\n font-size: 14px;\n display: flex;\n flex-direction: row;\n .fsm-opinion__label {\n width: 42px;\n flex-shrink: 0;\n color: var(--idoole-black-064);\n }\n .fsm-opinion__value {\n color: var(--idoole-black-088);\n font-weight: bold;\n }\n}\n</style>",".ele-modal-fsm__display {\n display: flex;\n flex-direction: row;\n font-size: 14px;\n line-height: 22px;\n}\n.ele-modal-fsm__display .fms-display__name, .ele-modal-fsm__display .fms-display__action {\n font-weight: bold;\n color: var(--idoole-black-088);\n}\n.ele-modal-fsm__display .fms-display__name::before, .ele-modal-fsm__display .fms-display__action::before {\n content: \"\";\n margin-left: 4px;\n}\n.ele-modal-fsm__display .fms-display__name::after, .ele-modal-fsm__display .fms-display__action::after {\n content: \"\";\n margin-right: 4px;\n}\n.ele-modal-fsm__display .title-info {\n font-size: 14px;\n color: var(--idoole-black-064);\n margin-left: 16px;\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.ele-modal-fsm__display .title-info::before {\n content: \"\";\n display: inline-block;\n width: 6px;\n height: 6px;\n border-radius: 50%;\n margin-right: 8px;\n}\n.ele-modal-fsm__display .title-info.success::before {\n background: var(--idoole-success-06);\n}\n.ele-modal-fsm__display .title-info.warning::before {\n background: var(--idoole-warning-06);\n}\n.ele-modal-fsm__display .title-info.error::before {\n background: var(--idoole-error-06);\n}\n\n.ele-modal-fsm__opinion-wrapper {\n margin-top: 4px;\n line-height: 22px;\n font-size: 14px;\n display: flex;\n flex-direction: row;\n}\n.ele-modal-fsm__opinion-wrapper .fsm-opinion__label {\n width: 42px;\n flex-shrink: 0;\n color: var(--idoole-black-064);\n}\n.ele-modal-fsm__opinion-wrapper .fsm-opinion__value {\n color: var(--idoole-black-088);\n font-weight: bold;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
|
|
14356
14401
|
|
|
14357
14402
|
};
|