import { h } from 'atomico';
import 'funfix';
import { g as getComponentOrDefine, r as redirect } from './chunks/65ef80fe.js';
import './kun-icon.js';
import './kun-button-puer.js';

const _jsxFileName = "/Users/rang/rang/frond_ng/packages/six/src/components/kun-profile-header/kun-profile-header.tsx";
const style = `
.profile-header {
 height: 305px;
 position: relative;
}

 .user-img {
      --deckgo-lazy-img-border-radius: 8px;
      --deckgo-lazy-img-height: 150px;
      --deckgo-lazy-img-width: 150px;
 }
 
 .img-header {
  height: 165px;
  width： 100%;
  background-image: url("https://file.wintercoming.xyz/1.jpg");
 }
 
 .action {
   color:rgba(153,153,153,1);
   line-height:25px;
   font-size: 18px;
 }
 
 .counts {
   display: flex;
   flex-direction: row;
   justify-content: flex-start;
   align-items: center;
 }
 
 .profile-name {
     display:flex;
     justify-content: flex-start;
 }

 .authorName {
    font-size: 32px;
    color:rgba(40,40,40,1);
    line-height:46px;
    margin-bottom: 10px;
 }
 
 .bottom-aligns {
  padding: 0 10px 20px 28px;
  position: absolute;
  bottom: 0;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  box-sizing: border-box;
  width: 100%;
}

  .name-area {
    display: flex;
    margin-left: 34px;
    flex-direction: column;
    justify-content: flex-end;  
 }
 
 .num {
  color:rgba(40,40,40,1);
  line-height:35px;
  font-size: 25px;
 }
 
 .vd {
  width: 1px;
  margin-top: 5%;
  background-color: rgba(226, 226, 226, 1);
  height: 60%;
  margin: 0 25px;
 }

`;

/**
 * @param {object} props
 * @param {string} props.needleTitle
 *
 */
function KunProfileHeader(props) {
  const goToEditProfile = () => {
    redirect("/web/plume/profile");
  };

  return (
    h('host', { shadowDom: true, __self: this, __source: {fileName: _jsxFileName, lineNumber: 94}}
      , h('style', {__self: this, __source: {fileName: _jsxFileName, lineNumber: 95}}, style)
      , h('div', { className: "profile-header", __self: this, __source: {fileName: _jsxFileName, lineNumber: 96}}
        , h('div', { className: "img-header", __self: this, __source: {fileName: _jsxFileName, lineNumber: 97}} )

        , h('div', { className: "bottom-aligns", __self: this, __source: {fileName: _jsxFileName, lineNumber: 99}}
          , h('div', { className: "profile-name", __self: this, __source: {fileName: _jsxFileName, lineNumber: 100}}
            , h('deckgo-lazy-img', {
              className: "user-img",
              'img-src': props.seriesCover || "https://upload.jianshu.io/book/image/d6c850c6-13f5-408a-ba3c-fb3b4ef631c3?imageMogr2/auto-orient/strip|imageView2/1/w/214/h/286", __self: this, __source: {fileName: _jsxFileName, lineNumber: 101}}
            )

            , h('div', { className: "name-area", __self: this, __source: {fileName: _jsxFileName, lineNumber: 106}}
              , h('span', { className: "authorName", __self: this, __source: {fileName: _jsxFileName, lineNumber: 107}}, props.needleTitle)

              , h('div', { className: "counts", __self: this, __source: {fileName: _jsxFileName, lineNumber: 109}}
                , h('div', {__self: this, __source: {fileName: _jsxFileName, lineNumber: 110}}
                  , h('span', { className: "num", __self: this, __source: {fileName: _jsxFileName, lineNumber: 111}}, "333")
                  , h('div', { className: "action", __self: this, __source: {fileName: _jsxFileName, lineNumber: 112}}, "关注")
                )

                , h('div', { className: "vd", __self: this, __source: {fileName: _jsxFileName, lineNumber: 115}} )

                , h('div', {__self: this, __source: {fileName: _jsxFileName, lineNumber: 117}}
                  , h('span', { className: "num", __self: this, __source: {fileName: _jsxFileName, lineNumber: 118}}, "333")
                  , h('div', { className: "action", __self: this, __source: {fileName: _jsxFileName, lineNumber: 119}}, "关注")
                )

                , h('div', { className: "vd", __self: this, __source: {fileName: _jsxFileName, lineNumber: 122}} )

                , h('div', {__self: this, __source: {fileName: _jsxFileName, lineNumber: 124}}
                  , h('span', { className: "num", __self: this, __source: {fileName: _jsxFileName, lineNumber: 125}}, "333")
                  , h('div', { className: "action", __self: this, __source: {fileName: _jsxFileName, lineNumber: 126}}, "专辑")
                )
              )

            )
          )
          , h('kun-button-puer', { needleContent: "编辑个人资料", onclick: () => goToEditProfile(), __self: this, __source: {fileName: _jsxFileName, lineNumber: 132}} )
        )
      )
    )
  );
}

KunProfileHeader.props = {
  needleTitle: {
    type: String,
    value: "kun-profile-header",
    reflect: true,
    event: {
      type: "changeMessage",
    },
  },
};

var kunProfileHeader = getComponentOrDefine("kun-profile-header", KunProfileHeader);

export default kunProfileHeader;
export { KunProfileHeader };
